| Starting an HTML Document |
HTML documents are created by combining
special markup codes called Tags. Tags define the structure
of the document and provide the framework for holding the
actual content, which can be text, images, or other special
content. Structural element's primary purpose is to create
the form of the document. These elements include the document
itself, the head and body sections, page titles, and other
basic document identifiers.
| The <!DOCTYPE> Declaration |
In a perfect world, the <!DOCtype>
tag would be the first tag in every HTML document. This tag
tells the Web server what version of HTML it's dealing with,
when it delivers the document, in turn, the server informs
the browser what kind of tags it can expect inside. It's not
really a part of the HTML DTD, but rather is a requirement
based on the fact that HTML is an SGML application.
An example of <!DOCTYPE> declaration is :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML
3.2//EN"
"http: //www.w3.org/TR/REC
- html40/strict.dtd">
(This is for a HTML 4 document)
The three document types directly corresponding to W3C recommendations are:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML
4.0//EN"
"http: //www.w3.org/TR/REC
- html40/strict.dtd">
Which is for strict adherence to HTML
4 standards, excluding any deprecated items and frames.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML
4.0 Transitional//EN"
"http: //www.w3.org/TR/REC
- html40/loose.dtd">
Which is for use as a stop-gap to support
legacy browsers that still use deprecated features from HTML
3.2 and frames.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML
4.0 Frameset//EN"
"http: //www.w3.org/TR/REC
- html40/frameset.dtd">
Which is for strict adherence to HTML
4 standards plus the inclusion of frameset tags.
Parts of this tags are
| <!DOCTYPE> |
This is the main Tag |
| HTML |
Indicates that
this document is an HTML document and not a word
processor document or any other type |
| PUBLIC |
An identifier
always used with the URL to enable the user's browser
to download the DTD and its entity sets. |
| HTML 4.0 Transitional |
Version of HTML is use. |
| EN |
Indicates that
the document is in English |
| URL (http-address) |
This URL finishes
the tag and indicates where above mentioned specification
for this version of HTML is located |
|
| Setting the boundaries With <HTML> Tag |
<HTML> is
the start of an HTML page and it is paired with the </HTML>
close tag. Elements allowed within the <HTML>
tag are the <HEAD> or <TITLE>
tags, followed by a <FRAMESET>
or <BODY>. Even though the
<HTML> tag is an optional
one, it defines the boundaries of the HTML document and thus
makes the downloading correct, proper and faster.
Syntax:
<HTML>
elements and tags
.. </HTML>
The <HTML>
tag is an optional element for building Web pages. This is
especially true if the document is properly constructed with
the appropriate defaults, the language and the direction and
more importantly it conforms to the DTD and uses the DOCTYPE
element. Some Good reasons to use the <HTML> tag are:
|
|
Some browsers get confused
if the <HTML> tag is not given, resulting in a page
displayed unpredictably, or as plain text , or with no display at all ! |
|
|
HTML is not the only markup
language on the web.
It defines the boundary of the HTML document. So, browsers
do not get confused with the size of the document and
displays the page more proper, faster and without mistakes. |
|
|
Giving Your Page a <TITLE> |
|
|
A <BASE> for hyperlinks |
|
|
Showing relationships with <LINK> |
|
|
Using <META> to give more information |
Theoretically every document has a header
and a body. The header of the document is where global settings
are defined: it is contained in the <HEAD>
and </HEAD> tags. Headers
also serve another important role in locating the page when
it is searched by search engines and automated robots. You
can give <META> tags to give
details about the last-modified date, keywords, and other
essential information too.
The most commonly used HEAD feature in HTML,
and the only required element is the <TITLE>
tag. The <TITLE> is a one-line
name for the document that is displayed in the browser's title
bar. Without a title, most browsers default to the HTML filename.
Keep the title brief and meaningful: long enough to be useful
but short enough to fit.
Syntax:
<TITLE>...the title
text...</TITLE>
Example:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML
4.0 Transitional//EN"
"http: //www.w3.org/TR/REC - html40/loose.dtd">
<HTML>
<HEAD>
<TITLE>
Layout Galaxy Home page
</TITLE>
</HEAD>
Welcome to Layout Galaxy Home page.
This is page starts with the first lesson of your HTML Training
Program and the other lessons of the training program which
offers you an exhaustive and easy go.
</HTML>
The <BASE>
tag controls the actions of relative hyperlinks in the body
of the document. By default, relative links in a document
refer to the same server and directory location in which the
page is located. Though, with <BASE>
tag, you can specify that the relative links are resolved
in relation to a different location.
The <BASE> tag takes a single attribute: HREF.
Syntax:
<BASE href="protocol://servername/path/"[target=targetFrame]>
The URL in the href attribute specifies
an absolute URL for use in resolving hyperlinks, and the targetFrame
identifies the frame that will receive the contents of the hyperlink.
| Showing Relationships
with <LINK> |
<LINK> provides
a media- and platform-independent method for defining relationships
between the current HTML page and other documents and resources.
There are five other attributes used with LINK:
| href |
The URL of the linked document. |
| Rel |
This attribute
and its value indicate the relationship of the current
document to the document referenced in href. Possible
values include contents, Index, Glossary, Copyright,
Next, Previous, Bookmark and Help. This example
shows the contents page as "contents.html": |
|
Example:
<LINK rel=Contents href= "contents.html">
This attribute is also used to specify linked
style sheets. Another possible value is Alternate,which indicates
an alternate version of the document. It is commonly paired
with the language attribute.
| Rev |
This attribute
is similar to rel, but it indicates a reverse relationship
between the document and the URL.(e.g.) |
|
Example:
<LINK rev=Contents href=" tutorials.html">
| type |
This attribute
describes the type of link to create . The possible
values are: Alternate, Stylesheet, Start, Next,
Prev, Contents, Index, Glossary, Copyright, Chapter,
Section, Subsection, Appendix, Help, and Bookmark. |
| Media |
This specifies
the kind of medium the information will be dispalyed
on. It can include a single media type, or a list
separated by commas. The possiblities are:
screen: The default output, intended for a computer monitor. |
|
| Using <META>to give more information |
The <META> tag is used to pass additional
information about how the document should be handled and for
search engines to classify and identify the document without
downloading the entire document.
Syntax:
<META [http-equiv] [name] [content] [scheme] >
The http-equiv and name attributes serve
the same basic purpose with one important difference: any
<META> tag using http-equiv
is added to the response header supplied to the browser.
<META NAME="description" CONTENT="Interactive
Learning Site">
<META NAME="keywords" CONTENT="multimedia">
<META HTTP-EQUIV="refresh"
CONTENT="40">
<META HTTP-EQUIV="reply" CONTENT="www.layoutgalaxy.com">
|
|
"Description"
describes the content of your Website as specified in CONTENT |
|
|
"Keywords" specifies
a list of words separated by spaces, which is used by some search engines for quick retrieval. |
|
|
"Refresh" implements
a process called client pull, in which the browser is
directed to reload the document after the number of seconds specified in content. |
|
|
"Reply-to" provides
an email address that the user can reply to. |
Copyrights : Layout Galaxy All Rights Reserved
No part of this tutorial may be reproduced, stored in a retrieval system or transmitted in any form or by any means, electronic, electrostatic, magnetic tape, mechanical or otherwise, without prior permission in writing from Layout Galaxy.
|
|