Edit

Share via

Designing accessible websites

  • Article

Create a webpage design that's usable by all people, no matter their mouse or keyboard preference, age, education, geographic location, language, or disability.

People using technology and browsing the web have a wide range of abilities and preferences. As you design your website, keep in mind the following key accessibility scenarios.

Screen readers

Users who are blind or who have low vision rely on screen readers to interpret and interact with the UI of your app. Interpreting involves reading the UI element names, roles, and values. Interacting with the UI involves moving the focus from one element to another and invoking functionality such as clicking a UI element.

Keyboard accessibility

Many accessibility users rely on the keyboard to navigate and operate the UI by:

  • Moving focus among elements by pressing the Tab key or Shift+Tab keys.

  • Navigating in container elements such as lists, grids, and tree views by using the arrow keys.

  • Invoking actions by pressing the Enter key or Spacebar.

  • Using shortcut keys to efficiently access other app functionality.

Accessible visual experience

Users who have low vision need a sufficient text contrast ratio for text content, and a good visual experience with high contrast themes overall. Users who are color blind need information to be conveyed in ways other than through color.

Many common accessibility issues on the web can be solved through good coding practice. The Web Content Accessibility Guidelines (WCAG) 2.0 documentation provides techniques and best practices to help you design more accessible dynamic web applications. For more information, go to Resources about building accessible websites.

Resources

  • Designing for Inclusion - Designing for Inclusion by the W3C Web Accessibility Initiative provides resources to help you better understand users with disabilities and how to design your website with them in mind.

  • Designing inclusive software - Designing inclusive software discusses Microsoft design principles and practices for the Universal Windows Platform (UWP).

  • How People with Disabilities Use the Web - This resource by the W3C introduces how people with disabilities, including people with age-related impairments, use the Web.

  • Inclusive Design Toolkit - Microsoft developed the Inclusive Design Toolkit to show how human diversity can create better design constraints and how to connect seemingly niche solutions to broader markets.