comments or questions.Even with the multitude of web publishing programs and HTML editors available, I still find that writing a page in HTML is the simplest way to make a web page. It's easy to learn and update. All you need is a plain text editor and web browser. So here is a guide to your very first web page.
HTML (HyperText Mark-up Language) uses the greater and less-than symbols to set apart the "tags" from the displayed text.
For example: <tag>this is what is displayed on the page</tag>
Here is a very basic web page....
<html>
<head>
<title>
This is up on the top bar.
</title>
</head>
<body>
<p>Hey! My name is ______ and I have a web page!!!</p>
</body>
</html>
See what the above code will produce.
This is what it means:
<html>
-this tag tells the computer that this is a web page
<head>
-this starts the header section, defining the page
<title>
-this says that after this tag will be the title
This is up on the top bar.
-what is up there
</title>
-this ends the title
</head>
-this ends the header section
<body>
-starts the "body", the main part of the page
<p>Hey! My name is ______ and I have a web page!!!</p>
-the p tags define each paragraph
</body>
-and the end of the body
</html>
-and finally the end of the page
Now here is some stuff you can put in between the <body> and </body> marks:
Paragraphs - <p>Words...</p>
Use the paragraph tags around everything on your page. This will cause them to be spaced evenly.
Headers - <h1>Things About Me</h1>
The Header tags make the text bigger and bolder. h1 will make the largest header, though you can use h2 h3 etc. to make sub-headers.
A link - <a href="somepage">click here</a>
This tag starts and ends an anchor section. "href" is for HTML reference (the page to which you are linking).
Line Break - <br>
If you try writing text on different lines in your file, it doesn't mean that it will be that way in the page. To force text to the next line, enter a line break.
Background colors - <body bgcolor="#xxxxxx">
Inside the first "body" tag you can set the background. The xxxxxx is an RGB number in hex.
Images - <img src="somepicture.gif" />
Add some graphics to your page with this tag. Throw your photo up, a little image, or even some fancy text.
With just those tags you can make a great first web page. Now here's that basic page made more exciting with the extras:
<html>
<head>
<title>
My New Page
</title>
</head>
<body bgcolor="#9999ff">
<h1>Welcome</h1>
<p>Hey! My name is ______ and I have a web page.</p>
<p><img src="face.gif" /></p>
<p>Click <a href="http://www.yahoo.com">here</a> to go to yahoo!<br>
And here's a <a href="http://spartlow.com/steve/html/internet.wav">sound</a></p>
</body>
</html>
OK, you see the code, now look at it.
Or perhaps this is more of the beginning. Copy the above code into a .txt file, rename that file mypage.htm, and double click on it. Then try experimenting, and just as I learned HTML, simply steal other people's code and play with it. Once you are comfortable with that, move onto tables and eventually CSS.
Please, email comments or questions.
[Editor's Note: This page was moved and updated from Steve's original college site at uiuc.edu.]