WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Manual user web interface accessibility test

for

From: Jano Llorca Lis
Date: Mar 14, 2024 9:58AM

Hello Patience,

Manual accessibility testing is crucial to ensure that all users,
regardless of their abilities, can access and effectively use a website.
It's great to know that you've already used automatic tools like WAVE to
assess the accessibility of your website. Below, I detail how to carry out
manual tests focusing on text alternatives for non-text content, color
contrast, keyboard navigation, and navigation and orientation:

1.

Text Alternatives for Non-Text Content
- Step by Step:
- Identify All Non-Textual Content: Includes images, videos,
audios, and any multimedia element.
- Review Alt Attribute in Images: Each image should have a
descriptive alt attribute that provides an appropriate
context. Decorative
images can have an empty alt attribute (alt="").
- Verify Descriptions for Multimedia Content: Videos and audios
should have available transcriptions or audio descriptions.
- Use of Development Tools: Use browser development tools to
inspect the source code and ensure that non-textual elements contain
appropriate alternative descriptions.
- Simulate the Experience with a Screen Reader: Use a screen
reader to navigate the website and verify that non-text content is
correctly announced.
2.

Color Contrast
- Step by Step:
- Select a Color Contrast Tool: There are several tools available
online, such as WebAIM's Contrast Checker.
- Examine Text Elements: Select texts (including links, buttons,
and texts on color backgrounds or images) and verify the
contrast between
the text color and its background.
- Meet Minimum Ratios: Ensure the text complies with the minimum
contrast ratios recommended by the WCAG (4.5:1 for normal
text and 3:1 for
large text).
- Review Interactive Visual Elements: Verify that interactive
elements maintain sufficient contrast in different states
(for example,
when hovering or focused).
3.

Keyboard Navigation
- Step by Step:
- Disconnect the Mouse: Start the test by disconnecting the mouse
or avoiding its use.
- Tabulation: Press the Tab key to navigate through links,
buttons, and form fields, ensuring all interactive elements
are reachable.
- Shift + Tab: Use Shift + Tab to navigate backward and verify
that the tabulation order is logical and consistent.
- Shortcut Keys: Test the site-specific shortcut keys, if any, to
ensure they work correctly.
- Keyboard Actions: Ensure all actions (such as submitting a form
or opening a dropdown menu) can be performed using only the keyboard.
4.

Navigation and Orientation
- Step by Step:
- Review Location Indicators: Verify there are clear indicators
that help users understand their current location on the site
(for example,
breadcrumbs).
- Logical Structure of Headers: Use browser development tools to
inspect the structure of headers (H1, H2, H3, etc.) and ensure they
properly reflect the content hierarchy.
- Consistency in Navigation: Check that the main navigation is
consistent across all web pages.
- Search Mechanisms: If the site has a search mechanism, test its
accessibility and functionality using only the keyboard.
- Site Map and Navigation Aids: Verify that accessible site maps
and other elements that facilitate orientation and navigation
are available.

Additional Tools and Tips:

- Documentation: Record accessibility findings in detail, including
screenshots and clear descriptions of the issues.
- Testing with Users: Consider conducting tests with real users,
especially those who use assistive technologies, to obtain feedback on site
accessibility.

Remember, besides manual tests focused on text alternatives for non-text
content, color contrast, keyboard navigation, and navigation and
orientation, there are other important areas to consider to ensure complete
web accessibility. Here I enumerate a comprehensive set of additional
manual tests:

1.

Use of Forms
- Labels and Structure: Verify that all form fields have associated
labels and that the structure is clear and logical.
- Accessible Error Messages: Ensure error messages are specific and
provide clear guidance to correct the error.
- Form Validation: Check that form validations do not rely solely on
color and are accessible.
2.

Dynamic Content
- Content Updates: Test that content updates (such as news feeds) are
announced by screen readers without the need to refresh the page.
- AJAX and JavaScript Interactions: Ensure all dynamic interactions
are accessible and work correctly with both the keyboard and
screen readers.
3.

Assistive Technologies Testing
- Screen Readers: Conduct thorough tests with different screen readers
(for example, NVDA, JAWS, VoiceOver) to ensure all content is accessible
and correctly interpreted.
- Screen Magnifiers: Verify that the website is usable and legible at
different zoom levels, up to a minimum of 200%, without losing
functionality or content.
4.

Browser and Device Compatibility
- Testing in Different Browsers: Test the site in different browsers
(including mobile versions) to ensure consistency and accessibility.
- Touch Responsiveness on Mobile Devices: Ensure the website is fully
functional and accessible on mobile devices, including the
accessibility of
tactile elements.
5.

Orientation and Context
- Help Information: Verify the availability and accessibility of help
information or instructions to understand and navigate the site.
- Additional Navigation Mechanisms: Ensure there are additional
navigation mechanisms like an accessible site map and a functional search
feature.
6.

Multimedia Content
- Subtitles and Transcriptions: Verify that all videos have subtitles
and that audio files have transcriptions.
- Audio Descriptions: Ensure important videos have audio descriptions
for users with visual impairments.
7.

Timeouts and Sessions
- Time Control: Test that the website allows users to control time
limits on sessions and other timed interactions.
- Pause, Stop, Hide: Ensure elements that move, blink, or
automatically update can be paused, stopped, or hidden.
8.

Language and Readability
- Language Clarity: Assess content to ensure the language used is clear
and straightforward, facilitating understanding for all users, including
those with cognitive difficulties.
9.

Testing with Diverse Users
- Usability Testing with People with Disabilities: Conduct tests with
users who have various disabilities to obtain direct feedback on the user
experience and identify accessibility issues not detected in
previous tests.

Conducting these additional manual tests will help you cover a broader
spectrum of accessibility needs and ensure your website is inclusive and
accessible to all users.


*Jano Llorca*
Consultor SEO - SEM - Social Ads
UX - UI - Diseño y Accesibilidad Web

Teléfono: 673 346 726
<EMAIL REMOVED>

<https://ilumina-agencia-consultora-seo.business.site/>


El jue, 14 mar 2024 a las 15:44, PATIENCE AGABIRWE via WebAIM-Forum (<
<EMAIL REMOVED> >) escribió:

> Hi everyone,My name is Patience, from Uganda. I need support on how to run
> a manual accessibility test of a website. My focus is on text alternatives
> for non-text content, color contrast, keyboard navigation, navigation, and
> orientation. I have already used WAVE for the automatic accessibility
> evaluation test. I will be grateful for your kind support. Thank you.
> Patience AgabirweMakerere university
>
> People are different - and new technology must take that into
> account!MediaLT
> > > > >