{"id":3138,"date":"2015-06-08T10:00:00","date_gmt":"2015-06-08T09:00:00","guid":{"rendered":"https:\/\/www.lcn.com\/blog\/?p=3138"},"modified":"2021-07-08T09:19:32","modified_gmt":"2021-07-08T08:19:32","slug":"7-simple-ways-to-make-your-website-more-accessible","status":"publish","type":"post","link":"https:\/\/www.lcn.com\/blog\/7-simple-ways-to-make-your-website-more-accessible\/","title":{"rendered":"7 Simple Ways to Make Your Website More Accessible"},"content":{"rendered":"

Accessibility is a part of the design process focused on the user experience, making websites<\/a> usable by the widest range of people (using the any device)\u00a0possible.<\/p>\n

It’s important to remember that it’s not just beginners or inexperienced Internet users that benefit from\u00a0accessible design, but also people with varying visual, mobility, hearing, and intellectual abilities.<\/p>\n[Tweet “Make your website more accessible in 7 simple steps…”]\n

Here we’ll look at various steps you can take to make your website more accessible to your audience.<\/p>\n

 <\/p>\n

Why Accessibility is Important<\/h2>\n

Even if there are no mandatory web accessibility requirements in your country, you should still address accessibility issues because there are a number of additional benefits, including:<\/p>\n

.\u00a0\u00a0 More people are able to use your site, meaning more potential customers<\/p>\n

.\u00a0\u00a0 It improves the experience for mobile users<\/p>\n

.\u00a0\u00a0 It improves your search engine<\/a> rankings<\/p>\n

 <\/p>\n

Consider Accessibility During the Design Process<\/h2>\n

During the initial web design stages and whenever you’re publishing new content, try to keep in mind a number of design elements that improve accessibility.<\/p>\n

Among other things, these include the reading order, colour contrast, font size, and clear links. WebAIM.org (Web Accessibility in Mind) has created a helpful accessibility infographic<\/a> with some of these design best practices.<\/p>\n

 <\/p>\n

Ensure Content is Logical and Navigable Using Only a Keyboard<\/h2>\n

Some users with mobility disabilities can’t use a mouse or trackpad but can access content using the “tab” key or other input devices.<\/p>\n

Therefore, make sure the tab order matches the visual order, so there is a logical progression through the content.<\/p>\n

When a page contains a lot of content, break it up with anchor texts, so users can skip to other page sections.<\/p>\n

It’s also good practice to have a “Skip to main content” link at the top of each page, so users can avoid having to tab through the main navigation links.<\/p>\n

 <\/p>\n

Use Alternative (Alt) Text for Images<\/h2>\n

The web is used by many people who are visually impaired. They use tools to help them read the text and also “see” other page elements.<\/p>\n

 <\/p>\n

\"altEditing an image alt tag in WordPress<\/em><\/p>\n

 <\/p>\n

 <\/p>\n

Alt-text is one of the main ways of making visual information accessible. As search engine crawlers cannot actually “see” images, it’s also an important technique that strengthens search engine optimisation (SEO).<\/p>\n

Alt-text is helpful in various situations:<\/p>\n

.\u00a0\u00a0 For people using screen readers and speech input software<\/p>\n

.\u00a0\u00a0 For people browsing speech-enabled websites<\/p>\n

.\u00a0\u00a0 For mobile users when images can’t be displayed<\/p>\n

 <\/p>\n

To find out more, visit this WebAIM guide to alt text<\/a>\u00a0and our guide to optimising images for SEO<\/a>.<\/p>\n

 <\/p>\n

Use Sufficient Colour Contrast Between Text and Background<\/h2>\n

Up to\u00a0one in twelve<\/a> people have some type of colourblindness, but these aren’t the only people that struggle to distinguish between elements on a web page; users with learning disabilities can benefit from contrasting colours in order to comprehend content.<\/p>\n

Use higher colour contrasts between the text and background and try using more white space and borders to separate blocks of content.\u00a0<\/p>\n

 <\/p>\n

\"textTry to ensure the text on your web page is easy to read, but avoid making it too bright since this can also lead to eye fatigue<\/em><\/p>\n

 <\/p>\n

Having enough contrast between the words and the background just makes reading easier and more pleasant for everyone, especially when using a mobile device.<\/p>\n

To check your colour contrast levels, use WebAIM’s colour contrast checker<\/a>.<\/p>\n

toptal.com\/designers\/colorfilter<\/a> will also filter your website to emulate different types of colourblindness.<\/p>\n

 <\/p>\n

Use Descriptive Links<\/h2>\n

Using the words “click here” in links is not always helpful for screen reader users or search engine robots.<\/p>\n

Try using text that describes where the link will go. Visually impaired users can scan through links just like sighted users, so using descriptive text helps to explain the context of each link.<\/p>\n

 <\/p>\n

Provide Captions for Embedded Video<\/h2>\n

Captions provide content in real-time for users who don’t have access to audio. There are closed captions, which can be turned off and on, or open captions that are embedded directly in the video file.<\/p>\n

 <\/p>\n

\"captions\"Captions<\/a> are now available on many YouTube Videos<\/em><\/p>\n

\u00a0<\/p>\n

To meet basic guidelines, captions should be properly synchronised with content, and be accessible on a variety of devices.<\/p>\n

To find out more, read this WebAIM article on captions, transcripts, and audio descriptions<\/a>.<\/p>\n

Related: 5 YouTube videos every business needs<\/a><\/em><\/strong><\/p>\n

 <\/p>\n

Test Your Website on a Mobile Device<\/h2>\n

There is a significant crossover between accessibility and the mobile user experience. A website built with a clean design that is user-friendly may go a long way toward meeting accessibility goals.<\/p>\n

To ensure your users have a good website experience, test your site on a mobile device. Google Analytics has a page speed analysis tool<\/a>\u00a0for mobile devices and\u00a0a tool<\/a> to check for mobile-friendliness.<\/p>\n

This is more important than ever now that Google has confirmed that mobile-friendliness is now a ranking factor<\/a>.<\/p>\n

 <\/p>\n

Conclusion<\/h2>\n

This is just a roundup of some key steps you should take to ensure your website is more accessible.<\/p>\n

Implementing these suggestions will not only improve accessibility but also help search engines understand your site better, which should increase your search rankings.<\/p>\n

For more accessibility web tips, visit the following pages:<\/p>\n