3 Image Best Practices that Improve SEO and Accessibility
Images are essential to your website. They engage your audience, provide visual breaks from dense text and showcase your brand identity. In fact, content with relevant images gets 94% more views than content without*. But if your images aren’t prepared correctly, they can slow down your page load times, affect your site’s accessibility and impact your search engine optimization (SEO).
Here are three image best practices that can make your website more accessible and more searchable.
01 Keep Image Size Low
While Squarespace will let you upload image files (jpgs, pngs and gifs) up to 20 MB, that doesn’t mean you should! It’s best to use images that are 500 KB or less. This means pages will load faster, and faster-loading sites are ranked higher by search engines.
You can check your site’s speed using Google’s PageSpeed Insights Service.
02 Give Your Images Readable Filenames
According to Google Developer, you should always use hyphens, not underscores, to separate words within a filename. Search engines interpret hyphens as spaces between words, making the text more readable. Underscores are generally not recognized, so filenames are strung together, like “newyorkskylineeveningdecember.” This not only makes them less accessible to screen readers; their presence can also negatively affect SEO.
03 Add Alt Text
Alt text is a short, written description of your image. It’s important for two reasons: first, it increases accessibility for visitors who use assistive screen readers, and second, it helps search engines identify the content of a page, and therefore makes your site more likely to show up in Google image searches.
If no alt text is provided, an image's filename acts as alt text, but we encourage our clients to add alt text to all images on a site. The only exception is when the image is purely decorative, and describing it would not add any important context to the page.
BONUS: Which file type should I use?
Generally, jpgs are more SEO-friendly than pngs since they have greater compression and load faster. Use vector-based .svg files for logos, icons and other graphics, since they can scale without losing quality.
More Resources
Squarespace’s complete SEO Checklist
More about reducing page load time
*study originally published by Skyword, 2011