Building a Web Page

HTML attributes and links

Read the attributes inside an opening tag, and work out where a link goes and which words a reader clicks to follow it.

So far a tag has been a name and nothing else. But an opening tag can carry extra information as well, and that extra information is called an attribute. An attribute is written inside the opening tag, after the tag's name, as a name, an equals sign and a value in quotes. A tag can carry several, separated by spaces, and a closing tag never carries any.

What is shown and what is meant are two different pieces

A link has an inside and an outside. The destination is an attribute inside the opening tag, so nobody reading the page ever sees it. What they do see is the text between the opening and closing tags, and that text can say anything at all — the browser does not read it or check it. Two links whose text is identical can go to entirely different places, and nothing on the page shows the difference until you follow one.

Worked example

Read this link: <a href="timetable.html">Our timetable</a>

  1. Find the opening tag first. It runs from the < to the matching >, so it is <a href="timetable.html">.

    Everything the browser is instructed to do lives inside that pair of angle brackets.

Try it together

Now read this one together: <img src="school.jpg" alt="The school gate" width="300">

Work through the pieces of the tag one at a time.

    1.How many attributes does this tag carry?

    Have a go

    Have a go on your own. In the link “<a href="canteen.html">Today's menu</a>”, which page does it open?

    Ready to practice?

    Eight questions on what you have just read. Nothing is timed, and you can play as many times as you like.

    Print a worksheet