We will not contact you via WhatsApp or other messaging platforms. Please use our official email addresses or telephone number to speak with us.
本公司不會通過 WhatsApp 與您聯繫。請使用我們的官方電子郵件地址或電話號碼與我們聯繫。
Design & Development | 6 min read

Advanced Tips For Improving Your Website’s Accessibility

Though accessibility doesn’t fall under the category of design by itself, it is important to make your site as accessible as possible to maximize usability for a wider range of visitors. Check out these tips to improve your site accessibility.
web accessibility banner
Tiffany Pau
By Tiffany Pau
March 25, 2022
Share:

Raise your hand if you've ever opened a website and had to squint. Sometimes, it's even worse - there are no typos, the font is fine and it should be easy to read, but the design of the page makes it atrociously difficult.

Because we care about solving this problem for you (and those who will visit your website too!), we have done extensive research into finding out how people like to read things online and how we can rearrange our words and lines of text in our articles so that everyone can enjoy reading them without squinting.

Pro Tip: Read the first part to learn the basics of UI design accessibility here.

Website Accessibility Tips - Use of keyboard

Use of keyboard

Many people use their keyboards instead of a mouse when they browse the web. There are many reasons why someone would use keyboards instead of a mouse, perhaps they are using a screen-reader, or they have a motor impairment.

Keyboard trap is a common and harmful plugin for web accessibility. It happens when a user finds themselves unable to exit an element on the page that has been tabbed through because the page is not allowing them to use the "escape" key to leave the element.

Keyboard trap can happen in all sorts of places on a webpage, from modals to buttons or links. In general, it's important to avoid a keyboard trap, because it can be frustrating and difficult for users who are navigating your site without a mouse.

Design tips for keyboard use:

  • All interactive elements must be focusable.
  • Tab order should be logical and intuitive, from top to bottom, then left to right.
  • Make sure there is a visible indication for the element that has focus and that the user knows where they are in the tab order.
  • Allow users to skip navigation links and long lists of links by using skip navigation or anchor links.
  • Do not rely on colour alone to convey importance or meaning.

Design tips for designing for screen readers:

  • Use proper heading structure (H1 through H6) to communicate hierarchy and meaning.
  • Do not use headings just to make the text bigger and bolder.
  • Screen readers use headings as a way to navigate content, so make sure your headings accurately describe the content below it.
Website Accessibility Tips - Layout

Layout

As a web designer, think about how screen readers work when designing your site. The layout of the design needs to be structured and logical so the screen reader can follow it.

For example, if there is an image on your site that is important to the content it should have an alternative text description so that people who can't see the image can still understand it.

Ways to make your site more compatible with screen readers:

  • Use headers. They help break up large blocks of text into relevant pieces, making them easier to read. But headers also act as navigational tools for screen readers.
  • Avoid using tables: Screen readers read tables from left to right and from top.
  • Include navigation menus, links, and text sections in predictable locations and consistently identified.
  • Make sure to have your form labels and instructions clearly associated with their controls.
Website Accessibility Tips - Readability

Readability

Make sure you're using simple language.

Website content should be written in a clear, simple way so that people can easily access information and navigate the website. The writing and language used on a website should be easy to understand and accessible to as many people as possible to improve the user experience.

Tips to improve the readability of your content:

  • Write in a way that uses short, specific sentences and avoids technical jargon or acronyms.
  • Use words that are familiar to your audience and keep your writing clear and simple.
  • Pay attention to the readability of your content by checking its readability score using tools like Readability Score.
  • Make sure website navigation is clear and intuitive.

The content of your website should be organized logically, with a clear navigation system that helps people find what they need.

To make navigation easier for everyone, create a consistent navigation structure for all the pages on your site that is easy to understand and use.

Your site's navigation should be:

Concise

Limit the number of items in each drop-down menu or heading to what is essential. This makes it easier for people to understand the main areas of your site at a glance.

Consistent

Use the same headings, labels and terminology throughout your site so users know what to expect.

Logical

Arrange menus and links in an order that is easy to follow.

Final Word

In a perfect world, our sites would be completely accessible to everyone. However, the reality is that we don’t live in a perfect world. We don’t all have the same abilities, whether it’s because of technical issues, disabilities or cultural factors.

Though accessibility doesn’t fall under the category of design by itself, it is important to make your site as accessible as possible to maximize usability for a wider range of visitors.

Butter is here to help you with all your website design Hong Kong needs. If you need help in executing these web development suggestions for your website designs, get in touch with our experts to book a call!

Share:
Tiffany Pau
By Tiffany Pau
Digital Strategist
Tiffany is a Biochemistry graduate from CUHK. After graduation, she worked as a Digital & Analytics intern at L'Oréal APAC for more than a year before joining Butter as part of the Graduate Programme. Tiffany now works closely with the Strategy and Business Development Team to meet output expectations and contributes to managing client projects within Butter.

Insights

Contact1
Join us

We’re always wanting to meet talented people who would enjoy working with us, while helping us be better at what we do.

View Jobs
Contact2
Get in touch

Looking for a strategic Digital Marketing Agency in Hong Kong? Reach out and talk to us today!

Contact Us