[UI design] Visually clear headings and distinct sections

[shawna-slh]

Shared with permission:

---

I am an autistic person who has several websites and is trying to make these websites accessible for people with disabilities.

The format of WCAG and the WCAG Quick reference is actively painful for me. I spent about 2 minutes on the quick reference, realized I was approaching meltdown and switched to the full WCAG, which was even worse.

Two things that made the Quick Reference less-bad was being able to hide the navigation sidebar (though the button to hide it was not immediately obvoius and I didn't realize it was there until it was two late) and the large headers in distinct colors that made it easy to visual divide the page into sections and focus on only one section at a time. On the full WCAG, my eyes skitter over the page, unable to find an immediate focus for my attention, and the sheer amount of information I'm skimming over and trying to process all at once is a major part of the problem.

For contrast, I had no problems with the WCAG At a Glance page.

Please share this with whoever it can be helpful to. I would very much like to be able to use your guidelines in updating my website, but right now it would take me weeks or months just to read the guidelines because of the frequent breaks I'd need to keep from being in a constant state of autistic overload.

Thank you,
Jess Mahler.

---

pages referenced:

• WCAG TR doc https://www.w3.org/TR/WCAG21/
• WCAG Quick Reference with sidebar hidden https://www.w3.org/WAI/WCAG21/quickref/?hidesidebar=true
• WCAG at a Glance https://www.w3.org/WAI/standards-guidelines/wcag/glance/

---

Follow-up e-mail https://lists.w3.org/Archives/Public/w3c-wai-eo/2018OctDec/0009.html

[tripu]

Thank you, @slhenry.

(I think this feedback belongs on https://github.com/w3c/tr-design, not w3c/tr-pages.)