Software Development free courses

Master the TrickFoundationFree

Web Accessibility Practice

Review semantic controls, form feedback and keyboard focus using a fictional course-search page.

3 reading lessons · about 30 min ·written by MTT

The idea

Native elements supply established roles and keyboard behavior. Buttons perform actions; links navigate. Give controls accessible names that describe their purpose. Meaningful images need appropriate text alternatives, while purely decorative images can use empty alternative text. Extra ARIA should not contradict native semantics.

Worked example

A magnifying-glass submit button has the accessible name Search courses, not magnifying glass. A course-thumbnail image beside an already named link may be decorative depending on what it contributes. A meaningful diagram needs a useful description of its information.

Try it

List five controls on a fictional search page and assign native elements and names. Identify one decorative and one informative image. Write their alternative-text approach and explain why every image should not receive the same generic description.

Lesson 1 of 3 · About 10 min

Use meaning and names

Check your understanding

Course quiz

Finish the course to unlock the quiz

Complete all 3 lessons and 5 questions open up here. You have 3 to go.

What you will learn

  • Choose semantic elements and accessible names
  • Associate input labels and errors
  • Check keyboard and text-zoom behavior

Before you start

Prerequisites
Basic HTML familiarity. A browser is useful for practice; automated tools are optional.
Cost
Free introductory reading lessons, exercises and quiz. Optional third-party tools, hosting or AI subscriptions may cost money.

Original introductory lessons and assessment by Master the Trick. Estimated times include the suggested exercises.