Alt text (alternative text), are used within an HTML code to describe the appearance and function of an image on a page.
The best format for alt text is sufficiently descriptive but doesn't contain any spammy attempts at keyword stuffing. If you can close your eyes, have someone read the alt text to you, and imagine a reasonably accurate version of the image, you're on the right track.
Not-so-good alt tag
= dog
This alt text can be better because it's not very descriptive. Yes, this is an image of a dog, but there's more to be said about this image.
Better alt tag
= dog running
This alt text is better. Yes, it is an image of a dog running, but there's still more to be said about this image.
Ideal alt tag
= Border Collie running on beach
This alt text is the ideal alternative because it is far more descriptive of what's in the image. This isn't just a dog or a dog running; it's a Border Collie running on a beach.
Not-so-good alt tag
= hammer and nail
Better alt tag
= hammer nail into a roof
Best alt tag
= hammer nail into a roof shingle
Image Type | Alt Text (Y/N) | |
---|---|---|
Client Logo* | Yes | |
Call Out / In-Line Images | Yes | |
Slider | Yes | |
Gallery Images | Yes | |
Row / Container Background Images | No | |
Button | No | |
Badges* | Yes | |
Shields* | Yes | |
Icons* | No | |
Social Icons | Yes | When manually added |
Pay Icons | Yes | When manually added |
Client Logos
Badges, Shields, Non-Client Logos (usually associated with a row directly above the footer or on contact us page)
Icons (SVG, png, and, on occasion, jpg, gif, webp)