BWD Chapter 10: Meet HTML

2004-11-16 20:38 - Beginners Web Development

Chapter 10
Meet HTML

Yes, in this chapter we will meet HTML. HTML is another computer language, but it is not a peogramming language. It stands for HyperText Markup Language. So clearly it is a language to desxribe how to mark up hypertext. Hypertext is the name for something you are surely familiar with, links. Specifically it is the idea that one set of text, or page, can be linked to by another. This way, the reader can be directed to more information about the current topic, or any other content.

The first thing to learn is that HTML is as mentioned not a programming language. It is not a program that will run in the computer. Rather, another running program will read it and use the information coded in it to display something to the user. It is in many ways easier than a programming language, but also easier to learn wrong.

Another term you might have heard about the internet is XML. XML is another markup language, but this stands for eXtensible Markup Language. It uses many of the same glyphs for special meaning as HTML. We will be covering a special combination of these two languages called XHTML, eXtensible Hypertext Markup Language.

There's a few reasons for this. First, XHTML is the current technology. HTML is old and XHTML is newrw and comes with certain advantages. XHTML is also more strict, it is a good way to enforce the strict methodology involved in programming, rather than allow the lax syntax that plain HTML allows. For the purposes of this tutorial you will need to forget everything you know about HTML and start learning XHTML from scratch. If you already do know HTML don't worry though, XHTML is similar and easy to learn. From now on, I will use the term HTML almost exclusively, but remember that I usually mean XHTML.

For an interesting tidbit, HTML and XHTML (by way of XML) are both immplementations of another language called SGML. (Yes, acronyms abound in computers.) This is a markup language language, basically. A set of specifications for how to write a markup language. These sorts of specifications are important. Languages must be written perfectly. A single bug in your program might make the whole thing not work. A single bug in a language couls make thousands of programs not work. Once you are an expert, it might be fun for you to remenber SGML and learn what it is and why it is important. For now it is just a bit of trivia.

There are a number of important overarching concepts to cover when discussing HTML. The first is whitespace. For any programming language, whitespace is an important concern. There are instances where it is required, or its absence is required, but generally programming languages give the programmer leeway to use the whitespace as he wishes in order to aid organization. Doubly so for markup languages, as sometimes you want to mark up a section of whitespace!

In HTML, whitespace is collapsed. This means that all characters representing blank space have the same meaning, and that any two or more in a row have the same meaning as just one. Spaces, tabs and newlines are all whitespace, and they are all collapsed. This means that you can never put more than one pace between words without tricks. Newlines in your HTML also are just one piece of whitespace, they do not make a new line on their own. Don't forget this, but don't stress over it either.

The next big concept is the three special characters in the language. They are <, >, and &. These characters each come with a very special meaning, and are the core of the language. Placing a word inside a set of pinty braces, like </tt> makes a "tag". Tags are the way that we create markup, instead of just one word after another. One of the easiest tags to learn is <tt><br></tt>. The two letters BR stand for break. Abbreviations are also very common in computers!</p> <p>The <tt><br></tt> tag is special. It is a standalone tag, meaning it stands alone, and needs nothing beyond itself to do its job. Other tags like our previous example of <tt><title></tt> always must come in pairs. These container tags contain other things that they effect, and must have a start and end to makr exactly what they do and do not effect. Putting the empty tag again, but beginning with a slash like this: <tt> is how we mark the ending of a container tag.

This is where we must begin getting picky about XHTML. In XHTML all tag and attribute (we will get to those) names must be in lower case. XHTML also, being XML at heart, must be "well formed." One requirement for well formedness is all tags must be closed. For container tags it makes sense, they must have a start and an ending and all is well. For standalone tags, though, it does not make quite as much sense to write

. Luckily there is a shorthand notation for closing a standalone tag:
. In short, place a slash at the end of the tag. It is best to also put a space before the slash. This is not required, but some web browsers read the file much better this way.

That is it, we have begun learning HTML! HTML is the language (almost) all web pages are written in. Some pages use HTMLs big brother XHTML, and the rare page is written in plain XML. But, being able to write (X)HTML means we are learning to write pages the whole world can see!

For this chapter, remember the big concepts: Whitespace collapses, tags both container and standalone, lower case, and closed tags. Then get ready for the next chapter!

Comments:

No comments!

Post a comment:

Username
Password
  If you do not have an account to log in to yet, register your own account. You will not enter any personal info and need not supply an email address.
Subject:
Comment:

You may use Markdown syntax in the comment, but no HTML. Hints:

  • An empty line between text will create a paragraph boundary.
  • Use angle braces around a plain URL to auto-link it: <http://www.example.com/>.
  • Use this format to create a link with different text showing: [An Example](http://www.example.com/).
  • Use backticks (``), not leading spaces to enclose a code block.

If you are attempting to contact me, ask me a question, etc, please send me a message through the contact form rather than posting a comment here. Thank you. (If you post a comment anyway when it should be a message to me, I'll probably just delete your comment. I don't like clutter.)