0% found this document useful (0 votes)
42 views

Basic HTML

The document provides instructions on creating a basic web page using HTML. It discusses adding common elements like headings, paragraphs, hyperlinks, images and setting the page title. Screenshots show how to structure the HTML code and add tags to format the content. The last few slides discuss judging website effectiveness by considering the needs of users and how information is presented, as well as tips for creating an HTML file and hosting the basic web page.

Uploaded by

toheeb chauderi
Copyright
© © All Rights Reserved
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
42 views

Basic HTML

The document provides instructions on creating a basic web page using HTML. It discusses adding common elements like headings, paragraphs, hyperlinks, images and setting the page title. Screenshots show how to structure the HTML code and add tags to format the content. The last few slides discuss judging website effectiveness by considering the needs of users and how information is presented, as well as tips for creating an HTML file and hosting the basic web page.

Uploaded by

toheeb chauderi
Copyright
© © All Rights Reserved
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
You are on page 1/ 12

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

You might also like