Skip to content

Instantly share code, notes, and snippets.

@p4bl1t0
Last active December 16, 2015 20:49
Show Gist options
  • Save p4bl1t0/5495386 to your computer and use it in GitHub Desktop.
Save p4bl1t0/5495386 to your computer and use it in GitHub Desktop.
Quick tip: Alt text change with context

Quick Tip: Alt text change with context

The same image could be used in different places on a website, but this doesn't mean that the image has always the same purpose. Hence the image location could change their meaning altering the content of the alt attribute.

For example the logo (image) of a social network could be used on the page header as link to the home page, so in this case the alt attribute could be "Home page".

The same image could be found for decorative purposes in the main body or the footer of the web page. In these situations the image could be ignored by Assistive Technology so null alt text should be used ( alt="", meaning that the image can be safely ignored).

Finally the website could use the same logo to encourage users to join or follow them in their own social network's account, in this example the alt attribute content could be "Follow us in Our Social Network".

As can be seen, the image's context change their meaning.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment