Ensuring your website is accessible to all users is not just good ethics, it’s required by law. According to the UK Equality Act 2010, commercial websites must make “reasonable adjustments” to be accessible for disabled users. With around 16 million disabled people in the UK, making reasonable adjustments could significantly expand your customer reach.
Web design professionals regularly work with clients to audit sites and implement changes to improve accessibility. Here are five of their top tips for making websites inclusive.
Use Sufficient Colour Contrast
Having strong colour contrast between foreground and background elements is key. The Web Content Accessibility Guidelines (WCAG) recommend at least a 4.5:1 contrast ratio for normal text. This ensures text remains legible for visually impaired users, as well as those with conditions like dyslexia.
When choosing colours, web design firm Vudu Digital recommends online contrast checkers. These analyse combinations to ensure they pass standards. Text size can also be increased to strengthen readability.
Write Descriptive Alt Text
Decorative images should have empty alt text descriptions. However, for meaningful graphics, descriptive labels are vital for conveying context to blind users.
Professional web designers suggest summarising photos in a concise, objective way. Links and buttons should clearly describe destination pages. Form fields should explain input purposes. Care should be taken not to overload alt text, as long descriptions risk overwhelming screen readers.
Structure Pages with Headings
Headings create an outline visible to screen readers, allowing navigation by page sections. An organised heading hierarchy using HTML tags like <h1>-<h6> is recommended.
Ideally, pages have one <h1> title, with subsequent headings for subsections. Headings should be nested by order of importance. Heading levels should not be skipped. This coherent structure helps all users parse information.
Design Keyboard-Accessible Interactions
The WCAG requires website functionality to be operable by keyboard alone. Form controls should activate when focused on Tab keystrokes. Links and buttons should trigger when hitting Enter or Spacebar.
Web design professionals implement accessible widgets with JavaScript by adding event listeners for relevant keypresses. Minimal reliance on mouse hovering and precise cursor movements ensures usability for those with hand mobility issues.
Provide Transcripts for Audiovisuals
Videos and audio clips necessitate accompanying transcripts. Integrating APIs like YouTube’s automatic captioning also boosts accessibility. Transcripts benefit various groups – from deaf individuals to those unable to play sound in loud workplaces.
When commissioning visual media, request caption files from providers to host alongside. Transcribe natively created clips through services like Rev. Additional textual content also benefits website SEO.
Allow Users to Customise Display Settings
Allowing visitors some control over how website content is displayed can greatly improve accessibility. Options to adjust text size, contrast levels, font style, cursor size, and animation speeds give users the flexibility to tailor sites to suit their needs.
Professional web designers recommend providing an obvious “accessibility menu” link on every page. This should lead to a centralised control panel for modifying display parameters. Popular adjustments include:
- Text size adjustment from smaller to larger
- High contrast colour scheme toggling
- Dyslexia-friendly font change options
- Cursor size enlarging for motor impairments
- Animation/carousel speed controls
Saving user preferences via browser cookies retains choices between site visits.
With inclusive design, websites can empower every visitor regardless of ability. Subtle adjustments make interacting far more equitable. Following guidance around colour, multimedia, and navigation ensures information is perceivable and understandable to all. Adopting these tips makes websites welcoming for every user.
- Custom web design
- Secure and fast website solution
- Full management training
- Take control of your website
- SEO optimisation
- Reliable web hosting and emails
Article by Pankaj Shah: DCP Web Designers
