Beyond automatic accessibility testing: 6 things I check on every website I build - Manuel Matuzović

Six steps that everyone can do to catch accessibility gotchas:

  1. Check image descriptions
  2. Disable all styles
  3. Validate HTML
  4. Check the document outline
  5. Grayscale mode
  6. Use the keyboard
Beyond automatic accessibility testing: 6 things I check on every website I build - Manuel Matuzović

Tagged with

Related links

Home - Sa11y

Another handy accessibility testing tool that can be used as a bookmarklet.

Tagged with

jgarber623/aria-collapsible: A dependency-free Web Component that generates progressively-enhanced collapsible regions using ARIA States and Properties.

This is a really lovely little HTML web component from Jason. It does just one thing—wires up a trigger button to toggle-able content, taking care of all the ARIA for you behind the scenes.

Tagged with

I worry our Copilot is leaving some passengers behind - Josh Collinsworth blog

Products of all kinds are required to ensure misuse is discouraged, at a minimum, if not difficult or impossible. I don’t see why LLMs should be any different.

Tagged with

Utopia WCAG warnings | Trys Mudford

Wouldn’t it be great if all web tools gave warnings like this?

As you generate and tweak your type scale, Utopia will now warn you if any steps fail WCAG SC 1.4.4, and tell you between which viewports the problem lies.

Tagged with

We’re still not innovating with AI-generated UI.

Prototypes and production:

It looks like it will be a great tool for prototyping. A tool to help developers that don’t have experience with CSS and layout to have a starting point. As someone who spent some time building smoke and mirrors prototypes for UX research, I welcome tools like this.

What concerns me is the assertion that this is production-grade code when it simply is not.

Tagged with

Related posts

Bookmarklets for testing your website

Some handy services are just a click away.

Assumption

Separate your concerns.

ARIA in CSS

Apply your ARIA attributes with JavaScript and then use them as hooks in your CSS.

Drag’n’drop revisited

An easy accessibility fix, courtesy of my past self.

PageSpeed Insights bookmarklet

With this bookmarklet you’re only ever one click away from the Lighthouse results for a page.