Creiamo.eu

Website Accessibility Basics: A Checklist for Site Owners

Website Accessibility Basics: A Checklist for Site Owners

A website can look polished and still prevent someone from reading a service description, opening a menu, or sending an enquiry. Small decisions about headings, colours, images, and forms affect whether visitors can complete these everyday tasks. Accessible web design makes those tasks possible for people with different disabilities, devices, and ways of browsing.

This website accessibility checklist helps site owners identify common barriers and give developers clear feedback. Treat it as a practical first review: passing these checks does not establish that an entire website is accessible.

Choose pages and tasks to review

Start with your homepage, a typical content page, and an important form. Add a complete journey, such as finding a service and requesting information. Include any cookie notice, dropdown menu, or booking tool encountered along the way.

The W3C’s Easy Checks for web accessibility provides guidance for an initial review. Some checks require looking beyond the visible page, so involve your developer where the underlying structure is unclear.

Record each problem with its page address, what you tried, and what happened. This makes the results easier to investigate.

A website accessibility checklist for common barriers

1. Give headings a meaningful structure

Headings help visitors understand a page and move between its sections. Screen reader users can navigate by headings, provided those headings are correctly marked up.

A line of large, bold text may look like a heading without functioning as one.

  • Use the editor’s heading settings for genuine section headings.
  • Organise headings logically: a main page heading, followed by section headings and subsections.
  • Make each heading describe the content beneath it.

For example, “Delivery times” tells readers more than “Useful information.” Choose heading levels according to the content structure; adjust their appearance through your website’s design settings.

2. Write links that explain their destination

Visitors should be able to understand what a link offers before following it. Repeated phrases such as “Click here” or “Read more” can become confusing, particularly when someone browses a list of links using assistive technology.

  • Replace vague wording with descriptions such as “View our website maintenance plans.”
  • Identify downloads where useful, for example, “Download the membership application (PDF).”
  • Give links a recognisable appearance; underlining links within paragraphs is a dependable choice.

Read each link alongside its surrounding sentence. Is its purpose clear? Making the link text meaningful on its own is an especially useful writing habit.

3. Give images appropriate alternative text

Alternative text communicates the purpose or information of an image to people who cannot see it. The right wording depends on why the image appears on that particular page.

  • Describe the relevant information in informative images.
  • Give purely decorative images an empty alternative text attribute, alt="".
  • Ensure an image used as a link or button communicates its destination or action.

For example, an image of a damaged component might need to identify the visible fault. A decorative background photograph may need no description. An icon that submits a search should communicate “Search.”

Charts and diagrams often need more than a short description. Provide their important findings and data in nearby text or a suitable table.

Check the published page after editing: content management systems differ in how they handle image descriptions and decorative images.

4. Measure colour contrast

Text that looks readable on your monitor may be difficult for someone with low vision. Pale text, text over photographs, and subtle form instructions deserve particular attention.

For WCAG Level AA, most text needs a contrast ratio of at least 4.5:1 against its background. Large text needs at least 3:1. Here, large means at least 18-point regular text or 14-point bold text.

  • Measure text and background combinations with a contrast checker.
  • Check links, form instructions, and error messages as well as main paragraphs.
  • Use text, symbols, or other cues alongside colour to communicate meaning.

For example, explain a form error in words rather than relying on a red border. A visual inspection alone cannot confirm a contrast ratio.

5. Complete essential tasks using a keyboard

Put the mouse aside and try navigating with the keyboard. Ensure your browser’s keyboard navigation settings allow access to all controls.

Use Tab to move forward and Shift + Tab to move back. Links generally activate with Enter; buttons generally support Enter and Space. Some controls use arrow keys.

  • Reach and operate navigation, buttons, forms, and other essential controls.
  • See a clear focus indicator showing which control will respond.
  • Follow a logical order and leave every component without becoming trapped.

Test menus, cookie notices, and pop-up dialogs. Open and close them, then continue your task. Watch for focus disappearing behind an overlay or fixed header.

Being able to reach a button is only part of the check: confirm that activating it produces the expected result.

6. Keep form labels and instructions clear

A form field needs an understandable label that remains available while someone enters information. Placeholder text disappears during typing and should not replace a label.

  • Give each field a clear visible label, such as “Email address.”
  • Ask your developer to confirm that labels are programmatically associated with their controls.
  • Explain required fields, formatting requirements, and errors in words.

Test both successful and unsuccessful submissions. If a field contains an error, can the visitor identify the field, understand the problem, and correct it?

Instructions such as “Enter the date as day/month/year” should appear before they are needed. Preserve valid entries when displaying errors so visitors do not have to start again.

What these checks can—and cannot—establish

These checks uncover useful, actionable problems. Automated scans can also flag issues such as missing alternative text or certain contrast failures. Neither approach alone provides a comprehensive accessibility assessment.

A scanner may detect that an image has alternative text without knowing whether the description is helpful. Keyboard testing may reveal an unusable menu while missing how that menu is announced by a screen reader.

A comprehensive assessment needs a defined scope and an agreed standard, such as WCAG 2.2 Level AA. It combines knowledgeable manual review, appropriate automated checks, assistive technology testing, and examination of complete processes. It also covers requirements beyond this checklist, including text resizing, media alternatives, and dynamic content. Involving people with disabilities adds valuable evidence about real use.

Make accessibility part of website maintenance

Assign each finding to someone who can fix it, prioritising barriers that prevent essential tasks. After a change, repeat the affected journey to confirm that the problem is resolved.

Build these checks into publishing and maintenance routines. Review new images, page templates, forms, and third-party tools as they are introduced. Accessibility needs ongoing attention as your website changes.