Ensuring that all users have equal access to any website is crucial. Adding layers of information to a design can make it possible, here's what you need to check for this purpose.
For the visual content on your website, such as photographs, illustrations or graphs, include textual alternatives. Adding alternative text (alt text) descriptions to each of your images, allows assistive technologies such as screen reading programs to interpret it into spoken form.
When adding copy to your design portfolio or any other website, try to use only live text, enabling screen readers to fully understand your content. No matter how beautiful your typographical piece may be – if you want it to be legible to all users, opt for live text, rather than a JPEG, PNG or any other image file.
The visual hierarchy you craft so masterfully with your design skills, should be just as easily interpreted by assistive technology. No matter how big, bold or all-caps your title is, no machine will be able to tell that it’s a title unless you clearly specify that.
Color is a key factor in any design project, and picking out the right color palette is essential to setting the right mood and tone. Moreover, proper use of color is also a major component in the legibility of your website. Color contrast is one of the most important factors in ensuring that all elements on the page are distinguishable and clearly displayed.
Green means go, red means no – we get this instinctively. But what if you’re color blind and can’t tell the two apart? Many visually impaired users can’t perceive color accurately, or not at all. For that reason, make sure to use more than just color to convey information – from adding text, to icons or patterns – to ensure full readability.
From the motorically disabled to the vision impaired, there are many kinds of users that rely solely on the keyboard – and not the mouse – to navigate online. Ensure that all your website’s functionalities are accessible from the keyboard (with keys such as tab, enter, and the arrows).
When designing an online submission form (such as a log in or contact form), it’s important to provide the user with enough necessary guidance, enabling them to easily understand what they need to fill in, and where. This means naming each field in its label element, and not as placeholder text.
The WCAG accessibility guidelines suggest that no element on the webpage should flash or flicker over three times per second. Anything above that threshold might trigger seizures for people suffering from photosensitive epilepsy. For any flashing content, it’s also advisable to reduce its contrast, and avoid using saturated reds.
It’s well-known that as the number of choices increases, so does the effort required to collect information and make good decisions. It’s the same with too much content—it soon becomes overwhelming.
Occasionally, you might not want a visible label. Or the designer doesn’t, and you don’t want another fight in the car park. Anyway, here’s an example when a label saying “Search” preceding the input feels like overkill.