|
|
|
|
Have you ever wanted to format your text to make it "different" but didn't know how? Think HTML is too hard? Nonsense! You can use simple HTML tags to greatly improve the look of your web sites, and you don't need to be a programmer.
What is HTML?
HTML (Hyper Text Markup Language) is the format in which most Internet documents are made. It consists of standardized "tags" or commands that tell the browser how to format the page's text and graphics. When a browser searches for HTML code, it looks for a less than sign (<) to start the HTML tag and a greater than sign (>) to stop the HTML tag.
Many tags must be closed off by putting the same tag with a forward slash in front of the text (/HTML). See the example in the text box below. Ommitting this step will cause some browsers to misinterpret your code. This will cause errors in the page and may cause the page to appear blank. It is good practice to close tags in the same order that you opened them. In the example below, HTML is the first and last tag.
See the text box above? I will use that box to illustrate HTML tags and concepts. After you study the code, try to guess what the page will look like. Then, test it out yourself by clicking View Page. Feel free to make additions and changes to the code in the text box. Then, click View Page to see the difference in real time.
Some basic tags
BR - The Line Break Tag
When a browser encounters the BR tag, it skips down one line to the left margin before continuing to display the text.
B, U, I - The Bold, Underline, Italic Tags
You can use these very simple tags together or individually. The important thing, however, is to remember to close each one that you open. The following example will demonstrate the B, U, I, and BR tags. Can you predict how the example will display after clicking View Page?
A - The link Tag
This tag is mostly used for creating links to other pages or websites. It is often called the anchor tag.
Linking to Other Pages
You can create text or graphic links in the middle of text blocks in EZ-PageBuilder™. In the example in the text box below, we learn that it is the "href" (Hyper Reference) attribute that tells the A tag where to link to.
Links Within A Page
You can also link to certain sections of a page. A good example of this was Bruce's first "Letter From the President" where he had 3 bullet points that linked to corresponding sections of his article. This requires two uses of the A tag. First, A must be used with the NAME attribute to define the "link to" area. Then, A must be used as above to create the link.
FONT - The Font Tag
This tag is used to control the characteristics of a given set of characters. The extra attributes (SIZE, COLOR, FACE, etc.) are not needed but are used to more tightly control the font. The SIZE attribute is used to make the font bigger or smaller. The COLOR is used to control color of the font, keep in mind that people identify blue text with a link so it's usually not a good idea to make your font color blue. You can also specify a color using the hexadecimal codes from the "web safe color table". For example COLOR="#003366". The FACE attribute tells the browser to use a particular font style for example FACE="Arial", FACE="Times New Roman", and so on. Don't forget that this tag must be closed with a close font tag (/font).
TABLE - The Table Tag
The TABLE tag can be pretty extensive. Because of all the attributes and options associated with the table tag, a table can be as simple or as complex as you can imagine. In its most basic form, an HTML table is much like a spreadsheet - composed of rows, columns and cells. When the browser sees the TABLE tag it creates a box. The table then has to be filled with TR and TD tags. TR stands for "Table Row". This tells the browser that you want the information in a horizontal row. Immediately following the TR tag should be the TD tag. The TD tag tells the browser that the information is to be placed in a CELL. TD stands for "Table Data". Let's look at a very simple example to begin with. The following table has two rows with two cells in each row. For example:
You can open as many TD tags inside the TR tag as you would like but keep in mind that whatever you open you must close. You can also set the border width and color but we won't cover that in this article.
Do you think you know tables now? We haven't even scratched the surface. View this next example for a taste of some of the things that can be done with tables.
This information should get you started, try it, test it, tweak it. HTML is a powerful tool and if you know how to use it with the tools you will be unstoppable.
TRY IT YOURSELF!
In the box below type HTML code and then click on "Check it out" The HTML that you type in will appear in your browser.
One way to learn HTML is by viewing the HTML source of a page you are viewing on the Internet. This can be done by selecting Source or Page Source in your browser's View drop-down menu.
Dan Witt wrote the CGI that makes it possible for you to play with HTML in this article. -- editor
|
|
|
