Sikau

HTML · Day 14 · about 30 min

Accessibility basics

Pages that work for everyone.

One in six people

Around one in six people lives with a disability. Some use screen readers, some only a keyboard, some zoom in a lot. accessibility means your page works for all of them — and good HTML gets you most of the way for free.

The big wins

  • Use the right element. A <button> is focusable and works with Enter and Space; a clickable <div> isn't and doesn't.
  • Text alternatives. alt for images, labels for inputs, captions for video.
  • Clear structure. One h1, headings in order, landmarks.
  • Meaningful link text. Not "click here".
  • Language. <html lang="en"> (or "ne" for Nepali) so screen readers pronounce words correctly.
  • Don't rely on colour alone. "Required fields are red" fails colour-blind visitors — add text or an icon.

The first rule of ARIA: don't use ARIA if a native element does the job. <button> beats <div role="button"> every time.

The rest of this lesson

  • Keyboard usersexplain
  • Test it yourselfexplain
  • What's the problem?predict
  • Fix the barriermatch
  • Your turnwrite code
  • Badge quizquiz
  • What you learnedrecap

Continue this lesson free — run real code in your browser

Continue with Google

See all 17 lessons of HTML