Today you will:
think about criteria for judging a website
understand that an effective website will
match the needs and interests of users
use software to create a web page
Slide 1
The task:
create a web page
give it a title
give it a heading
add links
add a picture
Slide 2
HTML: Hypertext Markup Language
Pull down View, then Source, to see the HTML code.
Slide 3
Basic page
<html>
<body>
Search engines
</body>
</html>
Slide 4
Basic page
<html>
<body>
<h1>Search engines</h1>
</body>
</html>
The <h1> tag sets text as a heading in style 1.
Valid tags are <h1>; <h2>; <h3>; <h4>; <h5>; <h6>.
What effect does changing the number have?
Slide 5
Basic page
<html>
<body>
<h1>Search engines</h1>
Yahoo<br/>
Excite<br/>
Google<br/>
<br/> creates a line break
</body>
<p> and </p> can be used to
</html> begin and end a paragraph
Slide 6
Adding hyperlinks
<html>
<body>
<h1>Search engines</h1>
<a href="http://www.yahoo.com">Yahoo</a><br>
<a href="http://www.excite.co.uk">Excite</a><br>
<a href="http://www.google.fr">Google</a><br>
</body>
</html>
The URL of a hyperlink must be
enclosed in quotation marks
Slide 7
Adding the title
The title is not the same
<html> as the page heading
<head>
<title>Information on search engines</title>
</head>
<body>
<h1>Search engines</h1>
<a href="http://www.yahoo.com">Yahoo</a><br>
<a href="http://www.excite.co.uk">Excite</a><br>
<a href="http://www.google.fr">Google</a><br>
</body>
</html>
Slide 8
Levels
Planning, Developing, Evaluating & Modelling
Level 6: Independent work,
efficient sequences of HTML coding
Acted upon teacher feedback and implemented independently
Level 5:Use a range of techniques to produce HTML coding.
Judge how successful your work has been and ways in which it can be
improved.
Accurate sequences of coding, rechecking work
Level 4:Explain how successful your work has been
Improve sequences of coding following feedback from teachers
Slide 9
Adding an image
Note the img tag trailing
<html>
slash
<head>
<title>Information on search engines</title>
</head>
<body>
<h1>Search engines</h1>
<img src="http://www.ealing. uk/images/banner_badge.gif "
height="120" width="120" />
<a href="http://www.yahoo.com">Yahoo</a><br/>
<a href="http://www.excite.co.uk">Excite</a><br/>
<a href="http://www.google.fr">Google</a><br/
</body>
</html>
Slide 10
Creating the HTML file
The text file can be created in a
simple text editor such as Notepad.
The file name must have .htm at the
end to indicate that it is a web page.
The file contains instructions to the
web browser that describe how the
page should look.
Slide 11
Judging a website
Is the information relevant to the users?
Is it clear, up-to-date, accurate and
unbiased?
Do the images enhance, not distract?
Are they meaningful? Is the font size
suitable?
Is the site easy to use and to navigate?
Does it contain useful links?
Slide 12