Questions tagged [wcag]

Web Content Accessibility Guidelines (WCAG) are part of a series of Web accessibility guidelines published by the W3C's Web Accessibility Initiative.

Web Content Accessibility Guidelines () are part of a series of Web accessibility guidelines published by the W3C's Web Accessibility Initiative ().

They consist of a set of guidelines for making content accessible, primarily for disabled users, but also for all user agents, including highly limited devices, such as mobile phones.

The current version is 2.1, which became a W3C Recommendation on 05 June 2018, content that conforms to WCAG 2.1 also conforms to .

The publication of WCAG 2.1 does not deprecate or supersede WCAG 2.0. While WCAG 2.0 remains a W3C Recommendation, the W3C advises the use of WCAG 2.1 to maximize future applicability of accessibility efforts.

397 questions
0
votes
0 answers

Making a dropdown that contains radio buttons accessible

I have a dropdown that is stylized to contain radio buttons as its options/selections. I am a little confused about how to make this accessible (WCAG 2.1 compliant). Should I treat the closed drop down as a regular drop down, but once it opens, I…
0
votes
3 answers

Automatically repair bad contrast in Tailwind

I have a problem I need to solve with CSS selectors. I am trying to make automatic color overrides for Tailwind to have our site always comply to WCAG guidelines. I have a tailwind plugin I've written which automatically fixes this problem - but…
Bryan Rayner
  • 4,172
  • 4
  • 26
  • 38
0
votes
1 answer

'Learn more' links in the list of articles - is there a way to include them without failing WCAG?

I have a list of articles, where each tile links to an article through heading and CTA button. They are getting flagged as duplicate links in my accessibility checker. Most of the CTAs have 'Learn more' text, with occasional 'Download PDF' or…
janwys
  • 21
  • 1
0
votes
0 answers

Bootstap Vue.js: best practice for supplementing link text with the title attribute for

I'm using Bootstrap Vue.js to implement navigation and I'm wondering what is the best practice to set an anchor title for . I would like to do this in order to cover one of the WCAG techniques…
monny
  • 95
  • 1
  • 7
0
votes
1 answer

WCAG 2.0: Delay scrolling causes issues with SR Utility Menu reading headings

I know the fix but I'm trying to figure out where this issue falls in WCAG 2.0. When the webpage loads there is a scroll effect which hides the main content of the page until the user navigates into it. The issue this causes is that when SR users…
0
votes
0 answers

In splide js when we give slider arrows according to break point, and when we do page zoom and by doing (ctrl+0) , arrows were removed from DOM

In splide js when we give slider arrows according to break point, and when we do page zoom upto 300% and by doing (ctrl+0) reset zoom, arrows were removed from DOM. steps: give slider options as arrows true in different breakpoints. zoom the page…
0
votes
0 answers

Accessibility for draggable image

I have an interactive widget where a box image is draggable. Since the images are not interactive elements, I am not sure if the image can be focused. I have gone through the functional image accessibility rules, but they all describe the logo,…
Preeti
  • 43
  • 1
  • 5
0
votes
0 answers

Keeping Focus on Bootstrap Modal While Tabbing

Does anyone know what it is that keeps the focus on the Bootstrap modal while tabbing? What I'm referring to happens when the modal is open and the user presses the Tab key and the user is able to continually stay focused in the modal. Meaning that…
iChido
  • 3,972
  • 6
  • 26
  • 29
0
votes
0 answers

Does YouTube meet WCAG 2.1 standards regarding close captions?

We upload our board meetings to YouTube for library members to watch at their convenience. We need to know if the close captions provided meet WCAG 2.1 standards. I have been researching WCAG 2.1 standards and am measuring our website against them.…
0
votes
0 answers

Mouse hover chrome devtools element inspector - can you make the popup persistent?

I'm trying to use the Chrome Devetools element inspector for the purposes of accessibility audits. if i open the devtools menu and click the button that activates the mouse pointer inspector (same can be done with ctrl + shift + c). the chrome…
0
votes
0 answers

How to lock one elements dimensions at 200% zoom?

I have a side element I want visible throughout the page. I am trying to make it WCAG compliant, so it has to increase in size up to 200% zoom, and not overlap other elements (I made a previous post about it and was instructed media screen was…
AccCode
  • 9
  • 1
0
votes
1 answer

how the screen reader announcement for page log out

when I click on logout button, I can see the page gets loaded and there is text displays on the screen. you have logged out, click here to login again. Actual result at this time,Screen reader announces logout button then it was remains silent. and…
Victor
  • 17
  • 5
0
votes
1 answer

Is it OK to group buttons within a P-tag regarding WCAG?

How do you know if something is WCAG appropriate? Like this is an example on Mozilla developer page, and I can not think that it is OK to group Buttons within a P-tag?

RMT
  • 942
  • 2
  • 12
  • 32
0
votes
1 answer

Screen reader accessibility for HTML time element

this is quite a simple question but one that's quite hard to find any resources on. Basically I have a time element {(value: string) => ( )} As you can see, I…
Charlie
  • 276
  • 3
  • 13
0
votes
0 answers

Screen reader does not read the success message

screen reader does not read the success message even though fields are entered correct. In my case, we have a search button, when I select search button, a table is get returned with no .of rows however screen reader announces nothing. how to fix…
Victor
  • 17
  • 5