10 easy fixes to make your website instantly more accessible
There is a lot involved in making websites fully accessible to a wide variety of people with disabilities and situational limitations. It requires extensive research, usability testing, good UX and visual design, proper markup and code and sometimes complex assistive technologies to name a few.
However, that doesn’t mean one can’t make their website accessible to more people. Here is what you can do to give more people the opportunity to use your site or application.
High Contrast
Using high contrast is just a good user experience that adds to your content’s readability. High contrast of text, images and graphic elements benefits everyone from people with low vision to people with color vision deficiency (more about designing for color blindness here) to someone reading an article on their phone in direct sunlight. Avoid light gray text on a white background. When it comes to contrast it’s better to be safe (=high contrast) than subtle.
2. Large Buttons
Users with limited dexterity, older people, people with tremors, moms holding a baby, those who are on the move have difficulties clicking/tapping small elements. Large buttons are easier to reach and allow for less mistakes. Make sure the clickable/tappable elements are noticeable, sizable and within easy reach (especially on a smartphone screen).
3. Prominent Hover Effects
Make sure your hover effects are prominent. Way too often I see very subtle, barely noticeable hover effects or no hover effects at all. That makes it impossible to know what elements on your websites are clickable and requires unnecessary cognitive effort from your users. Is this a link? Is it not? Can I click it? “Don’t make your users think” (as Steve Krug recommended in his amazing book — a must-read for any UX designer!) and create high contrast hover effects. Add an underline to your links when in doubt. Color blind users will thank you, and so will the rest of us.
4. Self-Explanatory Labels
Some of your users rely on screen readers to use your site or application. A dozen Read Now links are not very helpful to them. Make sure blind or partially blind people have a smooth and pleasant user experience navigating your digital product by creating good self-explanatory labels for your links and buttons. Learn More About Becoming a Member is a better link than just Learn More.
5. Simple Language
Using difficult words, industry specific jargon, unclear abbreviations and overly complex sentence structures takes away from good user experience — not just for people with learning disabilities or comprehension difficulties but for everyone. Write like Hemingway: trim down on fancy vocabulary, make your writing concise and straightforward. Using simple sentences and words that your users can relate to will make your content more readable and accessible to everyone. Tip: use the Hemingway App to help improve the readability of your copy.
6. Alt Text for Images
Not everyone can enjoy your beautiful images. Some of your users may be blind and might rely on using screen readers to access your content. So, your images will be missed by these users unless the images are properly coded, i.e. clear and understandable alternative text is specified. Do make sure to add alt text to every image that is significant to understanding your content but don’t be too verbose. Alt text needs to be concise and to the point and contain just enough information that is needed to understand the written better. Here is a good guide on how to write effective alternative text.
7. Don’t Autoplay Videos
Autoplaying videos or carousels of images is not only annoying to… well — everyone but can also be dangerous for users with certain conditions. Autoplaying videos has been known to trigger seizures in people with photosensitive epilepsy. Avoid autoplaying videos, flashing content, parallax scrolling altogether in order to be on the safe side. If you absolutely have to include a video that automatically plays, then make sure to provide the user with controls to pause, stop or turn off the sound. Needless to say, these controls have to be very easy to find.
8. Horizontal Navigation
One of the latest trends is to hide the website navigation under a hamburger menu icon which was borrowed from mobile. From the accessibility viewpoint this is not advisable. Users relying on screen readers and/or keyboard to access your content will have an easier time if your navigation is as simply designed as possible — more often than not it is horizontal navigation at the top of the page and is consistent across all the pages of your website.
9. Clear Headings
It is important to have your headings not only properly designed but also properly coded. Make sure not to skip heading levels in your markup (that is don’t go from h1 straight to h3). A clear visual layout of your page and high quality accessible code ensures that users relying on screen readers will be able to scan the page quickly and easily for the information that they are looking for or find interesting. Always make sure your web pages have a clear visual hierarchy and use progressive disclosure to organize the content on your site. Organizing content in that way is sometimes called the iceberg theory, which is a simple style of writing that reveals minimal detail on the surface, with deeper meaning hiding below.
10. Captions for Videos
Providing captions or text transcripts for your video content is crucial. It not only ensures that viewers with hearing and cognitive disabilities thrive in online environments but also helps a whole lot of other types of users. A student checking their Instagram feed at a library, a patient watching the news in the doctor’s waiting room, a mother nursing her baby in the middle of the night, or a person watching a film in a language that is not their mother tongue all may rely on using closed captioning to consume video content.
Conclusion
It is certainly a very difficult and involved task to make a website or application fully accessible by most people with all sorts of disabilities and situational limitations. It requires knowledge, skills, resources and determination. However, it is the responsibility of every one of us involved in creating digital products to create smooth and pleasant user experiences for all our users. Implementing the small fixes mentioned above is a good start.