Synonyms: Alternative Text, Alt Attributes, Alt Descriptions
Alt-text is a text incarnation of the images on web pages. We need our images to be described in words. For engines, for people who want their page not to show images, to save data, for instance, and for people who have little or have no vision. So they are exceedingly important, and that is why these image descriptions must be clear, informative, and make sense.
When we run our web page, we must play by the rules. And one of them is alt descriptions or alt-text. We describe our images by words. These text alternatives are needed for search engines and users.
Don’t use the word ‘image’ in the description
Because you are already in that image field. So it is obvious. Like when you name your dog Betsy for instance, you don’t name her Betsy dog. Just Betsy.
So your description, or your alt-text, of a dog image, for instance, will be ‘Black dog’, but not ‘The image of black dog’.
Be clear, specific, and straightforward
Describe the image directly, if you see a tree decorated with blue lights, just write “Tree decorated with blue lights”. Don’t write “Tree” or “Tree decorated’ or “Blue lights and a tree”, etc.
But don’t lose your head trying to stuff your alt-text with all the possible keyword combinations. Include a few main keywords wisely.
Keep it short
Good alt-text is no more than 17-19 words.
Put a dot at the end of alt-text
When we talk about accessible web design, we want to mention this. Assistive devices will make a pause at the end of the alt-text, so the user can more easily understand the content.
Text labels don’t need alt-text
Because they already include text in their visuals. So don’t repeat. For instance, Twitter text visuals don’t need it.
Don’t place an alt-text for images in links
What is important for a user, in this case, is the link text. Don’t add alt-text for its image, it will just overload the user with information.
Don’t place an alt-text for additional images
You have important pictures and images that improve and complement your text content, but you also have some additional images like dividers or brand icons. Just don’t describe them with text.