Image optimization is a fundamental part of SEO.
Search engines, in fact, use values like file names and alt texts (or alt tags) to place into context images within the website and offer relevant search results.
The key points of image optimization in a SEO-perspective are:
You can't change an image name or size after uploading it on Shopify. This means that if you change name, size or compression, you will need to delete and re-upload the image on Shopify. It is therefore highly recommended to optimize images before uploading them on Shopify. The alt text, instead, is to be filled in once images are uploaded on your store.
Image naming
It is important to rename all images on your website, instead of using default names such as IMG1001.jpg. These characters don't have any SEO value and search engines will not be able to understand any relevant info about the image uploaded.
For product images we advise to follow a standard naming, for example: ProductName-VariantName-ImageNumber.jpg
A descriptive naming has SEO value, and allows your visual contents to be correctly indexed by search engines.
The best way to rename images is to think about how a user would look at that image, and about what sentences or keywords they would use to search for it. The autocomplete function of Amazon or Google can offer a simple way to find relevant keywords and sentences.
Pro tip: it is better to use the hyphen (“-”) instead of the underscore (“_”) to separate words.
Images alt text
The alt text (the alternative text for the image) is very important to make your page content readable and accessible. This is a descriptive text that:
- Provides information to search engines about the image content, and allows the image to be correctly indexed as content. This can help positioning your image within the Google Images search results.
- Defines with better clarity the context of the images, and allows search engines to use images to identify the page score
- It is detected and read by the softwares used by visually impaired users, making the website more accessible. The correct usage of alt texts is defined by the web accessibility laws in the US.
- If the image cannot be loaded, the alt text will be displayed as a substitute to the image instead of the missing image icon.
- The alt text will be displayed when hovering the mouse over the image, if the browser allows it.
Some best practices for writing alt texts are:
- Be short and specific
The most common suggestion is to describe the image as you would do if you were speaking on the phone. Often a few words are sufficient, but that's not always the case. It is ideal to stay below 125 characters, since some readers could cut longer texts. Google doesn't have a specific guideline on this, so longer texts are not penalised. - Don't start with "Photo of..." or "Image of..."
Since this is an alt text this info is given for granted. Better using the space you have for more relevant info. In cases of more specific info such as "Graph of..." it is good practice to include such info. - Use appropriate keywords
When you describe the image you can include a couple of keywords that will help the page SEO. It is though important to use keywords that are relevant and appropriate, avoiding to use the alt text as a simple list of keywords. Google does detect and penalise the usage of irrelevant keywords. - Don't add any alt text to decorative images
You need to assign an alt text only to descriptive images, that contribute to the page content and understanding. Decorative images have instead a value that is decorative-only, and therefore don't add any specific info to the page content, and therefore don't require any alt text.
How to change the alt text in Shopify:
- Product pictures
From the admin panel in Shopify, enter one product page. The image gallery is situated in the "Media" section. Clicking on each image you can see and change the Alt Text.
- Images added through the theme editor
Every time we add an image through the theme editor in one of our website sections, we'll be able to add the alt text for that image. We can just select the image and add the alt text before saving.
Image size
Images uploaded to Shopify must follow these conditions (see full guide on Shopify):
- Maximum size: 4472 x 4472 px (or 20 megapixels).
- Maximum weight: 20 MB (otherwise Shopify won't accept the file)
These are the maximum values, so as a best practice it is important to stay way below these limits.
Our recommendations are:
- For portraits, a maximum height of 2048px
- For squared images 2048 x 2048px
- Try keeping the images below 100 kb
A higher resolution makes pictures more detailed but at the same time it makes them bigger in size, resulting in longer load time. Page load time is one of the most important ranking factors and it heavily influences SEO scores. Longer load times also impact on the conversion rate of the website.
As mentioned, the ideal weight of an image is 100 kb, or 200kb maximum.
If you have an image that weights more than 200kb we recommend to compress it through TinyPNG before uploading it on your website. TinyPNG is a great tool to compress images, and it has a free plan available. You will just need to drag and drop your image on the dedicated space, and, a soon as the compressed image has been processed, download it.
If you want to dig deeper into on-page SEO as well, you can find a dedicated article here.
-
If you are considering using Shopify for your online store, you can subscribe here for a free trial or email us at info@namastudio.it
