Image optimisation – Go Sitebuilder

April 29, 2020April 28, 2020

How to manage images on your website

Images are an important part of any website. In fact, websites with images get 94% more views than those without, so if you want to entice potential customers to your site, you can’t ignore them. However, you can’t just upload lots of randomly generated images and hope that it will increase traffic. Check out our blog post on how images enhance a website to see how you can make your images work for you.

Having an image-heavy site could mean that your website homepage becomes slow to load, or could confuse users if the photos aren’t related to your product. We’ve compiled a handy guide to help you manage images so that your visitors will have a great user experience, regardless of how many photos you choose.

How do I make images load faster on my website?

Google web research says that the best loading time for your website is under three seconds. It’s crucial to make sure that your website loads in this time, as if it takes longer, even between 3-5 seconds, there is a 90% bounce rate. Their research also found that 79% of online shoppers that have trouble with website performance – like slow loading speed – say that they won’t return to that site again.

Use a loading speed analyser like GTmetrix to see how long your site takes to load – if it’s longer than 3 seconds then read on to find out what you can do!

Image file size

Most often, when you find a picture that you think is perfect for your website, you don’t think about whether it is the right size, and you upload it straight away. It’s good to start with a high-quality image, whether that is your own photo, one from a free stock image website like Pixabay, Pexels and Unsplash, or Go Sitebuilder’s ready-to-use stock image directory. However, to streamline your site you might need to make the images smaller so they don’t take up so much space.

Resolution

The resolution of your image refers to the quality of the image and is measured in dots per inch (DPI). The more dots per inch, the better quality your image will be. This is very important when processing images for print, but most computer monitors display a maximum of 72DPI. That means that any image with a higher resolution than 72DPI is overkill; your visitors won’t notice the difference and your image will be taking up unnecessary space.

To see the resolution of an image on Windows, right click on your image file name and select Properties → Details. Click on the image tab within the window, and you’ll see the DPI labelled horizontal resolution and vertical resolution. On a Mac, open the image in preview and select Tools → Adjust Size and you’ll find the option under resolution. You can use Photoshop or Gimp Image editing software to change the resolution, or an online converter like convert.town.

Reduce file size even more

Reducing the resolution will also reduce the file size, but to make the file size even smaller, it’s a good idea to put the 72DPI image through an online compressor like Compressor, Tiny PNG or Optimizilla. This drastically reduces your file size but with an almost indiscernible difference in image quality. Don’t believe us? Have a look at the difference:

Choose the right file type

Most images in websites are found in three file types: PNG, JPG (or JPEG) and GIF. You shouldn’t be uploading any other image files to your website, so if you have a file type you’ve never seen before, open it and click File → Save as and change the file type, or click File → Export as + JPG/PNG/GIF. But which file type should you use for which image?

Use JPG for photos and photorealistic images
Use PNG for computer generated images and graphics where transparency is required
Use GIF for small animations

Top tip – if you’re taking a screenshot it will likely save as PNG. If you’re going to upload it to your website, make sure you export it as a JPG first. Adhering to these simple file type rules will make your images work better for you.

Optimise your file names and alt-tags

This might be boring, but it’s very important! To help with SEO, you want Google’s crawl bots to look at your site and check that it is all relevant to your topic, and these crawl bots can’t “see” images in the same way we can. So, when it comes across a file name called DSC43953, it is not going to know whether it is related to your business or not. You don’t need to put in a long description, but if you sell bespoke ceramics and your image is called “white-glazed-pot” then search engines will understand what it is.

The same goes for alt-tags. You should be able to alter these within your website builder, and you want to describe it as if to a friend who is wearing a blindfold, using as few words as possible. Avoid using small words like “a” and “the” as you don’t need them. “White pot on table” is fine. Ideally you want to use your keywords for both file names, but don’t shove it in there if it doesn’t make sense to.

So, now you know how to manage your images to have a fast-running website, you’re ready to make your own! Try Go Sitebuilder for a super simple website builder that gives you ready made templates to personalise, so you can have a beautiful website up and running in minutes! We offer a 14-day free trial so you can see for yourself – happy building!

April 28, 2020April 29, 2020

How do images enhance a website?

Imagine a website without images. You can vary the text size and font as much as you want but it’s still not going to be pretty. These days, images are the simplest way to make your website look more visually appealing, but the right images can actually have a significant impact on how users interact with your website. We’re going to look at the different ways images can enhance your website, so you can choose the best photos for your company.

Images look good

Ok, so it’s not just about looking good, but that is an important part of using images.

The last thing you want from your website is a homepage that is covered in text; users are likely to be overwhelmed and will click off immediately. Instead, try and use a high-quality image that reflects your brand with a call to action in large font; Do you want the visitor to buy your product, download a resource, or contact you?

First impressions are everything; 75% of people base their opinion of a website’s credibility on the web design, so you want to make sure yours stands out.

Good images increase traffic

If you use high quality, beautiful images on your website, this actually has a significant impact on the likelihood that visitors will turn into customers. Photography provider Pic-Up reported that websites without images got 94% fewer views than those with them, and the more views you get on your site, the more chances you have that they will convert.

Human beings are very visual creatures and we are drawn to images, which is why we use them so much on websites. It also has marketing results:

Increased user engagement. This means users spend more time on the site, making it more likely that they will contact you or purchase your product or service.
Decreased bounce rate. This means that you will move higher up search engine rankings, bringing you more traffic. More traffic means more customers!
Well chosen images create a link between the customer and your company. This makes them more likely to convert because they feel a connection with your business.

Images make your brand memorable

To make your brand – and website – memorable, you need to decide on a style that best represents your brand and what your company stands for. Create a collection of quality images that have similar qualities, for example a particular colour theme or lighting style, and use these images across your website, on your office walls, in your brochures and on online directories. This will bring a sense of continuity, consolidate your brand image and make your products and services more memorable.

You might only have stock images at your disposal, which is fine – Go Sitebuilder has a huge directory of stock images – but try and choose pictures that have qualities or characteristics that connect them – low-light photos, for example, or a minimalist style that makes the most of white space. Research has shown that we remember 80% of what we see, but 20% of what we read, so make sure you don’t get lazy with images!

Product photography drives sales

Never underestimate the power of product photography. First and foremost, having product photos that accurately capture your product aids clarity for your customers. Many online returns are due to the fact that the product looked different online to the item they received, so good product photos result in fewer returns, meaning less time and money wasted.

Good product photos are also a way to hook in those viewing your site on a mobile device. People on their phones are less likely to have the time or the inclination to read a lengthy product description, so they are going to choose the product image that captures their eye.

Good photos could make or break a sale. Think about how you shop; if there are two similar products at a comparable price, you’re going to choose either the one with the better picture, or the one that has more photos. A better picture makes you look more professional, and more pictures represents your product better, making you a more trustworthy company to shop from.

Optimised images are better for SEO

If you optimise your images for SEO then you are more likely to rank higher in search engine results, giving you more traffic. To do this, choose relevant, high quality images and customise the file name. Google’s crawl bots can’t “see” images, so DSC16632 means nothing to them. Change it to something relevant and ideally including a keyword for your business; if you sell jewellery, for example, naming the file “green-necklace” is much more useful.

This is the same for alt-tags on your images, which are also used by search engines to understand what an image is. You should be able to alter these in your website builder. Top tips: describe the image in a few words as if you were talking to a friend with their back to the screen, don’t include those small words like “on”, “a”, or “the” and don’t start with “image of…” as it’s not necessary. “Woman wearing green necklace” is ideal.

If you’re worried about an image-heavy website slowing down your website speed and making your site laggy, then check out our blog on how to manage images on your website. If you’re ready to create a new site with beautiful images, then try Go Sitebuilder! We have ready to go templates for you to upload your own photos, or you’ll have access to our extensive stock images section. Try our 14 day free trial today!