HOW TO MAKE A WEB SITE

          The first thing you need to understand is, HTML coding is not difficult, it is not some secret magic potion that only Merlin the Wizard can use. There are less then a dozen HTML tags used in the basic web page and you can actually make a web site with only four HTML tags. All the rest are used to add different effects to your web site.
          If you learn the basic HTML coding as layed out below you will be making web sites in no time at all. As time goes on and you learn more, you can add all the bells and whistles to your web site and make it as fancy as you want.

          A few words about HTML tags. HTML tags are codes you use (or commands) to tell your browser what to do. The code is housed in between the less than < and the greater than > brackets. Such as the bold tag <b> which tells the browser to display the text in bold print. Most HTML tags require a "closing tag" (or a command to tell the browser when to stop doing something.) Like this, <b>Bold Text</b>. Notice the forward slash / before the b in the closing tag. This tells your browser it is a closing tag. Some HTML codes are case sensitive, so it would be wise to write all your coding in lower case letters. (Also CSS coding which requires lower case letters will be replacing HTML codes. Don't get excited, it will be years before that happens. But it will happen. And getting into the habit of writing your HTML codes in lower case letters now will make the transition from HTML to CSS much easier.)

          To make a web site you will need a few things. First off you will need a computer and an ISP (Internet Service Provider.) Since you're reading this I'm going to assume you already have these. Next you will need a "web hosting service" such as Boomspeed.com. You may want to check with your ISP, since many IPS's (such as AOL, Earthlink, MSN) provide their members with free web hosting. Keep in mind that although they offer you free web hosting, there is no tech. support and some are not easy to use. So you are better off with a paid hosting service. There are several on the net that cost less than a lunch at Burger King. Next you will need a "text editor" such as "Notepad" (Notepad is a Windows program and is on most computers). With the above tools and a basic knowledge of HTML you will be ready to make your first web site.

          A few words about text editors. Many HTML documents have been written using nothing but Notepad. I myself spent my first couple of weeks doing my web site with only the help of Notepad. The only problem here is you cannot see your work until you have uploaded it to your web host. If you see a mistake or want to make a change, you will have to go through the whole process again. After a couple of weeks of this I found what is called "practice boards". There are some web sites on the net that have practice boards for you to use for free. A practice board is a text area where you can write your HTML code and click on a button to see your work as you are doing it prior to uploading. You still have to copy and paste your work into Notepad to save it to your computer prior to uploading. But this saves a lot of time. If you check out our HTML tools area (on our HTML tutorial page. Or click HERE) we have included some links to several practice boards, as well as our own HTML text editor. We also show you how to download a copy of our HTML editor to your hard drive so you can use it off line if you want to.

Making a personal web site is a labor of time and love.
The more time you spend working on it the more you will love it.
The bear said that..........

"THE BASIC HTML TAGS"
Here is the bear bones basics of a web page. You can copy and paste the coding below into your text editor and us it to build your web site.

<html>
<head>
<title>
Your web page title goes here</title>
</head>
<body>

Content goes here. Between the opening and closing body tags....

</body>
</html>

For an explanation of what the tags are and what they do, and a few extras that can be included in a basic web site scroll down the page.



HERE IS WHAT ALL THIS MEANS

<html>
<head>

The HTML tag tells the browsers that this is an HTML document. The content that goes in between the opening and closing HEAD tags is for information and instructions for the browsers, and is not displayed on the net.
While most browsers will "forgive" not including the <html>, <head> or even the <body> tags, leaving them out can cause problems with some browsers.

<title>Your web page title here</title>

Make sure your title tag phrase contains at least three words that directly describes your web page's content.

<meta name="keyword" content="key words, keywords">

The meta tags are not a requirement, and most non-commercial web sites (personal web sites) do not use them.
Meta tags are used to aid search engines in indexing your web site.
Keep the keyword meta tag short, think of alternate spellings and even misspellings. Do not repeat keywords.

<meta name="description" content="brief and to the point description of the web page.">

Keep the description meta tag to 250 characters or less. Make sure that it clearly describes the page, and that it uses some of the keywords (but not the misspellings) listed in the keyword meta tag. If you don't include a description meta tag, some search engines may use the first sentence or two of your text, including any javascript coding (even if you comment out the coding).

<meta name="robots" content="all">

Use a comma-separated list of one or more of the content="attribute". Their meanings are:

  • all -- same as index, follow (default)
  • index -- index this page
  • noindex -- do not index this page
  • follow -- follow links from this page
  • nofollow -- do not follow links from this page
  • none -- same as noindex, nofollow (Robots should ignore this page and should not follow links from this page.)
Not all sites recognize the robots meta tag, but some of the major ones do (excite, infoseek, lycos, and webcrawler).

In fact, most search engines do not recognize all meta tags. Some will use your title tag for a description of the page, and yet others will use the description meta tag, others will use both the description tag, title tag and the keyword tag to rate the "relevancy" of your page. Some search engines will also read the top two sentences or the bottom two sentences to help judge "relevancy." Do not overload your page with keywords. This is called spamdexing and will actually more often than not penalize your page with a lower relevancy ranking.

If you have any CSS style tags, java, javascript, or jscript functions that are "called", which means that they do not write to the web page, include them after the meta tags and before the closing head tag.

</head>
<body bgcolor="#ffffff" text="#000000" link="#0000ff" vlink="#ff0000" alink="#ffff00">

You can define the colors of your background, text, and links in the body tag. Some examples of these would be:

  • bgcolor="#ffffff"----- defines the color of the background.
  • text="#000000"-------- defines the color of the text.
  • link="#0000ff"--------- defines the color of your links.
  • vlink="#ff0000"------- defines the color of a visited link.
  • alink="#ffff00"--------- defines the color of a active link.

Place your web content here.         The content of your web site, that is what will be displayed on the web for all the world to see goes in between the opening and closing BODY tags.

</body> </html>

Close out the body and html document.

Note: -- Don't forget to use ALT tags with any images that have informational content in them.

<img src="http://Image-URL.jpg" alt="brief description of the image">

The ALT attribute should be included in all IMG tags. It allows users who are using text browsers to know what the image is supposed to be. Such as blind people who use a software called a "screen reader" to convert everything into text only displays, and then into a refreshable Braille pad. Also, some users will disable the displaying of images to reduce the amount of time it takes for pages to load. Often users will stop a page from loading before the image has been received. If there is no ALT attribute in the IMG tag, they will get a null image. However, if you include the ALT attribute describing the image, they may try to reload the image if it is important.

If the image does not relay a thought (or is just there to look nice such as a ball or star used to start a sentence or paragraph) then the ALT attribute should still be included but without anything in between the parentheses. Like this.........

<imag src=Image-URL.jpg alt="">


To copy-n-paste, the HTML coding is repeated below without the commentaries:
The meta tags will help the search engines find your web site on the net, but they can be omitted if you would rather not use them.
You can also choose your own colors for the body background, text, and links.

<html>
<head><title>Name Of Your Page</title>
<meta name="keyword" content="key words, keywords">
<meta name="description" content="brief and to the point description of the web page.">
<meta name="robots" content="all">
</head>
<body bgcolor="#ffffff" text="#000000" link="#0000ff" vlink="#ff0000" alink="#ffff00">

</body>
</html>

We have a couple of lists of HTML tags as well as some color charts you can use to spruce up your website. You can see the lists and charts on our HTML Tutorial Page.





Where Can We Take You [ Home Page] [ TOU] [ Boomspeed Q&A] [ Website Tut.] [ HTML Tut.]
[ FTP Tut.] [ Web TV Tut.] [ Graphics Page] [ Computer Tools] [ Games Page]

This Web Site Is Hosted by