You're Learning HTML Just By Reading This

Okay, maybe not just by reading the title. But once you're done reading this little slip of a site, you'll be up there with all us geeks making $50k a year designing web pages a lot like this one.

HTML stands for HyperText Markup Language. Hypertext is any document, like this one, where the text isn't just on one page - it can be connected to lots of pages all over. It's like a book where the author has gone through and circled certain words and written things in the margins and added explanations and illustrations to help you understand; a book where touching a word you want to know more about, like "Java" or "leukemia," will teleport Java in a Nutshell or a brochure from the Leukemia Society of America right into your lap.

A web page can be written by anybody, and gets linked into the World Wide Web with HTML links to other pages and placement on search engines. Your page starts out looking like this one, black text on a grey background with blue and purple links, till you change it by hand.

You have to tell the web browser how your page should look, using HTML tags. These are the basic four tags you use:

< html > < head > < title > < body >

For this page, the tags are used like so:

< html > < head >< title > You're Learning HTML < /head >< /title > < body >

The < html > tag tells the browser to read this as a web page, not a text file. Otherwise, you'd see all that

< html > < head >< title > You're Learning HTML < /head >< /title >

stuff instead of the "You're Learning HTML" that you see at the top of your web browser window.

A quick digression: When you're typing HTML tags, you won't put the extra spaces in < title > or < head >; it'll all be one pointy-edged word. But if I don't put extra space around the >s here, the browser will read them as code and you'll never see them. Someone realized this once, and created a solution: the < plaintext > tag. Plaintext tells the browser to read everything after it as text, instead of HTML code. It gets turned off with < /plaintext >. Unfortunately, since the browser is reading the word < /plaintext > as plain text, it doesn't realize that it's code and doesn't turn it off! Someday, someone will figure out how to fix this, but until then you'll just have to deal with the annoying spaces.

The backslash in < /head > and < /title > tell the browser that the title is over now and the body of the page is going to start. A backslash turns a tag off; most HTML commands need to be turned on and off.
Two tags that don't need to be turned on and off are < br > and < p >. < BR > means that a line BReak goes here, like

'Twas brillig, and the slithy toves
Did gyre and gimble in the wabe

instead of

'Twas brillig, and the slithy toves Did gyre and gimble in the wabe

If you want a space between paragraphs instead of just a new line of text, you use < P >, for Paragraph break. It doesn't matter if you capitalize HTML tags or not; you could type < P > or < p > or < bR > or < BR > or < br > or < Br >. It's a good idea to capitalize them so you can pick them out from the rest of your page easily. A < P > in the right place will do this:

And the momeraths outgrabe.

"Beware the jabberwock, my son!"

The last thing you need to know for a basic page is what to do for the < body > tag. You need it there to tell the browser where to put all this text, but you can do a lot more with it. The < body > tag can be huge, and include the color of your background, your text, your links, your visited links, and even the color your links turn for the instant that they're being clicked on.Let's see how to do that!

Links Images Tables Frames Streamlining Forms Learning More
My home page
Email me