Questions tagged [accessibility]
A general term used to describe the degree to which a product, device, service, or environment is available to as many people as possible. Accessibility is often used to focus on people with disabilities or special needs and their right of access to entities.
859
questions
4
votes
2
answers
121
views
Using label and tabindex for non-selectable elements that give context about the page
My work is developing a page to display a filterable list of mortgage products. As you can imagine mortgages are really complex, so there's a lot of extra information that a sighted user can simply ...
- 499
1
vote
1
answer
125
views
Accessibility reading order VS DOM order in a list of events
I'm trying to fix a CSS/DOM order problem on a website so it can pass an accessibility audit.
The problem is that the website is very visual, and the fixes must not change the appearance (as much as ...
- 3,245
3
votes
1
answer
78
views
Direct voice interactions examples in use as an alternative to voice assistants
After reading an article explaining the difference between using your voice to controlling the UI (i.e. direct voice interaction) compared to dealing with a voice UI (e.g. chatbots or voice assistants)...
- 1,692
17
votes
4
answers
3k
views
Maximum contrast ratio for good accessibility
So we are remaking an enterprise app from scratch. This time we want to base our design decisions on proper research.
Our users use the app 24/7 with high requirements for UX. So our main goal is to ...
- 309
10
votes
3
answers
2k
views
Is tabbing the best/only accessibility solution on a data heavy map UI?
We are building a digital library search tool for which we need to implement accessibility standards.
The map is VERY data dense (you can experience it here and I have included a screen capture below)....
0
votes
1
answer
54
views
Accessibility text of the "- Any -" option on HTML <select> element - do i need dashes/marker around the "any" option?
For the HTML element - Do I need dashes/markers around the "any" option to satisfy accessibility? If no markers, does the text have to be a sentence ? What types of text is accessible?
For ...
- 3,245
0
votes
1
answer
3k
views
Pie chart colors accessibility
I have to find colors for a pie chart that look nice and are accessible at the same time. I found that pastel colors look nicer than bright bold colors.
But for different kinds of color blindness, ...
19
votes
5
answers
2k
views
How detailed should a text alternative version of an infographic be?
Had a debate with a collegue recently about a accessible text alternative to an infographic we have. When they wrote the text alternative they wrote in detail exactly what was going on in the picture ...
JonW♦
- 37.2k
1
vote
1
answer
879
views
What accessibility pattern for filter/sort "dropdown"?
I have a design that displays a list of content that you can filter by different categories. Each filter is displayed in a dropdown menu that lets you choose one or more options, which when activated (...
CommunityBot
- 1
3
votes
1
answer
113
views
(WCAG) Should I use HTML tables for displaying singular data sets?
I'd like to display tabular data (an order summary) in a vertical table (headings in the left column, values to the right). In my use case, there is only ever one data set to display, so I'm unsure ...
- 3,245
1
vote
2
answers
245
views
Why does NNG recommend skeleton screens for full page but not for individual components
I need to decide between using a skeleton screen or a loading animation for the contents of a modal.
The modal itself contains an image, title, paragraph, couple of CTAs and a carousel at the bottom ...
- 3,245
7
votes
0
answers
111
views
Braille input alternatives for people with less than three fingers per hand
I would like to know what braille input alternatives exist for blind users who do not have all of their fingers. I am interested in both software and hardware methods implemented in assistive ...
- 89
0
votes
2
answers
85
views
How can i demonstrate that a file has been uploaded from the selected element on a table in a dashboard
So, I have the following table on a dashboard that i'm trying to design in order certain process for the place where i work.
On it, I have a few fields (promoter's full name, legal terms, number, ...
- 1,684
4
votes
1
answer
111
views
How do unicode block characters affect accessiblity?
I'm formatting an online poem that uses blackout text for erasures. My plan is to use an XML block character ( █ █) or █) to replace the appropriate characters. Does this have any ...
- 37.3k
1
vote
3
answers
216
views
What are some cases, if any, where a button element should act as a link?
Common practice is for links to use the a element, and buttons to use the button element. But are there any cases (even if their edge cases) where a button, via Javascript, should behave like a link?
- 1,684
1
vote
3
answers
268
views
If I display a hidden button, based on a radio button selection, does it meet accessibility requirements?
HI I have a scenario where a user (car dealership) has to fill out some car details for a sold car and then print a driving permit. When they click the 'print permit' button the permit will print and ...
- 11.4k
0
votes
1
answer
232
views
How to check contrast of a transparent button with a border?
Simple question but I can't find the correct way to test.
I have a normal button, that is transparent but has a border colour with some opacity. I'm not convinced that the contrast ration is high ...
- 11.4k
3
votes
2
answers
246
views
Are contrast checkers really accurate?
Is WCAG AA level truly necessary? I'm having difficulty making optimal contrast choices, and honestly, bold text, even at 16px, appears much more readable than regular text. Additionally, I often ...
- 15.5k
1
vote
3
answers
539
views
Having a separate accessible page for screen reader users
I have been working in the accessibility of an accordion that is used to take user input from checkboxes and return a list of criteria based on the user input. We are using Outsystems and have not ...
19
votes
8
answers
4k
views
Is colour alone enough to convey warning?
I'm designing page that has an alerts panel in relation to healthcare. I'm using a pale red to convey that action needs to be taken immediately, orange to show that something is due soon and green to ...
- 95
85
votes
15
answers
20k
views
How to make text look *not* clickable
Problem:
I am currently building a textbook exchange website as pictured below. During beta testing users kept trying to click the three snippets of text under the logo ("6 books listed," &...
- 95
1
vote
2
answers
504
views
What's the right UI of a dropdown when it's disabled?
There are several settings that users need to go through, one of them is selecting a model. By default, a model is pre-selected in the dropdown field. However, if the user expands the advanced options ...
- 11.4k
2
votes
3
answers
149
views
How to indicate disabled list items in a list with alternating backgrounds?
I have a table of search results that have alternating grey and white backgrounds that, on it's own, look quite pleasant in my opinion:
Now, the user also has the option to unselect items by clicking ...
- 11.4k
9
votes
5
answers
3k
views
How to indicate that a button is locked?
I am designing a service, where certain features would be available only for registered (and paid plan) users.
On the front page, there are two options: "Quick scan", that selects the ...
- 3,245
2
votes
2
answers
592
views
How to make tables accessible
The main issue is that if some cells are NOT clickable and others are, then it will be a poor user experience if user tries to click on the cell and nothing happens.
I need some help in writing labels ...
CommunityBot
- 1
3
votes
2
answers
378
views
Accessibility of Button States
I've seen some discourse online that best practice is to design the 'focused' and 'hover' states of buttons differently.
I was wondering if there is any practical reason or accessibility requirements ...
- 121
2
votes
1
answer
93
views
How to Address Keyboard Limitations for Users without a Numeric Keypad?
I'm currently working on a web application where users can use their keyboard number pads (mainly the following keys 2,4,5,6,8) to change perspectives from which the user is watching a 3D scene. For ...
- 37.3k
8
votes
2
answers
42k
views
What is the most dyslexia friendly colour combination
Following on from this question I asked a while ago:
What is the most dyslexia friendly font?
I'd like now to know whether there are any colour combinations (or sets of colour combinations from ...
- 1
2
votes
4
answers
471
views
What are the best practices to decide the length of label characters on the buttons?
I have come across lot of designs on internet where buttons are labelled with two or three words. While I did my research on various design systems i found the guidelines talking about meaningful ...
- 19.5k
4
votes
1
answer
132
views
HTML Aria function not being read by screen reader - Bad design?
I'm looking into how accessible some websites are using WebAIM's WAVE tool. Many websites nowadays use the burger menu symbol to indicate the menu (YouTube and Gmail for example) and often I see the ...
CommunityBot
- 1
3
votes
1
answer
427
views
Do accessibility standards (WCAG AA) require a screen reader to announce an HTML element upon mouse hover?
We are using the screen reader NVDA. We have a website that we are trying to make WCAG AA compliant. If you use only a keyboard (no mouse), and use the Tab key to navigate around the page, whenever an ...
- 3,245
0
votes
1
answer
145
views
Minimum touch target for apps
It is stated in human interface guidelines and material design that the touch target should be 44x44 & 48x48 respectively. Many top apps don't follow; isn't this an accessibility issue?
- 3,245
0
votes
1
answer
291
views
Do small icons have to pass at least 3:1 for contrast accessibility?
Can anyone clarify if icons (UI elements) 20x20 etc have to be 3:1 and is that a recommendation?
Thanks
- 3,245
1
vote
3
answers
227
views
Design system – Different font sizes for small an big viewports
everyone! We are currently working in a project team on a design system that is primarily used to develop web applications. These web applications mainly consist of forms. One requirement here is that ...
- 11.4k
1
vote
1
answer
754
views
Does an input type text with its css display property set to none need a label?
We've got a few inputs in various places, which are of type text but their display property is set to none. Something like this:
<input type="text" style="display:none" value=&...
- 37.3k
1
vote
3
answers
302
views
Accessibility question. Company has secondary brand color (orange) that doesn't pass any requirements. Only option change color?
The company I work for uses dark blue as the main primary color and orange as the secondary color. They have used it for years. It doesn't pass any accessibility requirements. We can't go darker since ...
- 12.1k
0
votes
1
answer
50
views
What is the UX guideline or ruleset for making accessible while we have conditional formatting colors applied to each rows?
While we have color palette to handle conditional formatting of table rows we want to create accessible color palette. How is this handled addressing accessibility for colour blind like greyscale?
Any ...
- 3,245
11
votes
4
answers
4k
views
Can screen readers interpret Unicode styles fonts such as bold and italics?
I have seen serval social media channels using Unicode to make part of their text bold or italicised on websites such as Twitter, where this sort of thing is usually not possible.
It crossed my mind ...
- 3,310
0
votes
3
answers
416
views
How do I make a grid of radio buttons accessible and intuitive?
Bakground
I'm designing a form for recruiters where one question pertains what qualifications are required for the job.
My employer is very serious about accessibility/WCAG so any designs need to ...
- 3,245
0
votes
0
answers
48
views
Why does macOS default to not allowing tab to focus on buttons?
I know I can turn it on and also use the OptionTab but I was wondering why they would use that as the default in the first place. There was an article about it from 2014 but has been updated over ...
0
votes
2
answers
135
views
Should my headline be conversational, or stick to the numbers?
which of these two options is easier and clearer for the user to understand and consume?
Option 1:
Option 2:
- 11.4k
0
votes
2
answers
83
views
Are two buttons with similar appearance and text an accessibility concern?
I'm inspired by this answer: https://meta.stackexchange.com/a/386770/175002 but I've come across this elsewhere as well.
The two buttons read:
Accept all cookies
Accept only necessary
I'm straining ...
- 624
0
votes
2
answers
466
views
APCA (WCAG 3.0) does not allow for 14px font to be used as a regular base
According to APCA (WCAG 3.0), we are not able to use 14px font as a regular base, but when it comes to SaaS application design, 14px is commonly used as the base font size. Despite my attempt to use ...
- 309
1
vote
2
answers
84
views
Correct example, incorrect example (true/false box) as div, what aria to use?
so on website I'm building I have these div blocks, one block is for "correct example", and the other is for "Incorrect examples" (like Info & warning kinda thing)
I have the ...
- 499
4
votes
3
answers
3k
views
Long multiple-selection drop-down menus with search for visually impaired
How could we support visually impaired people to select multiple values from a long list of options (a few hundreds options)?
I have tested some multiple-select search drop-down with screen reader (...
- 101
1
vote
4
answers
2k
views
Why WCAG 2.0 doesn't comply with its own line length criterion of 1.4.8?
WCAG 2.0 Success Criterion 1.4.8 clearly specifies that to achieve AAA conformance level, Reading content in a single line should not exceed 80 characters for non-CJK (Chinese Japanese & Korean) ...
- 633
0
votes
1
answer
49
views
Section 508 and "applets and plugins"
Before the Section 508 refresh, 508 had the following provision:
(m) When a web page requires that an applet, plug-in or other application be present on the client system to interpret page content, ...
- 3,245
6
votes
1
answer
1k
views
Digital signatures for the visually impaired
I'm working on a web application that allows users to digitally sign financial documents.
I need to make this accessible for people with visual disabilities but I cant' find good information for ...
- 5,578
0
votes
2
answers
1k
views
Does a hover state background need to pass color contrast for accessibility?
We have some discussion going on between myself (design) and lead engineer. With this key question:
Does the background of a hover state have to pass color contrast?
Our current system has our ...
- 3,245
1
vote
1
answer
53
views
Are vertical facet scrollbars allowed with AAA compliance
We are designing a B2B e-commerce site and the client is requiring AAA compliance. I know, I know.. but here we are. I have searched and cannot find anything regarding scrollbars for AAA compliance. ...
- 3,245