Two columns of open books
designing-inclusive-mobile-apps

Books

Developing Inclusive Mobile Apps

Building Accessible Apps for iOS and Android.

inclusivedesign

Books

Inclusive Design for a Digital World - Designing with Accessibility in Mind

What is inclusive design? It is simple. It means that your product has been created with the intention of being accessible to as many different users as possible.

csstricks

Design Patterns

Striking a Balance Between Native and Custom Select Elements

This “hybrid” select is another attempt to create a good looking select while getting as many native features as possible.

paste

Design Systems

Paste

Design System for creating high quality, inclusive customer engagement experiences.

nhs

Guides

Making information and the words we use accessible

The best way to find out how to make information accessible is to ask the person or the people you will be giving the information to.

feather-logo

Guides

Inclusive teaching - audio describing your own presentations

Here’s some practical tips and examples that show how some small changes in the language you use can make a significant difference for people in the audience that benefit from your descriptions of the visuals.

wcag-guides

Guides

WCAG easy!

Understand once and for all how to properly apply WCAG in your digital products.

shopify

Mobile

Mobile Accessibility - How to Build Apps that Work for All Users

On the web, we’ve made a lot of progress, and it’s generally accepted that accessibility is crucial in creating digital products that everyone can use with ease. Mobile accessibility, on the other hand, is still fraught with problems.

brunomag

Typography

Typographic accessibility in more detail

The three pillars of accessibility - emotional, functional and technical - can be applied to any output whether that is a product or a service. Each industry and sector will have its own specific definitions relevant to their output.

w3c

Web Standards

Making Content Usable for People with Cognitive and Learning Disabilities

This document is for people who make web content (web pages) and web applications. It gives advice on how to make content usable for people with cognitive and learning disabilities.

fingerspelling

Simulators

Fingerspelling

Learn the ABC in American Sign Language with machine learning.

alicia-design

Article

What is Inclusive Design, anyways?

Inclusive Design is design that considers the full range of human diversity with respect to ability, language, culture, gender, age and other forms of human difference.

eric-logo

Blog

Eric Bailey's Blog

Blog on accessible and inclusive design.

sarahhigley

Blog

Sarah Higley's Blog

A collection of accessibility-focused articles.

scotthara

Blog

Scott O'Hara's Blog

A collection of articles on accessibility and UX.

hassell-inclusion

Podcast

Digital Accessibility Experts Podcast by Hassell Inclusion

Whether you call it Inclusive Design or Digital Accessibility, whether you're an individual with a passion or an organisation wanting to know more, this podcast explores a range of topics on accessibility. Hosted by Jonathan Hassell, its aim is to share inspiration, expertise, and hints and tips to help speed you on your digital accessibility journey.

hassell-inclusion

Blog

Hassell Inclusion Blog

Regular blogs from the Hassell Inclusion team on a range of topics from the strategic through to the more practical.

twenty-four-accessibility

Article

Pixels vs. Relative Units in CSS - why it’s still a big deal

Long live the modern browser! Browsers are getting better these days. We seem to be in a golden age where there’s a never-ending stream of new features added for the benefit of the users accessing the page, and really great tools for those creating the page.

humane

Resources

Humane by Design

A resource that provides guidance for designing ethically humane digital products through patterns focused on user well-being.

accessible-form-fields

Resources

Accessible Form Fields

A small figma component for accessible form fields.

a11yspace

Resources

Webflow accessibility

Make your Webflow sites accessible.

nng

Article

Opening Links in New Browser Windows and Tabs

Carefully examine the user’s context, task at hand, and next steps when deciding whether to open links to documents and external sites in the same or a new browser tab.

editoria11y

Software & Tools

Editoria11y

In many ways, Editoria11y is a stopgap solution. Most of the mistakes it catches were made because we placed new expectations on content authors ('tag your content with good structure'), but gave them tools that encouraged the opposite. The path forward is to make accessible content creation easier, and as automatic as possible.

Blog

Manuel Matuzovic Blog

Follow Manuel's blog for any front-end accessibility guides, tutorials, and resources.

levelaccess

Resources

The 2020 State of Digital Accessibility Report The Education Sector

This report is designed to be read as a companion to the 2020 State of Digital Accessibility Report (SODAR), published by Level Access in collaboration with G3ict and IAAP.

hiddedevries

Design Patterns

Heading structures are tables of contents

The heading structure of a web page is like its table of contents. It gives people who can’t see your page a way to navigate it without reading everything.

webdev-google

Guides

Accessibility for teams

Making your site more accessible can be a daunting task. If you are approaching accessibility for the first time, the sheer breadth of the topic can leave you wondering where to start.

futurelearn

Courses & Certificates

Digital Accessibility

This course will help you to understand how those with sensory, physical and cognitive impairments may be disabled by barriers encountered when using digital technologies. The course will highlight how the use of accessible and inclusive design can help overcome many of these difficulties.

Courses & Certificates

Information and Communication Technology (ICT) Accessibility

edx In this introductory course, learn how to measure an organization’s ICT accessibility and assess the importance of maintaining an inclusive workplace for both employees and customers with disabilities.

deque

Screen Reader

Screen Reader Keyboard Shortcuts and Gestures

List of screen reader keyboard shortcuts and gestures.

tpgi

Contrast Checker

Color Contrast Checker

Evaluating your design for color contrast is a critical aspect of accessibility testing and organizations may benefit from appropriate user experience training and expertise to ensure proper contrast.

sara-blogs

Video

Applied Accessibility: Practical Tips for Creating more Accessible Front-Ends

As front-end developers, we are tasked with building the front end of a Web site or application — in other words, we are building the user’s end of an interface. This is why it is crucial that we ensure that the front-end foundations that we build are as inclusive of and accessible to as many users as possible.

web-axe

Blog

Web Axe

Blog and podcast on web accessibility

Developer Tools

Accessible Components

Listing of accessible components & patterns.

web-axe

Curated List

Web Accessible Code Libraries and Design Patterns

Within a web development organization, it’s ideal to maintain (and enforce usage of) design patterns and a components library. And they should work together; design patterns create consistency among visual elements across projects and the components library creates consistent implementation of those patterns during development.

Developer Tools

The Accessibility of Styled Form Controls

A repository of styled and "styled" form control elements and markup patterns, and how they are announced by screen readers.

gov-uk

Design Patterns

Patterns – GOV.UK Design System

gov-uk Patterns are best practice design solutions for specific user-focused tasks and page types.

gov-uk

Design Patterns

Components – GOV.UK Design System

Components are reusable parts of the user interface that have been made to support a variety of applications.

smashing

Newsletters

Smashing Newsletter: Issue #289 —Useful libraries and case studies to get Accessibility just right

Building accessible pages and applications isn’t easy. We have to keep in mind how our sites and applications work with a keyboard alone, whether navigation landmarks are properly assigned, how updates are announced by a screen reader, and whether we avoid any inaccessible libraries or third-party scripts. And then, for every component we are building, we need to ensure that we keep them accessible over time.

hbo-max

Article

HBO Max adds key accessibility feature for visually impaired users

The service now offers audio descriptions for content, which describes what is happening on the screen beyond the dialog and sound effects. This feature is joined by multiple other changes intended to improve accessibility.