Most web pages are written in Hyper Text Markup Language or html. An html document is mostly just text. The html is in the form of tags scattered here and there throughout the document to direct the structuring and formatting of the text. Html files are read by a browser (such as Firefox, Netscape or Microsoft Internet Explorer) to produce a nicely formatted page.
Not everyone. If you use Microsoft Word, for example, to write your documents, you can save these as web pages and open them with your browser. If you find Word easy to use, if you don't mind large files that can take a while to download, and if you have no wish to interact with your readers, you might not need to learn html.
If, however, you are serious about building web pages, you may find it just as easy to learn html, as to learn Word or any of the web programming software packages. Furthermore, once you have mastered html, you will be able to extend your abilities by learning to use a programming language such as PHP and a database. At this point, you will have a very useful tool. It will be easy to generate intricate and complex webpages.
Html tags, also called elements, are instructions to the browser. They structure and format the text by directing the placement of paragraphs, headings, forms, tables, images, links, colors, fonts, and so forth.
It seems obvious that the browser must have a way to differentiate its instructions from the text. This is done by enclosing the instructions in angle brackets, for example <pre> . The resultant structure is called a tag.
Html tags come in pairs, one to start the formatting, and the other to stop it. The stop tag is identical to the start tag except that it contains a forward slash, e.g. </pre>. Text to be formatted is placed between the two tags. Every start tag should be followed by the corresponding stop tag; otherwise the browser is likely to become confused. There are a few tags, that do not have stop tags. These will be pointed out as we go along.
Here is a very simple html file. Note that each element has a start and a stop tag. Click the light bulb for the code results.
<html> <head> <title>A Very Simple Document</title> </head> <body> The body section contains the text to be displayed by the browser. The head section contains instructions to the browser that will be applied to the whole file. </body> </html>
No structuring or formatting instructions were used in this very simple file. Consequently the browser displays the text as one large paragraph.
It is certainly possible to format the text as it is being written, and it is a lot of fun, but it can drive you distracted, if you're writing much more than a page. It is easier to be content with structuring the text. The formatting of the entire document can then be adjusted at one time, using a style sheet.
Html provides six headings as shown. To produce a heading, place the text between the beginning and ending tags:
<h1> Text for Heading 1 </h1> <h2> Text for Heading 2 </h2> <h3> Text for Heading 3 </h3> <h4> Text for Heading 4 </h4> <h5> Text for Heading 5 </h5> <h6> Text for Heading 6 </h6>
Click on the light bulb to see the default settings of the headings. You'll learn to change the appearance of the headings in the section on style.
Note that this paragraph has indented margins. This was accomplished by placing the text between the <blockquote> and </blockquote> tags.
Text can be preformatted, like this, by placing it between the <pre> and </pre> tags.
The World Wide Web Consortium, W3C, approves two ways of marking text for emphasis: <strong> and <em>.
Most of our formatting will be done using CSS. Here are some html tags you can use as well.
These font changes are vintage html; they're fun and useful, as well as easy.
Bold text is placed between the <b> and </b> tags. Italicized text is placed between the <i>and </i> tags. Monospaced text is placed between the <tt> and </tt> tags.
Striken through textis placed between the <del> and </del> tags. Underlining text is not recommended because clickable links are typically underlined, but if it must be done, it can be accomplished with the <u> and </u> tags.
xi Subscripts are placed between the <sub> and </sub> tags.
23 Superscripts are placed between the <sup> and </sup> tags.
A horizontal line can be included by using the <hr> tag. Since a line encloses nothing, there is no stop tag.
A line break can be included by using the <br> tag.
There is no stop tag.
The break tag is most useful for breaking a line in the middle
like this. Although line breaks can be used to format text, please don't; there are much easier ways to accomplish this.
When you don't want text broken, place it between the <nobr> and </nobr> tags.