html · level 1 · unit 5 · lesson 2
- meet it
- guess first
- your turn
- fix it
- nailed it
Tap a green word if you get lost.
meet it
<title> names your page, and lang says its language.
The <title> lives in the head. Its words appear on the , the little label at the top of the window, and in search results. Keep it short and clear.
Add a lang attribute to the <html> tag to say which language the page is in. Use a : en for English, fr for French, cy for Welsh.
Screen readers use lang to pick the right voice, so your words sound right when they are read out loud.
<!doctype html>
<html lang="en">
<head>
<title>Pet club</title>
</head>
<body>
<h1>Welcome to pet club</h1>
</body>
</html> Press show my page to see it here.
The title attribute is a different thing: it adds a pop-up note to one element.
guess first
Where will Pancake club appear?
Guess before you run it. Wrong guesses are how you learn, and nothing is marked.
<!doctype html>
<html lang="en">
<head>
<title>Pancake club</title>
</head>
<body>
<h1>Flip with us</h1>
</body>
</html>
your turn
Your turn. Name a page in French.
This page is in French. Set its language code to fr on line 2, then give it a title on line 4.
Press show my page to see it here.
- the page says it is in Frenchnot checked yet
- the page has a titlenot checked yet
fix it
The whole page is blank. Can you fix it?
Press show my page to see it here.
- the heading shows on the pagenot checked yet
- the tab says book clubnot checked yet
- The page is blank. Where has everything gone?
- Everything after
<title>counts as the title until the browser finds a closing tag. Is there one? - Add
</title>straight after Book club, then press run.
nailed it
your page has a name and a language. :D
<title>names the page on the browser tab.langon<html>says which language the page uses.- Always close
<title>, or the page goes blank.
new words in your collection
- browser tab
- language code
This lesson isn’t saved. A free account remembers every lesson you finish.