Skip to main content
59 votes
Accepted

Should disabled elements be focusable for accessibility purposes?

I do work on a professional webapp for visually impaired, screen reader users. We do user testing regularly, and this has been raised many times during user test sessions that disabled elements that ...
Leths's user avatar
  • 1,987
16 votes

Should disabled elements be focusable for accessibility purposes?

This is a bit of a tricky one. Normally, with regular form elements, it would be best to fully remove anything you can't interact with or serves no purpose. However, that particular button you're ...
Roux Martin's user avatar
  • 14.2k
12 votes

Should disabled elements be focusable for accessibility purposes?

As a marginal counterpoint to @Leths, a screenreader lets you get to every object on the page, whether disabled or not, unless they're specifically hidden from the screen reader using aria-hidden=true....
slugolicious's user avatar
  • 3,305
7 votes

Are Placeholders good for default values?

If its acting as a value then why not have it as a value? The placeholder text should be used to hint at the type of entry that is required. In your particular scenario I would either set the value ...
Dave Haigh's user avatar
  • 6,161
6 votes

What is the benefit of using the HTML5 <time> tag?

The time element is a machine-readable element. So it is mainly used to help out the computer not the user directly. https://css-tricks.com/time-element/ The element in HTML represents a machine-...
DasBeasto's user avatar
  • 15.3k
6 votes

Should disabled elements be focusable for accessibility purposes?

Edit: The logic is that only if an element responds to events it can be focused. However as @Leths comments from his experience this can be detrimental in some cases. So I guess the best thing to do ...
Alvaro's user avatar
  • 16.8k
5 votes

Which form widget for (seemingly) linear input without default value?

I will suggest you go with radio buttons over slider, because sliders lack the very important features such as: Precision, Speed, Cognitive Load etc. Here's a fantastic study done on this topic (the ...
Dipak's user avatar
  • 16.2k
5 votes
Accepted

Which form widget for (seemingly) linear input without default value?

There is already a an interface in hardware design where a potentiometer or rheostat has a switch at one of the ends of the range. In some cases, it is used as an on/off switch, e.g. for a cheap ...
Harley's user avatar
  • 66
5 votes
Accepted

Are Placeholders good for default values?

I am not an english native speaker so I only knew of the term placeholder when I entered Web design/development. So I just searched Wikipedia about the meaning of the word and read this interesting (...
Alvaro's user avatar
  • 16.8k
5 votes
Accepted

Need explanation how Clear input button accessibility works

You can simply add the label of the input for context, for example "Clear First name". This is particularly useful if this type of button exists on multiple fields on the page, otherwise it could be ...
Victor's user avatar
  • 171
4 votes

Should I use the native HTML5 date picker when available?

Generally it is best not to force styling from one system to the other. There is a reason each OS has a particular styleguide when creating products for their platform. It creates a unified scheme ...
Socrates Kolios's user avatar
4 votes

Does anyone know of any examples of the use of character counter on an input field?

My bank has a strict 5-digit pincode policy and the input looks like as many underscores as there are characters allowed. It's very minimalist, yet you quickly get that each corresponds to a character....
raphv's user avatar
  • 141
4 votes

Are Placeholders good for default values?

Straight away I assumed Any wasn't a value I could leave there, however the form was insisting I enter Any value. Slightly misleading in my opinion. How about using a select, or a filtering select ...
Jack hardcastle's user avatar
4 votes

Should disabled elements be focusable for accessibility purposes?

Here is an example of the behavior I would expect from a wizard. In this case it is an uninstall dialog (the first program I could find to try it on). This is how it has been for as long as I can ...
arlyon's user avatar
  • 51
4 votes
Accepted

Do users actually use the arrows in <input type="number">?

The answer will depend on multiple factors: What is the allowed range for the input? How far is the wanted value from the current value? What is the input being used for? What type of navigation does ...
Tot Zam's user avatar
  • 5,885
3 votes

Are Placeholders good for default values?

I actually agree with Tim's suggestion and think that using placeholders for default values makes total sense. 1) By using Tim's suggestion, the user can distinguish between fields the user has typed ...
Tulio Alcantara's user avatar
3 votes
Accepted

Is a label-tag inside a button-tag valid and / or has any UX- / ergonomic-reasons?

The element does not render as anything special for the user. However, it provides a usability improvement for mouse users, because if the user clicks on the text within the element, it toggles the ...
user3120655's user avatar
3 votes

Wcag 2.1 Success criteria-1.3.6

oh you have stumbled upon a bit of a rabbit hole there! This is a (as far as I am aware only proposed) method to allow interfaces to be simplified and or adapted for people using Augmentative and ...
GrahamTheDev's user avatar
  • 2,598
2 votes

Using placeholders on input elements

Placeholders in Form Fields Are Harmful You should simply avoid using placeholder: there is plenty of reasons... [nngroup.com / Placeholders in Form Fields Are Harmful] Go input masking If you want ...
Stefano's user avatar
  • 871
2 votes
Accepted

For Screen Readers: How to markup a group of text items to be read as one item? Should I even try?

(expanding comment into answer:) For mobile users you can use the nonstandard role="text" on the parent element. It's hacky and only works on WebKit, but that is fine since in my recollection, only ...
Victor's user avatar
  • 171
2 votes

How to solve UX vs screen reader accessibility problem?

You avoid "click here" because not every user will be using a mouse (especially now so many people use touchscreens and "tap") and just use the anchor with sensible text that can stand alone when ...
Owain's user avatar
  • 119
1 vote
Accepted

Where should keyboard focus after closing a dialog with the button opening the dialog removed?

The focus should go to the next item. In that way you can go easily go through each item and delete it.
bart's user avatar
  • 428
1 vote

UI element names and hierarchy for web SaaS B2B application

Atomic Design Atomic design is methodology for creating design systems. There are five distinct levels in atomic design: Atoms, Molecules, Organisms, Templates, Pages I think this methodology will ...
Pectoralis Major's user avatar
1 vote

Should disabled elements be focusable for accessibility purposes?

Yes. Disabled buttons should be focusable. Not only because accessibility, but also to explain in alerts why it is disabled. My rule of thumb is the relevancy of the command. Some buttons I hide when ...
Lucas's user avatar
  • 395
1 vote

Which form widget for (seemingly) linear input without default value?

Like all UI interaction widgets, they each have a specific when to use/when not to use. Sliders are great for selecting or changing values, e.g. from 0 to 10, but they only work well when precision ...
SteveD's user avatar
  • 8,934
1 vote

Which form widget for (seemingly) linear input without default value?

I would suggest using push button group which acts as a radio group (only one selected at a time) but with difference that selected value can be unchecked (radio button cannot be unchecked). In this ...
Miroslav Jonas's user avatar
1 vote

What are the differences between icon and button badges?

I think, the red color has two points of view. One is used for Dangerous, another one is used for Alert or Something Important to see immediately. In these both are different. The Dangerous sign is ...
Kyaw Zin Wai's user avatar
1 vote

Is there a pattern for an HTML select box that provides existing hardcoded values but also needs to be able to take custom input?

Given you stated implementation is not a concern... Javascript libraries like ui-select, typeahead.js, Select2 all have a setting allowing the user to enter an arbitrary value.
Izhaki's user avatar
  • 32.6k
1 vote

Which form widget for (seemingly) linear input without default value?

There are ways where a neutral position can be clearly communicated to the user. Survey Slider A control will have a default state. It is not necessary that you take that default state into account. ...
Harshal's user avatar
  • 3,125
1 vote

Are Placeholders good for default values?

Placeholder Accessibility Having read the article you referenced, Placeholders in Form Fields Are Harmful, while placeholders may not be actively harmful, they're at least not as useful as you think. ...
dogwoodtree-dot-net's user avatar

Only top scored, non community-wiki answers of a minimum length are eligible