Basic HTML Tags

Even if you work with a What You See Is What You Get (WYSIWYG) editor you are still going to want to learn some basic HTML tags. Some times your WYSIWYG editor will not do exactly what you want, and if you want to make a few small changes to your page you can do it without uploading a new version of the page.

I also show a few useful tags that are useful but not an option on most WYSIWYG editors. Including Click Here to Bookmark and The Mouse over. I will be adding more useful tags to this page but avoid complex JavaScript.

Basic Html Tags

Most Html tags come in pairs, here is the Html code for a blank page-

<HTML>

<HEAD>

<TITLE>This shows up in the title bar of the browser</TITLE>

</HEAD>

<BODY>

</BODY>

</HTML>

As you can see the 4 main tags come in pairs with the second or closing tag with a / before it. Your Title and META Tags go between the <HEAD> and </HEAD> tags. The rest of your page goes between the <BODY> and </BODY> tags.

Here are some more basic tags that get used a lot-

<P> Starts a new paragraph

<P ALIGN=Center> Starts a new paragraph aligned in the center of the page

<BR> Line break, you can put several of these together to make a long vertical space

<HR> Horizontal Rule

<A HREF="URL Goes here">Link text goes here</A> This is the code for a text link

<A HREF="URL Goes here"><IMG SRC="Image location goes here" WIDTH="2" HEIGHT="2" BORDER="0"></A> This is the code for an image link

  A non breaking space, anything more than 1 one space in HTML must use this.

These tags come in pairs and are put before and after the text want affected

<H1> or <H1 ALIGN=Center>Put Heading Here</H1> Makes text larger, use any number 1-6, 1 is the largest. Search engines give headings more weight.

<BIG> </BIG> Makes text larger, use several to make text much larger.

<SMALL> </SMALL>Makes text smaller, use several to make text smaller.

<CENTER> </CENTER> Aligns text in the Center of the page.

<FONT COLOR="#80ffff"> </FONT> Changes the color of text.

<I> </I> Changes text to Italics.

<B> </B> Changes text to Bold.

<BLOCKQUOTE> </BLOCKQUOTE> Indents text from the edge of the page making it easier to read. Put one or more at the beginning of your page and a corresponding number at the end.

Tables

The Code for a basic Table with 2 columns and 2 rows aligned center.

<TR> Starts A table row

<TD></TD> Creates a column

<TD></TD> Second column, continue for as many column as you want.

</TR> End of first row

<TR> Start second row

<TD></TD> Second row first column

<TD></TD> Second row second column

</TR> End second row, continue for as many rows as you want in the table

</TABLE>

</CENTER>

Click here to Bookmark this page Not all browsers support this code but even the text is a reminder for your guests to bookmark your page. You can put a different page than the one the code is on. (Your home page for example)

<A href="javascript:window.external.AddFavorite('http://www.yourdomain.com', 'Site name that shows up on bookmark list')" target="_top"><B>Click here to Bookmark</B></A>

The Mouse over Can be used to provide more information about the link or to hide where it leads. If the surfer has JavaScript disabled they will not see the mouse over text.