Attributes: Configuring an Element

What this is. An attribute provides extra information about an element. Attributes are written inside the opening tag, usually as a name and a value in quotes.

<a href="/about">About</a>

Some attributes are boolean: their presence alone is the value. <button disabled> is disabled. There is no disabled="false".

Why you cannot substitute one attribute for another. Attributes have specific meanings that browsers and assistive technology rely on. alt is not a caption, it is the text alternative. href is not a label, it is a destination. Using the wrong attribute because the visible result happens to look acceptable will break the page for someone using it differently from you.

LIVE PREVIEW

loading editor…

Your turn → Remove the alt attribute from the image, then break the src by changing the URL. With no alt and a failed load, there is nothing left for anyone to understand. That is what alt is for.

◈ Graded Build

Build a small fragment for your portfolio's contact area. It needs a link whose href points to mailto:you@example.com and whose text reads Email me, plus an image with a src, meaningful alt text, and explicit width and height of 200.

Checked against the page you actually render, not against how you wrote it. 4 visible and 2 hidden checks.

loading editor…

Mark this lesson complete

Signed in, your progress follows you to every device.

Next: Practice Test →

← Back