GoalExplain what HTML is and read very simple tags.
New words
HTML · the markup language that tells a browser what to showtag · a short code in angle brackets, such as the one for a headingbrowser · a program that shows web pagesmarkup · marks added to text that say how it should look
Explanation
A web page is a file, and a browser reads it to decide what to show. The language of that file is HTML, which means hypertext markup language. In HTML you mark the text with tags. A tag is a short code between angle brackets. Most tags come in pairs: an opening tag and a closing tag, with a slash. Between them is the text the visitor sees. One tag makes a big heading, another a paragraph, another a picture. You do not have to write HTML to make a first web page: a word processor can save your document as a web page and write the tags for you. But reading the tags helps you understand how pages are built.
Html
1<h1>Save water</h1>
2<h2>Why?</h2>
3<p>A tap can waste 20 glasses a day.</p>
4<imgsrc="tap.png">
Output
Save water
Why?
A tap can waste 20 glasses a day.
[a picture of a tap]
Worked examples
Tag
Makes
h1
the biggest heading
h2
a smaller heading
p
a paragraph
img
a picture
Look at the code: the tag h1 makes the biggest heading, ‘Save water’. The tag h2 makes a smaller heading. The tag p makes a paragraph of text. The tag img puts in a picture from a file called tap.png.
Seif sees <p>Hello</p>. The first tag opens a paragraph, the word Hello is what shows on the page, and the last tag, with a slash, closes the paragraph. A visitor sees only ‘Hello’, not the tags.
Mariam has no way to write code. She types her page in a word processor and saves it as a web page. The program writes the tags. She can open the file in a browser and see her page.
Class activity
Read and write simple HTML on paper. 1. Draw the page that this code makes: <h1>My cat</h1> <p>She sleeps all day.</p> <img src=cat.png>. 2. Write the HTML for a page with the heading ‘My school’ and a paragraph that says ‘We learn every day.’ Use an opening and a closing tag for each. 3. Tell a partner why a browser needs tags. You do not need a computer for this.
Practice
1
What does HTML tell a browser?
What to show on a web page.
2
How do you know a tag is a closing tag?
It has a slash after the first angle bracket.
3
Which tag makes the biggest heading in the lesson’s code?
h1.
4
How can you make a web page without writing any tags?
Type it in a word processor and save it as a web page.
