Use padding, relative line-height and a flow layout instead.

"When we design for disabilities we make things better for everyone"

The last version of the WCAG released the 5th of October

The studied website https://www.cop28.com/

As UI evolves, I think we will come one day with a UI library that can be customized entirely (hello white label design system).

Being able to test features on it should also be possible. It don't understand how all accessibility criteria can be tested though.

Le guide d'Orange contenant un certain nombre de ressources

One of my favorite things to do when stumbling upon a web page that uses an accessibility overlay is to use the overlay to increase the font size. I'm giving a 99.9% guarantee that this will cause the formatting on the page to break at some point. Couple that with increasing the line height and the letter spacing and you get a 100% return on your investment. Probably need to install a second overlay to fix this problem.

What happens on web pages when these three values are changed?

There are no shortcuts on accessibility at the moment

Why is there the first rule of ARIA? Because ->

I didn't push the thought to this point! The distinction between the focus indication area and the contrasting area is also pertinent.

How to make an accessible skeleton with ARIA ?

Note that the skeleton pattern hides a bad design where the UI is slower than expected. So avoid it as much as possible.

1. Check if the image really needs a description. Maybe it is decorative. The W3C alt decision tree(opens in a new tab) is an excellent resource to help you categorize your photos.
2. Avoid writing "Image of", "Icon of", or "Picture of". Screen readers announce the presence of an image. Adding these words inside your alt is unnecessary.
3. Keep it as short as possible. Be specific but not overly descriptive.
4. Try to put the most essential information at the beginning of your description.

allyphanta11yphant teaches web accessibility, one step at a time, broken down into manageable pieces. We call these challenges. You won't need to read large amounts of text to complete those. Instead, you will learn by applying the concepts in code. Get started with your first web accessibility challenge and improve your skills.

A first approach of ARIA with a toggle button

Courses that somehow seems relevant to every web developer. There is a 10-day trial.

So the question is, when you have done everything "right" in your attempt to do the right thing and it still doesn't work, at what point do you give up and when do you push on and try to make it right?

What to do?

1. Do nothing (and it degrades user experience for years until a fix is made)
2. Suggest an alternative (and it takes years to fix to go through the roadmap)
3. Work around it
4. Engineer a solution

Use accessibility APIs of OSes that contains building blocks. These building blocks have 3 kinds of information about a UI element.

The first is a role: What kind of element is this?
The second is a name: a label or an identifier for this element.
The third is state and other properties: Other functional aspects of an element that would be relevant for a user or an assistive technology to be aware of. Is a checkbox checked or unchecked, etc...

It looks like ARIA, oh wait!

The web browsers now expose this accessibility tree.