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.

Filter by
Sorted by
Tagged with
2
votes
1answer
56 views

Help on separating terms in autosuggestion [duplicate]

I was working on a solution where we introduce an autosuggestion component to our users so we can enable them to fill the required information in a better way. This list use more than 1000 words in ...
1
vote
1answer
78 views

Best design for product list page of an e-commerce website

I am working on an e-commerce website. I want to display the summary of search result and want to know which layout is the best? The information that I am sowing are: Ad title Price Location ...
0
votes
1answer
65 views

HTML Elements to use with Image and Text used as a link

What are the correct HTML elements instead of just a div to use when presenting an image and text just below as one link? I would like for the image and text to be presented in an a11y correct manner.
2
votes
0answers
31 views

How should a Skip to Main function for a single page app site?

I'm part of an angular build, and we can't figure out the best practice for this is. With a the single page app, the page doesn't reload, so if the focus is on nav item 1, it will stay on nav item 1, ...
2
votes
2answers
66 views

Should screen readers read the content without tab or with tab?

I am designing a web application, which can be accessed by any visually impaired person. This web application contains various pages, and each page can have paragraphs with links, form input fields, ...
4
votes
1answer
46 views

Keyboard navigation over repeating informational elements

I have a UI like this. The user navigates through a list of people. To the right, there are two labels: Assigned and Active. A mouse user can click on the label to see some help text, as shown on the ...
0
votes
1answer
63 views

Automated opt-in accessibility, is this viable?

A client I am working with wants to make use of an automated accessibility solution in order to meet compliance standards. Particularly, they've mentioned AccessiBe. I've got no experience with such a ...
3
votes
0answers
40 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)...
3
votes
3answers
135 views

Is a bottom sheet with no close button accessible?

I'm using a bottom sheet. On Android, people can use the back button to close it, drag it down or tap outside the area. On iOS, people can drag it down or tap outside the area. I'm just wondering if ...
4
votes
2answers
59 views

Does adding a “title” attribute to the “label” element instead of the “input” harm accessibility?

I'm creating an HTML interface that has an input text field with a label attached. The label has a short name for the input and I want a more detailed description to appear as a popup for visual users,...
3
votes
3answers
76 views

What term best describes focus on a low barrier to entry for an application?

I am building an application that I would like to describe as being accessible in the sense of having a very low barrier to entry. By this I mean it's an online tool that you can start using ...
2
votes
2answers
44 views

Opinions on stretched-links and alternatives?

Stretched links allows to have a whole block as a link (without having to wrap all the content in the <a>, which would achieve the same by the way) One issue I see is that you can't select text ...
2
votes
2answers
58 views

One label for multiple fields?

I'm not very familiar with the accessibility and I need help for situation where I have multiple field and every field has same question. Is it ok to put all field under one label? For user who can ...
1
vote
1answer
45 views

Does animated arrow on link hover violate WCAG 2.2.2 Pause, Stop, Hide?

If a link has an animated hover state, e.g. an arrow that moves from left to the right and back, or as is in this example on CodePen is it still compliant with WCAG 2.2.2 Pause, Stop, Hide guideline? ...
1
vote
1answer
36 views

Translation of Annual and Monthly pricing as “mo” and “yr”

I'm curious if anyone knows if abbreviating monthly and annual pricing as "../mo" and "../yr" will translate into all other languages? For example, if I display pricing to users as ...
1
vote
1answer
26 views

What constitutes “web content” and “authoring tool” for the purposes of the VPAT?

I'm filling out a VPAT for our company's product and having some difficulty understanding the terminology. Our product is an integration tool for flowing data between different systems. The frontend ...
0
votes
1answer
33 views

Accessibility - SC 1.4.4 - Placeholder text not visible when browser zoom is set to 200%

I have a question regarding SC 1.4.4 Resize Text for Placeholders for inputs. I am not for the design we currently have, but have to work a solution with whatever design I have. The first row in the ...
1
vote
4answers
158 views

Does including a Konami-code triggered Easter Egg negatively impact keyboard accessibility?

On an open-source project I'm involved in, one of our devs added a mini-game for April Fools Day, which could be opened and played by pressing the Konami Code sequence on your keyboard (up, up, down, ...
2
votes
3answers
123 views

Is it accessible to have lists without a heading, assuming previous lists do?

Assume this HTML structure: <h2>Our latest News and Events</h2> <ul> <li>news item 1</li> <li>news item 2</li> <li>news item 3</li> </ul&...
1
vote
1answer
37 views

How to design a form for accessibility using ARIA? [closed]

I'm redesigning an application form and want to make sure it is as accessible as possible. I'm not an expert in accessibility by any means, but I am trying to mark up the design for developers to code....
1
vote
0answers
72 views

Patterns for adjusting settings which may hinder the user's ability to adjust that same setting again

This question is about those self-referential settings where the ability of the user to control a device, say: using a mouse cursor, or viewing it on a monitor screen is itself affected by the ...
1
vote
2answers
95 views

Is there a standard keyboard only method of removing focus from all HTML form inputs?

When navigating an HTML form using Tab, a properly designed form will allow that all interactive elements are accessible and focusable, but how does one break out of the focus using the keyboard? ...
0
votes
1answer
60 views

Dark mode - dark blue instead of dark gray/black?

My company’s app currently doesn’t have a dark mode and we’d like to support that. When I was reviewing my dark mode palette with my fellow designers, they weren’t so keen on using a dark gray ...
2
votes
1answer
141 views

Image comparison sliders and visual accessibility

I am creating an image slider for a site, and I am confused on how to successfully meet wcag requirements. Below is an example that conveys the idea of what I am creating. I have read a couple ...
0
votes
1answer
47 views

Tabbing into a hidden navigation menu

This is a question about the interaction between navigation via keyboard (tabbing) and initially-hidden navigation items. I’m asking from both a UX and accessibility perspective. My site has a slide-...
1
vote
1answer
51 views

Scrollable container - Accessibility

we are hoping to use a scrollable container in the terms and condition section. The container is NOT iframe and we will make it with overflow hidden CSS. I need your thoughts only from the ...
2
votes
1answer
57 views

Accessiblity and labeling multiple buttons

I'm working on a mobile app. I have a list with multiple groups and at the end of each group, there are some buttons. I'm not sure what the screen reader should say when focusing on the buttons. The ...
12
votes
3answers
3k views

Is alt text required for an image if the information is present elsewhere on the page?

For example, if a page's sole purpose is to describe the contents of an image (e.g a photograph of a document is displayed on the page, and the page displays the contents of the document), is alt text ...
0
votes
1answer
117 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, ...
3
votes
1answer
119 views

a11y - Captioning for videos with accompanying text and no audio

We sell a widget. And we're building a webpage for the widget. We have a section on the webpage where we want to show a text description of a feature of that widget, and below the description, we show ...
3
votes
1answer
116 views

Why do many prominent web apps use blue primary button with white text, when it fails the WCAG 2.1 contrast threshold

WCAG 2.1 says to have a minimum contrast ratio of 4.5:1, but blue primary buttons of Twitter, Figma and Outlook have white text which fails to cross the threshold ratio. Is there another scientific ...
3
votes
2answers
46 views

Should a Carousel hide visibly hidden content from screen readers

There's a carousel on the site I am on which does as most accessible carousels, visibly hidden items are also hidden from screen readers (in this case using aria-hidden). This seems to be the normal ...
3
votes
1answer
47 views

Most visible wavelength/ color for mesopic vision

Is there an established study that demonstrates which is the most visible wavelength range under Mesopic Vision conditions? Ideally, they shouldn't refer to Scotopic Vision (since I have enough data ...
2
votes
1answer
43 views

Design and implementation of right-to-left or left-to-right for web applications

To me it seems to be a rare sight, but I did notice that on the Material UI framework website there is a toggle/button to switch between left-to-right and right-to-left orientation of user interface ...
0
votes
1answer
53 views

Mobile app accessibilty: bottom sticky footer when there is a long scrolling feed [closed]

Our native mobile app has a long facebook-style feed on the first screen with four tabs in a sticky footer. How do we make those tabs easily accessible while using a screen reader? The feed is not ...
1
vote
1answer
50 views

Is specifying link colours a violation against WCAG's Success Criterion 1.4.8?

The text of the WCAG's Success Criterion 1.4.8 page says: Success Criterion 1.4.8 Visual Presentation (Level AAA): For the visual presentation of blocks of text, a mechanism is available to achieve ...
1
vote
1answer
95 views

Using aria-label on heading tags

Is it wrong to use aria-label on heading tags? h1, h2, h3 etc. I'm working on a frontend, most titles are reasonable in length roughly 80 characters in length, the longest title is 480 characters. So ...
3
votes
1answer
89 views

WCAG 3.0 structure and assessment criteria benefits in current practice

Even though it is currently in draft form, the WCAG 3.0 document is looking to be more user-friendly and easier to assess compliance against. I think the change in the document structure and language ...
16
votes
3answers
2k views

Why red and blue boxes in close proximity seems to shift position vertically under a dark background

For me (wearing glasses) the red box below appears to be slightly above or below the blue one, depending the angle I'm viewing it. Some of my colleagues don't see it and some do. Not all wear glasses. ...
2
votes
1answer
55 views

Order of list boxes in a dual list box

A dual list box is a component-based on two list boxes placed together that allows adding, removing, and ordering items. According to Kaley from the nngrounp: "The Listbox on the left holds ...
3
votes
1answer
145 views

Accessibility and Autoscroll

I have a scrollable list of items, with a possibility to add a new item to the list. The new item always appears on the top of the list. Also in order to inform the user that an item has been ...
0
votes
1answer
163 views

How do I make a dropdown select accessible?

What I mean by dropdown is the implementation found in Bootstrap and other common front-end frameworks. I want to replace <select> elements in my forms with dropdown menus because I need the ...
8
votes
3answers
905 views

Accessibility of tables without borders

Does having a data table without cell borders affect accessibility and usability in any way? I can't seem to find an answer online. Having borders definitely increases readability. Can we say it is a ...
4
votes
2answers
107 views

Color standards for seat booking

I am working on an application with a seat booking UI. Are there visual standards, colors in particular, for conveying the type and state of each seat? Examples of seat types: standard, accessible, ...
1
vote
1answer
199 views

Does a skeleton loader need to be accessible?

Are there concrete guidelines about accessibility in skeleton loaders? How might we design them to be more accessible?
0
votes
1answer
34 views

Why do some emails include a link to the same destination as the button right above them?

Can someone explain the purpose behind this practice? Is it an accessibility issue and is this practice outdated? For example: "If you have trouble with the link above, copy and paste this URL ...
0
votes
0answers
29 views

Accessibility guidelines for mobile web map interactions

Currently working through a map experience for mobile web and was hoping someone could provide me with a little clarity on accessibility guidelines. Specifically, what are the the most inclusive ...
2
votes
1answer
253 views

(Accessibility) - Back button placement on the page in SPA

I am working with an SPA with Angular and the designs indicates that there is a back button and it is before the Page level heading usually the H1. For SPA, it is a general practice that we place the ...
2
votes
1answer
43 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 ...
1
vote
2answers
40 views

link between a website's accessibility and an increase in user experience

I'm trying to find a scholarly article which demonstrates a link between a website's accessibility and an increase in user experience. Google only returns 1 result for +accessibility +website +"...

1
2 3 4 5
15