Here's a handy HTML tutorial on how to make websites
Sponsored by SiteRightNow.com.

• Header Area
  • Title
  • Meta Tags
• Text Formatting
  • Fonts
  • Headings
  • Lists
• Linking        
  • Basics
  • Anchors or Bookmarking
  • Emailing
• Graphics
  • Image Tags
  • Alt Tags
• Forms
  • Form Statement
  • Text Fields
• Online Tutorials

http://www.w3schools.com/html/default.asp

Header Area

The header area is the very top of the HTML page. You will see the header tag <header> begin this section and the header tag </header> end this section. This area of the website source code is where you place meta tags and other coding that won't appear directly on the page that your visitors will see. Important elements that go in the header section are:

Title

<title>Create Websites</title>

The title is probably the most important element of your page. The title will help the search engines index you correctly. Simply type your title in between the tags <title> and </title>

Meta Tags

Shown below is a copy of the current meta tags from our SiteRightNow.com website. These tags help the search engines index us. Also you will see a special Google verify tag below that is used with Google's webmaster tools

<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<META NAME="Title" CONTENT="websites How to Make a Website on SiteRightNow.com Make my own website">
<META NAME="Author" CONTENT="siterightnow.com">
<META NAME="Subject" CONTENT="websites How to Make a Website on SiteRightNow.com Make my own website">
<META NAME="Description" CONTENT="Make your own website without programming. Everything is included to make a website, powerful web site maker, domain name registration, ecommerce.">
<META NAME="Keywords" CONTENT="websites,website,webpage,webpages,web page,web site,make,a,web,site,making,your,own,my,creating,home,page,html,www,design,maker,creator,creation,webpages,make my own web site,make my own website">
<META NAME="verify-v1" CONTENT="i9nD73tYE3YUGc9DVtl5gXopJ88bp0qLwImNSudnM/U=" />
 

Meta tags start with:

<META NAME=

then you add the type of tag. Title, Description, and Keywords are the most used tags. The description tag would look like this:

<META NAME="Description"  Content="the description of your website goes here">

Here is more information on Meta Tags

Text Formatting

The FONT tag was used for many years as the standard way to format text. The font tag still works, but it is recommended to use CSS (Cascading Style Sheets) or styles instead. Here's the old way:

<font face="Arial" size=2>This will appear in Arial</font>

Sizes can range from 1 -7 with 7 being the largest.

Be careful to only use fonts that most computers have installed. Otherwise, the computer may substitute a different font instead. You can control the substitution by adding more fonts in your list. For example, you may want to use Verdana as your first choice, but if the person doesn't have Verdana installed, it would use your second choice of Arial.

<font face="Verdana,Arial" size=2>this is either in Verdana or Arial</font>

This tutorial will not delve into CSS or styles. There is a great CSS tutorial you will find here:

http://www.w3schools.com/css/default.asp

To format text, you surround your text with these codes:

<b>Makes text bold</b>
<strong>Also makes text bold</strong>
<i>Makes text italic</i>
<u>Makes text underlined</u>

Headings

There are a number of predefined heading codes that will make text larger or bold automatically.
<h6> is the smallest and <h1> is the largest heading size.

<h1>Here is an example of how to make a H1 heading on your website</h1>
 

<h2>Here is an example of how to make a H2 heading on your website</h2>

Lists

It's easy to make a bulleted list or a numbered list.

The list starts with either <ul> for a bulleted list or <ol> for a numbered list.

Then each line of the list starts with <li> and ends with </li>

and when you're done with your list either use </ul> or </ol> depending on how you started it.

Example:

<ul>
<li>my first line of a bulleted list</li>
<li>my second line</li>
<li>my third line</li>
</ul>

LINKING

Here's the basics of creating a link:

First you use the anchor tag to tell it your link destination. The anchor tag has a few elements. The three main elements are the name, the href, and the target.

<a name="mylink" href="http://www.siterightnow.com" target="_blank">Click Here to go to SiteRightNow.com</a>

The HREF element above holds the URL of the link where you want to the user to end up when they click it.

The TARGET controls where the link is displayed. The _blank target tells it to open a new blank page to show the link.
 

ANCHORS FOR JUMPING

Ever wondered how to jump from one part of the page to another with a link? You do this with anchor tags as well. Simply put an anchor tag with a name in the spot you want to eventually jump to, such as

<a name="jumphere">here's a line of text</a>

Then, somewhere else on your page, put your link you want them to click on. Use the # symbol along with the anchor name as your HREF and you're done!

<a href="#jumphere">Click to jump to the spot</a>

Email Links

If you want to click on a link to email someone, just change your HREF and put mailto:webpages@html.com in there (use the real email address instead of webpages@html.com)

<a href="mailto:webpages@html.com">Click Here to email us</a>

Graphics

Img Tags
 

To display an image, you use the image tag. Here's what it looks like:

<img src="http://www.siterightnow.com/theimage.jpg">

You can fill in the SRC element with the URL of the image you want to display.

You can include other elements with the image tag, such as BORDER, which will display a border around the image.

Here is a full explanation of the img tag:

http://www.w3schools.com/tags/tag_img.asp

Alt Tags

Alt tags are elements of the img tag. The text included in the alt tag will be displayed as the picture is loading or when you mouse over the picture. Also, many say that text included in the alt tags are used by search engines for indexing.

<img src="http://www.siterightnow.com/theimage.jpg" alt="this is a picture of a great website">

Forms

Forms are used to submit information through your website. It starts with the form statement:

<form action="http://www.thewebsiteurl.com/submithere.php" method="post">

This tells the form that when they click the submit button, it will send the information to the submithere.php page.

You end your form with the closing form tag which is </form>

In between these two tags, you put in your form fields that your visitors will use to fill in your requested information:

Text fields are simply a one line text box to enter information. Let's say they are supposed to enter their country in the box. It would look like this:

<input type="text" name="address" size="30" value="USA">

This tells the page to display a text box with the width of 30 and it has a default country USA entered in the box.

There are a number of other form elements. Here is a page where you can find out more:

http://www.w3schools.com/tags/tag_form.asp

HTML Tutorials

Here are a few good tutorials with full explanations for you to learn more.

http://www.make-a-web-site.com

http://www.w3schools.com/html/default.asp

Top 10 links for websites on Google

This page about websites is sponsored by SiteRightNow.com where you can make your own website without programming or we can build a website for you for free