translate

Featured Links

Questions & Answers

This listing is a compilation of both questions asked in-site and questions related to accessibility themes gathered from different sources (stackoverflow, UX Stack Exchange).

Displaying 21 - 40 of 92 questions

How do I make a screenshot image accessible?

I'm trying to make my website fully accessible for devices like screen readers. In one page on my site, I have a screenshot of an application showing a lot of text.

Tags: 
  • html
  • css
  • accessibility
  • wai-aria

NVDA doesn't read first HTML child when focusing from parent on Firefox

When using NVDA on Firefox it fails to read the first child when focusing from a container, but it is able to read the second child.

Generic Example:

Tags: 
  • html
  • firefox
  • accessibility
  • screen-readers
  • nvda

Blinking text for screen reader

I am now making my website readable by screen readers.

Tags: 
  • javascript
  • html
  • css
  • accessibility

How to tag an element below form elements so that the screen reader picks it up

Say I have a div with some p tags below some text elements, how do I aria tag these so the screen reader picks these up?

I could give the div tagindex="0" but my linter complains:

Tags: 
  • html
  • css
  • accessibility

Sreen reader inconsistencies when aria-labelledby applied

I had some strange behaviour where the chrome screen reader was reading labels twice, I inadvertently "fixed" it and I'm not sure the fix was correct.

Tags: 
  • html
  • accessibility

Why are screen readers not reading out the label for a select element

Stackoverflow

If I have a standard select element with a label, like this:

Tags: 
  • html
  • accessibility

How to make my click accessible through keyboard tab [duplicate]

This question already has an answer here:

Tags: 
  • html
  • accessibility
  • wai-aria

a11y: Input fields, wrapped in a div, attached "by id" to a label

I have a time picker component, composed by two separate input fields that work together to create the illusion of being one.

This is how the skeleton looks like

Tags: 
  • html
  • label
  • accessibility
  • screen-readers

How can I determine the order of HTML elements read by a screen reader?

Is it possible to determine the order of HTML elements read by a screen reader (like TalkBack or VoiceOver) regardless of their position in the DOM?

Tags: 
  • html
  • webview
  • accessibility
  • screen-readers

What is the proper aria-label for a link that will open and play a video?

I have JS that will be handling videos and there are anchor tags with an icon in them on the page which, when clicked, will open a video.

Tags: 
  • html
  • accessibility

Screen reader not associating label with select

I have the following code for a select:

Tags: 
  • html
  • accessibility
  • html-select
  • screen-readers

How to display a list of links as a drop down select?

Stackoverflow

I want to display a list of links like a drop down select, without losing the semantic if possible. Here's what I tried. The CSS obviously does not work now.

Tags: 
  • javascript
  • html
  • css
  • accessibility
  • semantic-markup

Link contain no text showing error in Wave accessibility evaluation tool

Stackoverflow

I have an HTML page in which there is

<a href="example.com"><i class="myclass"></i></a>

Tags: 
  • html
  • hyperlink
  • accessibility

Semantic input error message inside label

I'm using <label> to wrap an input such that its success and error messages can appear inside its label for association.

Tags: 
  • html
  • forms
  • accessibility
  • semantic-markup
  • wai-aria

How do I detect and control the "location" of focus on a page without directly adding focus to an element?

When you first load a web page, then press "Tab", document.activeElement will be the <body> tag and nothing on the page will have focus (i.e.

Tags: 
  • javascript
  • html
  • focus
  • accessibility
  • tabindex

IE issue: wrong tab focus

Stackoverflow

I have a link at the very top of the page called "Skip Navigation", that appears on the screen every time user presses Tab, and if he presses Enter while "Skip Navigation" is in focus, it takes him

Tags: 
  • javascript
  • html
  • css
  • internet-explorer
  • accessibility

Should TTY phone numbers be hyperlinked as normal numbers?

Most site developers know to use the tel: syntax for phone number links to enable easy mobile dialing:

Tags: 
  • html
  • hyperlink
  • accessibility

Is it important to have relative units to ensure Section 508 / WCAG 2.0 Level AA compatibility?

I have all my font sizes defined in pixels, e.g.

body {
font-size: 14px;
}
h1 {
font-size: 42px;
}

Tags: 
  • html
  • css
  • accessibility
  • section508
  • wcag2.0

Prevent screen reader from reading title attribute

We have an input slider that has a title attribute set to slider value. Since it doesn't have a label, we add aria-label to the input attribute.

Tags: 
  • html
  • input
  • accessibility
  • screen-readers