Writing Clean, Accessible Front-End Code.

Writing Clean, Accessible Front-End Code.

Most accessibility defects I am asked to fix are the same defect: a div doing a button’s job. Swap it for a real button and focus order, keyboard activation, the accessible name and the state announcement all arrive at once, with no attributes to remember.

Colour is the second one. Design in a palette that clears contrast at the smallest text size you actually ship, not at the size in the mockup. If a tone only passes at twenty-four pixels it is a heading colour, and calling it a body colour will cost you a rewrite later.

Finally, test with the keyboard before the screen reader. Ten minutes of tabbing through a page finds nine in ten problems, and it is the one check a client can repeat themselves after handover.

1 min read

Recommended for you

Leave a Comment