Creating your first web page
A browser is the software that interprets and displays HTML. At first there was no governing body to ensure standards…so the W3C, World Wide Web Consortium, now maintains official HTML specifications.
The basic HTML template looks like this:
<html>
<head>
<!–My Comments–>
<title>Title at top left of browser window</title>
</head>
<body>
<p>Content here is displayed in browser</p>
</body>
</html>
Ok, now it’s time to start cutting & pasting your little heart out. Highlight the text above, right click and choose copy. Right click in your text editor and select paste. Put this into textpad or whatever HTML editor you have chosen. Save it as ‘Hello.html’ (If you are using textpad choose all files in the second box). Never put spaces in your file names. Remember where you save the file. Go to the file, double click it–and see how it looks in your browser.
Here is what you should see:
So, judging from this HTML template, the <title> tag will display in the upper left hand corner of the browser. The <!–My Comments–> is used to write your own notes in HTML that will not be displayed in the browser. However, those comments will still be visible if someone right clicks and views the source. Whatever is between the <body> tag is the actual content of the page. Make sense? As we can see from the sickly HTML stick figure on the right, we must always close any tags we open. If not, things can get messy and not work out the way we want them too. Which would really make us all very very sad. That would make the ill stick figure look even worse, if you can imagine that.
The <p> tag is called a paragraph tag. It creates, uh….paragraphs. It has an attribute called align. The values are Left, Center, and Right. That would make the <p> tag look like this:
<p align=”right”>This is aligned to the right</p>
You must make sure you open and close that too.
OH Yeah… remember, when designing your HTML page make sure that you indent and tab. Just think of it this way, if you get a job redesigning an HTML page, wouldn’t it be easier to read if everything is spaced apart nicely? While HTML will work all on one line, it is a nightmare to debug. Do some spacing and make everyone happy, especially YOU.
Filed under: HTML
Leave a Reply