: Is it good practice to include alt tags on all images … including decorative images such as navigation arrows and social media buttons? I understand that my "content images" should be alt-tagged

@Ann8826881

The HTML spec answers this clearly under Requirements for providing text to act as an alternative for images:


For decorative images, see A purely decorative image that doesn’t add any information
For navigation arrows (these are typically not decoration), see Icon Images
For social media buttons (these are typically not decoration), see A link or button containing nothing but an image and Logos, insignia, flags, or emblems.


In general, every image must have an alt attribute (with two exceptions), and sometimes the alt value must be empty (alt=""). This is not just about best practices, this is a requirement. If you don’t follow it, your HTML is not only invalid, but likely also not accessible.

It’s easy to test and understand which image needs which kind of alt content: disable images and check your page. If you still can do everything you could do with images (e.g., visiting all links), if you still understand everything you could understand with images (e.g., the purpose of a button, the meaning of a sidebar), and if you don’t find meaningless/confusing content that doesn’t add anything relevant (e.g., "horizontal red line"), you are probably doing it correctly.

Vote Up Vote Down

@Turnbaugh106

All images embedded on page using <img> require an alt="" attribute regardless if its UI purposes or actual page content. The only exception is for images that have no value to the page, but you still should use an alt attribute but you can keep it blank.

Generally, you wouldn't want to use <img> for UI elements because you lose the benefit of the freedom of CSS and the fact that you can use CSS sprites that are faster to download and serve.

Vote Up Vote Down