Adult Webmaster Resources, Articles, News, Help Guides, Sites

HTML isn't a hard language to learn - all it takes is a bit of practice!

Words placed between the < and > symbols are referred to as HTML tags. An HTML document is composed of tags which essentially are the backbone of any web page. The main body of your web page will go between your body tags. Tags that contain a front slash in them are called "end" tags are are used to end an action. Once you get familiar with the basic tags listed on this page, you WILL be one step closer to creating your very own pages.

The following template image depicts the principal HTML code required for a basic web page. In essence, these are the key tags that are crucial in creating a functional HTML document.

BASIC HTML TAGS
These are some of the tags that are used very frequently when working in HTML. You definitely need to get familiarized with all the tags on this page before you can even begin to think about creating an actual HTML document.

Centers all the text and images that follow this tag. You need to use the </CENTER> tag to end this action.

Aligns everything to the left, you can also type in "RIGHT" or "CENTER" if you choose. You need to end this action with the tag.

This is a line break. It stops the current line and starts a new one. No end tag is required.

This tag is very similar to the tag except it skips a line. No end tag is required. Can be used in some instances with the tag.

<HR>

Horizontal Bar. Creates a 'line' across the screen - great for separating various components of a page. Ex: The thin gray bars on this page.

You can give the <HR> tag the folllowing attributes. "COLOR" and "WIDTH" are obvious. The "SIZE" means it's thinkness and "NOSHADE" means no 3D effect.

<HR WIDTH="300" SIZE="3" COLOR="#FFFFFF" NOSHADE>

TEXT & FONT TAGS
You can simply type in the text you want to display on your web page in between the <BODY> tags of your HTML document. The text will appear in it's default format. The following tags will enable you to enhance your text and help you personalize your web page.

All text after this tag will appear in the specified color. Use this tag with the proper six digit Hex Code. Click on over to our Color Code Guide guide to learn more about Hex codes and how they work.

Text will appear in the specified font. Here are some fonts you can try: "ARIAL", "COMIC SANS MS", "GEORGIA", "VERDANA" and "IMPACT".

Control the size of your text. Increase size using "+1" or "+2" and descrease size using "-1", "-2" or "-3".

The Font end tag. This tag puts an end to all the attributes given to any/all text that appears before it.

All text after this tag will appear in bold. You can put an end this attribute using the bold end tag:

All text after this tag will appear in italic. You can put an end to this attribute using the italic end tag:

All text after this tag will be underlined. You can put an end to this attribute using the underline end tag:

Here is how you can put these font tags together. In the following examples, visitors will see the "Welcome.." text in the attributes assigned to the font tags. Never forget to use the end tags.

Welcome To My First Website!

DISPLAY AN IMAGE
The image tag is used to display a web graphic or picture on your web page. Here are some of the principal attributes you can apply to this tag. The following examples apply to images located in the same directory as your HTML document.

Displays the image of your choice. You can display a "GIF" and/or "JPEG" file. Always include the entire name with it's extension.

You can give the image tag a variety of attributes. Here is a good example of a complete "IMG SRC" tag.
<IMG SRC="Your_Image.gif" WIDTH="300" HEIGHT="225" BORDER="0">

CREATING A LINK
A clickable image or text on a web page is called a "LINK". Links have many uses but are primarily used to direct someone to another document and/or image file.

This is a basic link tag. Directs the surfer to the page and/or image specified in the tag. You need to end it with an end link tag: </A>.

Here is a great example of a text link that will direct anyone who clicks on it to our Cozy Campus website.
<A HREF="http://www.cozycampus.com">Click Here to Visit Cozy Campus!</A>
The example above will show the following to your visitors. The only text that will appear on your website is what you place between the LINK and END tag. You can place as much text as you like. Go ahead a click on it:

Click Here to Visit Cozy Campus!

Here is the code required to create an e-mail link. This will enable anyone who clicks on it to send an e-mail to the specified e-mail address using their default e-mail client.

<A HREF="mailto:your@email.com">E-mail Me</A>
Once again the only text that will appear on your website is what you place between the LINK and END tag. Just make sure the e-mail in the LINK tag is accurate. Go ahead and click on it to see what happens.

E-Mail Me

Here is an example of how you can link an image. The following code will link the specified image to our very own Cozy Academy website.
<A HREF="http://www.cozyacademy.com">
<IMG SRC="linksample.gif"></A>
Here is what the example above looks like on a web page. This is a very basic example. You can give your image tag many attributes -- See "Dislpay An Image" higher up on this page! In this case we created a little "Cozy Academy" in photoshop and saved it as "linksample.gif".

This example implies that the image you are using to create your link is located in the same directory as your HTML document.