Accessibility Tip: Examples of accessibility issues

Last updated on September 06, 2017ArticlesNon-technical-guides

Table of contents

Incorrect alt tags

Alt tags are used to add descriptive text to images.

<img src="image.jpg" alt="Photo of blue sky against the sea" />

This is great - until they’re misused.

There are two main ways they are incorrectly used.

The first is when decorative images have an alt of sometyhing like “divider line”. Decorative images should have alt="" so screen readers will ignore them.

And then you have the times when useless or incorrect values are given, e.g. <button><img src="something.jpg" alt="Button" /></button>.

No visual indicator for currently focused item

When you are navigating the page with a keyboard, it should be immediately obvious what the current focused element is. Try it on this site - hit tab a few times, and you will see an outline of the current selected element - probably a link.

Bad colour contrast

People with sight issues, or almost anyone when using a laptop/phone in bright sunlight can find it very hard to read text if there is not enough colour contrast.

Found this post useful?

Please consider sharing this link with your work colleagues or on social media. There are no ads on my site, I just want to promote accessibility.

Found an issue? please point them out - let me know if there is a mistake and I'll update it

Follow me on Twitter: @A11yForDevs. I post links to interesting a11y articles and resources.

More posts

Welcome to Accessibility for Developers

New to accessibility?

Accessibility for Developers

This is a free site to give advice on how to make your website accessible

I have been a software developer for nearly a couple of decades, and really want to help promote better accessibility in apps and websites that we, as developers, create! Accessibility isn't very difficult, it is just important to be aware about it and understand it.

If you spot any mistakes or have any suggestions, ideas or collaborations please check out my contact page.

Important: The information on this website is for general informational purposes only. I make no representation or warranty, express or implied. Your use of the site is solely at your own risk. I've tried my best to make sure all information is accurate, but I am just a software engineer (not an accessibility expert).