|
|
The Basics
<html>
<head>
<title>The name of your webpage goes here</title>
</head>
<body>
Information about your webpage goes here.
Like images, tables and anything you can think to add.
</body>
</html>
<html> - this is the start of the page
<head> - this is where you place your meta
tags
<title> - this is where the title of you page
goes follow by the close heading tag - like this</title>
</head> - this is where you close the heading
<body> - this is where all the information
displayed on your page goes, like images, sound, the colour of the
webpage, links and more
</body> - this is where you close the body
</html> - this is where you finish the page
Meta Tags
| <meta
http-equiv="refresh" content="4;url=http://www.fearby.com/"> |
Once in a while you need a
link that will direct you to another page, like if you have changed
sites. Rather than having to click a link, you can use this handy
little piece of code to do it for you. It says that in 4 seconds,
redirect the browse to the desired link. |
| |
|
| <meta
name="keywords"
content="webpage, webpage tutorials,
tutorials, fearby"> |
When using a search engine,
keywords on what you are looking for are used, well this is how
webpages are found. You add things that you think people might be
looking for that are found on your webpage. |
| |
|
| <meta
name="description"
content="For people who wish to learn how
to make webpages"> |
This is to let people know
what your webpage is about and is shown on search engines. |
| |
|
| <meta
name="author"
content="Jane Fearby"> |
This tag is where you put
your name to let others know who made the webpage. |
| |
|
| <meta name="copyright"
content="This document has been copyright to fearby.com 2004"> |
This is used to let others
know who holds the copyright to the webpage. |
| |
|
| <meta http-equiv="reply-to"
content="jane@fearby.com"> |
This is where you put your
email address. |
| |
|
<meta
name="robots" content="noindex,
nofollow">
or
<meta name="robots" content="index,
follow"> |
This tag stops search
engines from indexing a page with this code. People with membership
only pages can use this, or if you would like to make sure that your
page is indexed than use the bottom code. |
| |
|
| <meta
http-equiv="refresh" content="5">
|
This is use to tell the page that it has been added & what refresh rate to
use. |
| |
|
| <meta http-equiv="expires" content="Wed, 26 May 1998 8:00:00 EST"> |
This tag makes your webpage look old and will make it refresh
continuously. It can also be used with the no-cache tag. |
| |
|
| <meta
name="rating" content="general"> |
This tag is used to let people know what rating your page has, like
general, mature and restricted. |
| |
|
| <meta http-equiv="imagetoolbar"
content="no"> |
"Image Toolbar" is a IE6+ specific feature designed to facilitate the
handling of images on your site. As a user moves his mouse over an image
on your page in IE6, a rectangular toolbar pops up, allowing for the
instant saving, printing, and emailing of it. As the publisher, you may
wish to disable this feature, so your site's images are not so readily
exposed to manipulation. |
| |
|
| <meta
http-equiv="content-language" content="en-au"> |
This tag is used to let the browser and or people know what language the
page has been created for - in this case en = English, au = Australia |
| |
|
| <meta http-equiv="Pragma"
content="no-cache"> |
When visiting a web site, your browser will cache or make a copy of the
web site for faster viewing your next visit. This will prevent visitors
from seeing new content unless they manually reload their browser. |
The Body
background - this where you tell the page what image you would like for
your background webpage wallpaper
bgcolor - this is where you tell the page what colour to display for your
background colour
text - this is where you tell the page what colour to display for your
text colour
link - this is where you tell the page what colour to display for your
link colour
vlink - this is where you tell the page what colour to display for your
vlink (visited link) colour
alink - this is where you tell the page what colour to display for your
alink (active link) colour
| <body bgcolor="#000000"> |
This is telling the webpage that the background colour of your webpage
will be black |
| |
|
| <body bgcolour="#000000 text="#"FFFFFF"> |
Background colour of black with white text |
| |
|
| <body bgcolour="#000000" text="#FFFFFF"
link="#0000FF"> |
Background black, text white and links blue
|
| |
|
| <body bgcolour="#000000" text="#FFFFFF" link="#0000FF" vlink"#FF0000"> |
Background black, text white, link blue, vlink red
|
| |
|
| <body bgcolour="#000000" text="#FFFFFF" link="#0000FF" vlink"#FF0000" alink="#00FF00"> |
Background black, text white, link blue, vlink red, alink green
|
| |
|
| <body background="image name goes here" bgcolor="#000000" text="#FFFFFF"
link="#0000FF" vlink"#FF0000" alink="#00FF00"> |
This one is telling your webpage to display an images as your background.
The background colour is still black but will only be seen as the
wallpaper is loading. The best type of image to use is one with either
being jpg or gif |
| |
|
| <body background="image name goes here" bgcolor="#000000" text="#FFFFFF"
link="#0000FF" vlink"#FF0000" alink="#00FF00" bgproperties="fixed"> |
Use this one if you would like the wallpaper not move when scrolling,
fixed means stop the images from moving when scrolling |
| |
|
Final Look of the basic HTML layout
<html>
<head>
<meta name="keywords" content="webpage, webpage tutorials, tutorials,
fearby">
<meta name="description" content="For people who wish to learn how to make
webpages">
<meta name="author" content="Jane Fearby">
<meta name="copyright" content="This document has been copyright to fearby.com 2004">
<meta http-equiv="reply-to" content="jane@fearby.com">
<meta name="rating" content="general">
<meta http-equiv="content-language" content="en-au">
<title>Fearby.com - Webpage Tutorials</title>
</head>
<body background="image.jpg or
gif" bgcolor="#000000" text="#FFFFFF"
link="#0000FF" vlink"#FF0000" alink="#00FF00" bgproperties="fixed">
Information about your webpage goes here. Like images, tables and anything
you can think to add.
</body>
</html>
The main page is either saved as index.htm or index.html
top of page
Last Updated
Monday, 27 September 2004
|
