Users may not be able to see images for a variety of reasons - the image link is broken, their device is not compatible, or the user has low or no vision, etc. Alt tags are used to describe an image so that users who cannot see an image can still be informed. Alt tags are even used when an image is working and visible to the user, to provide more information.
Alt tags should be descriptive, but not overly long. Imagine the image does not exist, and you are describing it to an illustrator who will draw it. There is no need to put “an image” or “a picture” in the description, this is already known. Likewise, there is no need to duplicate information that is in the accompanying text.
Here is an example image with its accompanying text:
You then need to get the code from your new fork. Select the green "Code" button, then select the copy icon to copy the code location:
Good Alt text: “How to get the URL to use when checking out the code.”
If you need to, use a broken image on purpose to get an idea of how it feels:
You then need to get the code from your new fork. Select the green "Code" button and select the copy icon to copy the code location:
This technique should illuminate why alt-text like ‘fork’ or ‘image showing what was described’ are not ideal:
You then need to get the code from your new fork. Select the green "Code" button and select the copy icon to copy the code location:
In the above example, “clone” is not descriptive enough.
You then need to get the code from your new fork. Select the green "Code" button and select the copy icon to copy the code location:
This alt text has too many details, and is redundant with the text before it.
More alt text examples and descriptions
How to Write Better Alt-Text Descriptions for Accessibility