Hypertext Markup Language (HTML) consists of a set of special computer codes referred to as “tags,” which instruct a web browser how to display a webpage. Think of it is as a collection of formatting commands (indicated by markup tags) that define the various components of a web page. The documents are written in plain text (ASCII) format, making them universally readable by different web browsers running on different computer operating systems.
HTML tags consist of a left angle bracket (< or “less than” symbol) followed by the name of the tag and closed by a right angle bracket (> or “greater than” symbol). Most tags are paired with an ending tag that has a forward slash (/ or “divided by” symbol) added to it. So a paragraph would consist of an opening tag (<p>), the contents of the paragraph, and then a closing tag (</p>). It works the same way with other tags, like the top level header tag, h1:
There are some tags, however, that stand alone. To indicate this, they include their own forward slash, like an ending tag, but at the end. For example, a horizontal rule is indicated with <hr />, and a line break by <br />.
Tags can also have attributes. These are little sub-commands that tell the tag how to behave. They are always added inside the opening tag and have the format: attribute=”value.” Many tags require certain attributes. Take, for example, the <img /> tag. It is used to place an image on a webpage. But it must be told what that image is. So it would be coded like this:
All HTML tags can accept a number of global attributes. The two most important have to do with cascading style sheets (CSS). The “style” attribute allows coders to add formatting information right in the HTML. The “class” attribute allows them to format the tag based upon a predefined CSS class.
The world of HTML is extensive and varied. But there is a great deal that you can do with the most basic tags. Here is a list of paired tags:
- p: paragraph
- h1, h2, h3, h4, h5, h6: header, layers 1 through 6
- em: emphasized (normally italics) text
- b: bold text
- a: anchor (link)
Here’s an example, using some of these tags:
And it would display as follows:
And here are the important self-paired tags:
- img: image
- br: line break
- hr: horizontal rule
Behind the Scenes
HTML documents also have a number of tags that don’t have a direct effect on the way that the webpage is displayed. But they are very important. The very first one in an HTML file isn’t technically a tag. It is a declaration that tells whatever program is reading it what kind of a document this file is: <!DOCTYPE html>. After that, the HTML can begin.
The body part of the HTML document contains all the content that the user will see. Here is a very basic html document format:
There’s a wealth of information on the internet that explains just about anything you want to know about HTML. A good place to start is the HTML Tutorial.
Code Your Own Page
These days, it’s not really necessary to know HTML in order to create web pages. Word processing programs like OpenOffice can automatically convert your documents into HTML. But it can be limiting in terms of control. There are also many specialized HTML editors that make all the parts of HTML coding easier while not sacrificing control. To download HTML editors and file conversion programs visit Download.com.
But if you’re feeling adventurous, why not give raw HTML coding a whirl? All you need is a text editor like Notepad and a web browser. Compose your HTML pages with your text editor and save it as a text-only file with an .html extension. Then open the file in your browser to see what it looks like. (Keep in mind that an HTML document may look different when viewed with different browsers.) You can go back to the original HTML file to edit it as often as you like. See for yourself how simple and even fun it is.