HTML - example of a simple web page

Archive - Originally posted on "The Horse's Mouth" - 2007-04-24 07:06:08 - Graham Ellis
After a series of advanced courses over the last few weeks, it's really great to be back to basics for a week ... with HTML and simple PHP scripts being the target - training for an organisation who are using PHP to web enable some admin tasks on their intranet.

Back to basics with HTML ...

1. Directives to the browser on how to format are written as tags - <xxx> through to </xxx> as the close tag.

1a. Alternative - open and close in one - <xxx />

1b. Attributes can be set in open tags - <xxx yyy="zzz">

Attributes ought be in quotes (but sometimes we forget), and tag and attribute names really should all be lower case these days.

1c. Tags must be "well" nested - i.e. if you open "a" then "b", you must close "b" before "a".

2. All text outside tags displays 'as is' except for new line characters and multiple white spaces, which become single white spaces. Use <br /> for a line break.

2a. If you want an & or < character, use & or < - there are plenty of others such as © for a copyright symbol.

3. Overall page structure - surrounding <html> to </html> tags, with <head> and <body> sections within.

4. Code to be run on the SERVER to be enclosed in <?php to ?> tag (breaks nromal rule) and this code to generate valid HTML.

Example:

<html>

<head>

<title>Staying at hotels in Leek</title>

</head>

<body>

<h1>The Peak Weaver's</h1>

This is some HTML. I find it <u>hard to know</u> what

to say when I'm doing a demo!<br /><br />

<Copyright>, &amp; me, <?php print(date("Y")); ?>.<hr />

What a wonderful way of writing text documents!<br />

Please see <a href=smith.html>the chap on my left</a> if

you want the StevEbay stuff. If you want to search,

try <a href=http://www.google.com/>Google</a><hr />

<form action=esq.php>

Your height <input type=text name=high><br />

Your weight <input name=heavy><br />

<input type=submit>

</form>

</body>

</html>

That's just the basics ... there's so much more about links, forms, Javascript, Style sheets ... but the above is a "Hello World" page of first examples. See it run here

Main Content

HTML - example of a simple web page