-
Notifications
You must be signed in to change notification settings - Fork 355
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add Practice Page for Supporting High Contrast #2991
base: main
Are you sure you want to change the base?
Conversation
@mcking65 |
Can someone run the prettier code on the CSS to get rid of the CSS linting errors |
Done in 5720724 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This reference will be very helpful to many people! 🤩
<button type="button" role="switch" aria-checked="false" class="increase-contrast"> | ||
<span class="label">Increase Contrast</span> | ||
<svg xmlns="http://www.w3.org/2000/svg" height="20" width="36"> | ||
<rect class="container" x="1" y="1" width="34" height="18" rx="9" /> | ||
<circle class="off" cx="11" cy="10" r="8" /> | ||
<circle class="on" cx="25" cy="10" r="8" /> | ||
</svg> | ||
<span class="on" aria-hidden="true">On</span> | ||
<span class="off" aria-hidden="true">Off</span> | ||
</button> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I’m not seeing any change to the page when I toggle either the Increase Contrast or Dark Color Scheme switches. Are those meant to immediately show a simulated effect?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yes, there are suppose to change.
It may be there should be a separate switch to tun on the emulation next to the example.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@adampage
Maybe I should take out the emulation, and people rely on seeing the cahnges when the change their contrast settings, I will do that.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@adampage
I have updated the examples to only use the CSS media queries to change the rendering. My original way is confusing. Please review and let me know if it makes more sense now.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks @jongund, this is clearer. However, because the examples themselves are toggle switches, I wonder if it might still invite a bit of confusion for some readers since the concepts of dark mode and high contrast are so often expressed as interactive toggles. 😅
If the examples were just some static rich text, like a heading, a paragraph, and some sort of colored embellishment (like a blockquote or bulleted list), then I think they would be crystal clear — especially for the users who accept our invitation to enable their own device settings to observe the reaction.
The ARIA Authoring Practices (APG) Task Force just discussed The full IRC log of that discussion<jugglinmike> Topic: PR 2991 - Practice Page for Supporting High Contrast<jugglinmike> github: https://github.com//pull/2991 <jugglinmike> Matt_King: Thank you for all the commits last Tuesday, jongund! <jugglinmike> Matt_King: All the checks are passing <jugglinmike> Matt_King: We requested review from three people. None of those reviews are in, yet <jugglinmike> Adam_Page: I reviewed and requested changes just a few minutes ago <jugglinmike> Jem: I plan to review after this meeting <jugglinmike> Matt_King: I think this depends on the nature of the feedback. I personally haven't spent the time on this that I planned on spending <jugglinmike> Matt_King: I'd like to commit to a specific time for making a merge decision on this pull request (to determine whether it will be included in tomorrow's release) <jugglinmike> Jem: (I wish that our Task Force had a way to announce a new release. This patch is a good candidate to highlight publicly.) <jugglinmike> Matt_King: I'd love to talk about that. We can add a topic to today's agenda <jugglinmike> s/I wish/By the way, I wish/ <jugglinmike> Matt_King: If we make the decision at 1PM PT, then will that give you enough time to release, howard-e? <jugglinmike> howard-e: Yes, I'm in eastern standard time. It will be 4PM for me, and that works <dmontalvo> present- dmontalvo <jugglinmike> Jem: I reviewed this a long time ago. Is there any specific aspect that I need to focus on as a reviewer? <jugglinmike> Matt_King: This is the final review. Clarity, style, relevance of information. We want to make sure that the guidance we're giving is useful and actionable by our readers. It's got to be consistent with what we want in the APG but also something that authors can actually use in practice <jugglinmike> Matt_King: More and more, I want to make sure we aren't stepping outside of our bounds. We shouldn't be trying to take the place of other important W3C resources. We should simply refer to those and remain focused on the APG's mission <jugglinmike> Matt_King: If we can get this merged by 1:00 tomorrow, we would like to include it in the next release. There are a lot of unknowns, though, and that includes me (i.e. whether I can fit it in among my other deadlines) <jugglinmike> howard-e: For what it's worth, I can wait as late as 2:30 PM PST <jugglinmike> Matt_King: Thank you, howard-e! Given my meeting schedule, that extra time might be really helpful <jugglinmike> Adam_Page: I have some additional thoughts about dark mode <jugglinmike> Matt_King: I think we're looking for minimum-viable product here. We can always enhance later <jugglinmike> Adam_Page: Yeah, that makes sense |
Co-authored-by: Adam Page <adam@adampage.net>
Co-authored-by: Adam Page <adam@adampage.net>
Co-authored-by: Adam Page <adam@adampage.net>
Co-authored-by: Adam Page <adam@adampage.net>
Co-authored-by: Adam Page <adam@adampage.net>
Co-authored-by: Adam Page <adam@adampage.net>
…ters or image substitution
Part of the resolution of issue #2864.
Preview Link
Preview high contrast practice page in compare branch
WAI Preview Link (Last built on Thu, 12 Dec 2024 07:31:23 GMT).