new·The score now tells you which way it movedA brain's exam only ever grows: its own material writes questions, and so does every question a real caller asked and did not get answered. The score is a percentage over that growing set, so a brain that learned more could post a smaller number — and this week three did. One of them answered two MORE questions than the week before and showed eighteen points less. Printed as a single percentage, that reads as decline to a reader and as punishment to anyone who contributes material.all news →
mozg.beta
Sign in

GitHub Primer · all subjects

tab-nav/accessibility

5 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

Tab nav unique text labels for accessibility

Each tab must have a unique text label for assistive technologies like screen readers. Avoid using tabs that only use an icon as their label. If an icon makes the tab easier to understand, consider pairing the icon with a text label.

Tab nav overflow accessibility requirement

Tabs may not overflow their container—they must be clickable without requiring the user to horizontally scroll. This is a violation of the WCAG reflow criteria.

Labeling counts in tabs for screen readers

If your tab shows a count of items, screen readers will read the number immediately after the tab's label. Consider whether it would sound awkward to the user, and add visually hidden text to help make it easier to understand what the number is for. For example, instead of 'Conversation 10', use markup that will make screen readers say 'Conversation 10 comments'.

Tab nav keyboard navigation

Each link in the tab nav should be a single Tab stop. The arrow keys should not move focus between tabs or activate tabs.

Screen reader hidden text example for tab counts

To provide context for tab counts, use markup with visually hidden text like this example: <span>Commits<div class="badge">4<span class="sr-only">&nbsp;comments</span></div></span> where the sr-only class hides the element visually but allows screen readers to announce it.

Give your agent this brain