Navigation and search improvements for accessibility

GitHub has recently made some significant user interface changes to navigation and search. Our vision is to be the home for all developers–including those with disabilities–so as we’ve built these features, we included accessibility throughout the development process. If you’re a developer with a disability or an engineer that is new to accessibility, you might be wondering:

1. What are accessibility features?
2. What do accessibility features look like at GitHub?

Let’s explore these questions in the context of our recent changes, starting with the new global navigation.

Exploring the new global navigation with your keyboard

We want everyone to be able to use GitHub without having to use their mouse. Navigating using the keyboard alone is a productivity choice for some, and for others it’s a must-have requirement. When reviewing a keyboard experience for sighted keyboard users, you need to consider at least three things:

1. A clear visual indicator which shows the user where their focus is.
2. A logical “tab order.” Users should be able to predict where they will go when they press “tab” to move forward in the sequence of interactive elements or “shift tab” to move backwards.
3. An operable interface which uses common, widely accepted patterns for keyboard interaction.

Below is a video demonstrating these features within the new global navigation. You can activate this feature using feature preview. If you’re finding feature preview difficult to use, please add a comment to this navigation preview discussion and the accessibility team will add you manually.

Searching code with a screen reader

What does code search sound like? Probably not a question most people ask themselves, but we do! We care about the audio experience that a screen reader user will have when engaging with our new search feature. Check out creating an accessible search experience with the QueryBuilder component for a deep dive on the nuts and bolts of the solution.

Below is a video demonstrating the screen reader experience within the new code search.

We want feedback

We need your feedback to make these features better. “Ship to learn” is a core value within GitHub’s culture. We know that building great software requires frequent iteration and we know users will leverage these features in new and wonderful ways which we would have never predicted. If you have questions, ideas, or a virtual high-five please add them to the accessibility discussion and visit accessibility.github.com to learn more about accessibility at GitHub.

Written by

Benjamin Allen

@benjiallen