Web pages can be created using a simple text editor, HTML editor, or application like DreamWeaver or PageMill. It is very useful to know HTML to tweak elements in ways that may not be possible in some editors or applications.
A Web browser like Netscape's Communicator or Microsoft's Internet Explorer is needed to view the page.
Publishing your Web pages requires an Internet Service Provider (ISP). You will likely need software to push files from your computer to your ISP. Your ISP should provide or offer a way to acquire the software. Be aware that your ISP may also charge you for some services including:
HTML stands for HyperText Markup Language. Web browsers read codes embedded in Web pages. As the page is read, the codes tell the browser how to display the elements on the page.
More elements are added to HTML as the language grows and evolves. It is important to note that not everyone uses the latest Web browsers. Remember to keep in mind that older Web browsers generally ignore (or crash) when interpreting newer codes. Test Web pages in different browsers before posting them to your site.
Tags are simply specific words that hold meaning for Web browsers.
They are distinguished from the content of the page by
less than (<) and greater than (>) symbols.
HTML uses some tags that are used on all pages. The basic elements of a Web page are shown and described below.
|Example: HTML skeleton|
<HTML> <HEAD> <TITLE> Title of HTML page goes here </TITLE> </HEAD> <BODY> <P>Content of the page goes here</P> <!-- Comments use these tags --> </BODY> </HTML>
The <HTML> ... </HTML> tags are the first and last HTML tags in the file and let the Web browser know that the file is actually an HTML document.
The <HEAD> ... </HEAD> tags are a kind of a prologue, giving information to the browser about the rest of the file.
The <TITLE> ... </TITLE> tags are a required part of the <HEAD>.
The <BODY> ... </BODY> tags contain the content of the page with all of the codes in place to format the text, graphics, and other elements on the page.
The <!-- ... --> tags are for comments that are ignored by the browser but useful to authors.
Note that each tag generally appears twice, once to open the tag and then again, with a forward slash (/) to close the tag.
|Example: The bold and italic tags|
|The <B>Bold</B> and <I>Italic</I> tags
The order that tags are opened and closed is important.
The last tag opened should be the first one closed.
|Example: Order of opening and closing tags|
|The <B><I>Bold and Italic</I></B> tags together
There are dozens of HTML tags that apply to text formatting, images, links, and other elements like forms, QuickTime movies, and Java applets.
Most tags have optional instructions called attributes that give the tag more flexibility. Attributes can modify an elements alignment, size, spacing, color or even what window to display an element or other Web page.
Attributes are specific words placed after a space inside the opening tag.
Common attributes that many tags use are:
|Example: ALIGN=CENTER attribute used with the <FONT> tag|
|<FONT ALIGN=CENTER>Center this type</FONT>
It is very important to be aware that different browsers may interpret HTML tags and attributes in different ways. Generally, as with tags, an unsupported attribute is ignored. Even the same browser can change how a page appears simply by changing the preferences.
The <HR> (Horizontal Rule) tag can be used as a simple divider across a page or used with the following attributes:
|Example: <HR> tag default|
|Example: <HR> tag with attributes (1)|
|<HR ALIGN=LEFT SIZE=4 WIDTH=75%></HR>
|Example: <HR> tag with attributes (2)|
|<HR ALIGN=LEFT SIZE=8 WIDTH=25% NOSHADE></HR>
The following example is a sample of a simple, yet complete HTML page.
|Example: Sample HTML page|
<HTML> <HEAD> <TITLE> Title of HTML page goes here </TITLE> </HEAD> <BODY> <P>The result is the body of the HTML page</P> <!-- The Title appears in the browser window --> <HR ALIGN=LEFT WIDTH=75% SIZE=8></HR> <HR ALIGN=LEFT WIDTH=55% SIZE=6></HR> <P>A sample with </B>Bold</B> and </I>Italic</I> type</P> <HR ALIGN=LEFT WIDTH=55% SIZE=6></HR> <HR ALIGN=LEFT WIDTH=75% SIZE=8></HR> </BODY> </HTML>
The result is the body of the HTML page
A sample with BOLD and Italic type