From a users point of view, accessibility is one of the most important aspects of a modern website. An accessible website means that users who have learning difficulties, or may be impaired in a particular way, are still able to consume and enjoy the contents of the websites they visit. These users often use screen readers and other devices to digest the contents of a website.
Not only that, but accessibility is also a good marketing and business move. Google and other search engines use accessibility as a key ranking factor for websites today.
A professional web designer will consider this when crafting a website, so I’ve put together some tips below for achieving this:
The Language Attribute:
Set a lang attribute to the language your website is presented in on the opening <html> tag. For example, <html lang=”en”>.
Alternative Image Content:
It’s important that all images have alt attributes set on the <img> tag. This helps to describe, in text, what the image is – especially useful for those who can’t see images, or if an image doesn’t load.
Especially on mobile devices, don’t set [user-scalable=”no”] on the meta viewport tag. It’s good practice to let a user have control over the web page, and they may want to zoom into a specific element they cannot see properly.
Use ARIA Attributes:
Elements such as aria-label=”What this button does” come in handy for elements that do not have a clear text meaning behind them, such as a <button> that only contains an icon.
Avoid Low Contrast Text:
Text on a background which causes it to have a low contrast is troublesome for some groups of disabilities and makes text hard or near impossible to read.
Use Tables Only For Data:
Luckily, the days of using HTML tables for layouts are long gone. But it’s best to make sure you’re still only using HTML tables for actual tabular data, and nothing else.