Web Design

Accessibility basics for African websites

An accessible website works for everyone, including people with disabilities, older visitors and users on cheap phones with slow data. Here are the practical basics every African website should get right.

Accessibility basics for African websites

When people talk about website accessibility, they often imagine it is only for big international organisations. In reality, website accessibility matters a great deal in Uganda and across Africa. Many of your visitors have visual, hearing, motor or cognitive impairments. Many more are older relatives using a phone with a cracked screen, people reading in bright sunlight at a taxi stage, or customers on a slow 3G connection in a rural district. Designing for accessibility helps all of them, and it usually improves your SEO and sales too.

What website accessibility means

Accessibility means people can perceive, understand, navigate and interact with your website, whatever their abilities or devices. The international reference point is the Web Content Accessibility Guidelines, known as WCAG, published by the World Wide Web Consortium. WCAG is built on four principles:

  • Perceivable: information can be seen, heard or otherwise sensed, for example through text alternatives for images.
  • Operable: the site can be used with a keyboard, a screen reader or a touch screen, without needing precise mouse movements.
  • Understandable: content and navigation are clear and predictable.
  • Robust: the site works with different browsers and assistive technologies.

Uganda's laws, including the Persons with Disabilities Act, promote equal access and non discrimination. While we cannot give legal advice, building accessible websites is clearly the right direction for any business, NGO or public institution serving the public.

Why accessibility is good for African businesses

  • More customers: nobody is locked out of buying, booking or enquiring.
  • Better SEO: search engines understand clear headings, descriptive links and image alt text.
  • Works on low end devices: clean, accessible code tends to be lighter and faster.
  • Stronger reputation: donors, international partners and government agencies increasingly expect inclusive design.

Accessibility basics: a practical checklist

1. Write meaningful alternative text for images

Alt text is a short description that screen readers announce to blind users and that appears if images fail to load on a weak connection. In WordPress, fill in the "Alternative text" field when uploading images.

  • Good: "Nurse checking a child's blood pressure at our Mukono clinic".
  • Poor: "IMG_2045" or "image".
  • Decorative images that add no information can have empty alt text so screen readers skip them.

2. Use proper headings in the right order

Headings are not just bigger text. Screen reader users jump between headings to scan a page, just as sighted visitors do. Use one main heading per page, then H2 for main sections and H3 for subsections. Do not pick a heading level just because you like its size; style it with CSS instead.

3. Make sure text has enough colour contrast

Light grey text on a white background might look stylish on a designer's monitor, but it is unreadable for many people, especially outdoors in strong sunlight. WCAG recommends a contrast ratio of at least 4.5 to 1 for normal text. Free tools such as the WebAIM contrast checker let you test your colours. Never rely on colour alone to show information, for example marking required form fields only in red.

4. Use readable font sizes and line spacing

Body text of around 16 pixels or larger, generous line height and short paragraphs make reading easier on small phones. Allow users to zoom; do not disable pinch zoom on mobile.

5. Write clear, descriptive links and buttons

"Click here" tells a screen reader user nothing when links are read out of context. Use "Download the 2025 school fees structure (PDF)" or "Book a consultation". Make buttons large enough to tap easily with a thumb, with space between them.

6. Make everything work with a keyboard

Some users cannot use a mouse or touch screen. Test your site by pressing the Tab key repeatedly. You should be able to reach every link, menu item, form field and button, and see a visible outline showing where you are. Pop ups and menus must be closable with the keyboard.

7. Build accessible forms

  • Every field needs a visible label, not just placeholder text that disappears when typing.
  • Explain errors clearly, for example "Please enter a phone number starting with 07".
  • Avoid CAPTCHAs that are impossible for blind users. Use accessible alternatives.
  • Keep forms short. Ask only for what you need.

8. Provide captions and transcripts for media

Add captions to videos so deaf and hard of hearing visitors can follow, and so people watching on a noisy matatu or in a quiet office can understand without sound. Provide transcripts for podcasts and audio announcements. Avoid autoplaying videos with sound.

9. Consider language and plain writing

Write in plain English with short sentences. If your audience speaks Luganda, Runyankole, Luo, Swahili or other languages, consider offering key information in those languages and set the correct language attribute in the page code so screen readers pronounce text properly.

10. Design for slow connections and older devices

Accessibility in Africa also means access for users with limited data. Compress images, avoid heavy sliders and large background videos, and make sure the page is usable before every script loads. Fast hosting helps too. Baasa Cloud's LiteSpeed servers and caching help pages load quickly for visitors on modest connections.

How to test your website for accessibility

  1. Automated tools: run free checks with WAVE, Lighthouse in Chrome DevTools or axe. They catch common issues such as missing alt text and low contrast.
  2. Keyboard test: navigate the whole site using only Tab, Shift and Enter.
  3. Screen reader test: try TalkBack on Android, VoiceOver on iPhone or the free NVDA reader on Windows.
  4. Zoom test: zoom the browser to 200 percent and check nothing overlaps or disappears.
  5. Real users: ask people with disabilities to try your site and give feedback. Local disability organisations may be able to advise.

Automated tools find only part of the problems, so manual testing is essential.

Accessibility in WordPress

WordPress has good accessibility foundations. Choose themes tagged "accessibility ready" in the official directory, avoid page builders that create messy code, and train editors to add alt text and use headings properly. Plugins can help with checks, but beware of "overlay" tools that promise instant compliance; they rarely fix underlying problems.

Frequently asked questions

Is accessibility expensive to add?

Building it in from the start costs little. Fixing an inaccessible site later costs more, so include accessibility in your design brief.

Will an accessible site look boring?

No. Accessible design can be colourful and modern. It simply ensures good contrast, clear structure and usable controls.

Does accessibility help with Google rankings?

Many accessibility practices, such as descriptive headings, alt text and fast loading, also support SEO and a better user experience.

Conclusion

Accessibility is not a luxury for African websites. It is about reaching every customer, citizen and supporter, whatever their abilities, device or connection. Start with the basics: alt text, headings, contrast, keyboard access, accessible forms and lighter pages. Test regularly and improve step by step. If you are planning a new website and want accessibility built in from day one, the Baasa Cloud web design team is happy to help.


← All posts Discuss on WhatsApp