advertisement
STEP BY STEP GUIDE
TO HTML - PART 1
HTML BASICS Lets Begin. By now you should be familiar with notepad or your text editor in terms of loading and saving files (if not) Essentially at the end of the day HTML works by using a series of TAGS which tell a browser how to handle and display information. These are usually paired (but not always!!!!) and are indicated by <> signs. The first tells the browser to carry out an action (e.g. make following text italic) the second to stop (with a / before the tag value) e.g. - <i> indicates to start using italics
- </i> to stop
Between certain tags you will include text to be displayed e.g. <i>in italics</i> will be displayed as in italics Within tags themselves you can set extra ATTRIBUTES e.g. <h1 align = center>heading one</h1> heading oneHere the tags tell the browser to display the text as a
heading size 1 (predefined in terms of size and shape on your browser by the <h1> tags)
The align attribute tells the browser to align this in the middle of the page. Note how HTML uses US English (so make sure you use center, color etc.) HTML in terms of tags and attributes is case and font insensitive ( e.g. <I> is the same as <i>) but as you'll see you can set the font as of text contained within a document when displayed. Nor does it directly respond to line returns
(Infact you could write a massive HTML document on one single line) although we break up the lines when editing to make things easier 
BASIC DOCUMENT SET UPAll HTML documents are divided into HEAD and BODY. The head provides the browse with useful information about the set up of the document and the body is where the the bulk of displayed info is. Try this example (we're using bold just to highlight HTML) <html>
<head>
<title>my first html page</title>
</head>
<body>
<h1>My first HTML page</h1>
This is my first<i> html </i> page
</body>
</html> Save the file and view it by opening with Internet explorer or other browser.
You should see something like this below
my first html pageThis is my first HTML page
|
Also if you look on your browser (usually on the top) title bar it should read "my first html page"
Lets Break that down step by step The <html> (and </html>) tags tell the browser it is the start and end of a HTML document. Although most browsers don't need them to recognise a HTML document, you should use them as good practice
The <head> tags tell the browser where the head information begins and ends. Here we've used <title> tags to let the browser know what we want to title the page ("my first html page"). Browsers use this to display in the titlebar or for bookmarking. Later you'll see more can go in the <head> tags
the <body> tags define the start (and finish) of the body of the document (or basically what will be displayed).
The main text doesn't require any additional tags (but it needs to be in the <body> tags) but you can add ones to alter its appearance In our example we put in a type 1 heading (defined by <h1> and </h1>) within our body saying "my first html page". The browser uses these tags to make our text appear different to the following normal text (usually bigger and in BOLD)
The rest of the text followed but we used <i> tags to define the html as italic. From here on in we'll move on to look at things lying between the <body> tags. NOTE never put italic in HTML document like that !!! they're just here to remind you to replace them !!
| 
