t-shirt art pointer 12 SIG Notes | SIG Dates | Web Site Class | SE Tutorials | Search Engine Aid | Site P.R.

About Us | SPW Art | ART-ACT Art | Gallery Art | Art Contest | Help Us | Free GIFs


search engine articles

Website Design &
Promotion SIG

HTML & A WEB PAGE MADE EASY

SIG Presentation by: Chris Drew
July 7, 2001

The Website Design and Promotion SIG met:July 7th, 2001, at the American Indian Center, 1630 West Wilson Avenue in Chicago. The meeting was conducted by Chris Drew, SIG Coordinator and presenter.

HTML & WEB SITE MADE EASY

In this presentation, we wrapped some basic non-technical issues of web site design and promotion around a description of the very minimum HTML code needed to create a page. Some would urge us to avoid learning any HTML claiming that by subscribing (annual upgrades) to expensive software we can avoid the need to ever learn any code. The premise of our SIG is that basic HTML is so easy to learn that everyone can understand enough to create basic pages and with time even edit the code produced by software when needed.

This is the basic page form we presented:

<HTML>
<HEAD>
<TITLE> Keywords that describe the site's content </TITLE>
</HEAD>
<BODY>

<P> Text that people can read. The head is for the search engines and visitors' browsers to read, while this - the body - is for you the public to read. Graphics are added here with image tags and text size is controlled by headline codes (tags) ranging from </P>

<h1> the largest to</h1>
<h6> the smallest.</h6>
</BODY>
</HTML>

This is how it would look:


Text that people can read. The head is for the search engines and visitors' browsers to read, while this - the body - is for you the public to read. Graphics are added here with image tags and text size is controlled by headline codes (tags) ranging from

the largest to

the smallest.


Presentation Summary

Presenting this basic page gave us the opportunity to explain the "Title" tag and the concept of "keywords" which is required understanding from the beginning to succeed in gaining search engine traffic. Knowing how to select keywords and where to place them on your pages help your pages rank higher on search engines that index and list your site. We also introduced the trial and error method of working with HTML code that allows even the raw beginner to try her or his hand at HTML and to see immediate results. Finally, we stressed the importance of interesting content to give visitors value for their visit and of trading links to connect to a networked community of interest.

HTML

An HTML page is always a "text-only" document. That is the only thing a computer can read. Headlines and font sizes or styles are for humans not computers. From the text-only HTML document your browser creates a page with graphics and different size type. Your browser can only read a text-only file with a file name extension of .htm (the three letters following the period in a file name). If you use MS Word and forget to tell it to save your HTML file as a text-only file, you are in trouble. It will save it as a Word file with the .doc extension and your browser will not be able to read it because it is not a text-only file and because it does not have an htm extension. Notepad, which is supplied with your Windows operating system, can produce text-only files but it likes the extension txt. If you write HTML in Notepad and rename Notepad files with an htm extension, it is all you need to create and edit HTML pages.

HTML works much like the Reveal Codes that WordPerfect shows its users. When a font change is made in a WordPerfect file with Reveal Codes viewed, you can see a code is inserted to indicate the size and style of the new font. When that font ends an end code for that font is inserted. The beginning and end codes surround the text they affect. The difference with HTML is that instead of giving exact font sizes and types, relative values like big, bigger, biggest and small, smaller, smallest are indicated. Each browser software interprets these relative codes in its own way. This is because HTML was invented as a way to overcome the different operating systems, different size monitors, their different abilities to show colors, the different type faces and browser software people have installed on their computers, and the differing ways people configure their software and hardware. The solution was to invent general instructions that let each unique computer receiving an HTML page decide how to handle laying out the page for the viewer. Absolute control is lost but graphics and text are shared with a much greater audience.

The "relative value" example above refers to the six levels of headline codes. The largest headline possible begins with <h1>, the smallest with <h6>. The text of the headline follows the code and at the end the code is repeated with a forward slash, </h1>, to show the ending of the headline. HTML codes that turn a feature on and off come in pairs. The off or end code looks the same as the on or beginning code except it has an initial forward slash. Common examples of code pairs are <strong> </strong> (for bold type), <p> </p>, (to define a paragraph), <title> </title> (surrounds the title in the head) and <h1> </h1>.

Case does not matter in typing codes. BIG letters or small - the codes read the same to any computer. This is not true for file and directory names. The wise always use either all small letters or all capital letters consistently throughout their web site for file and directory names.


The "head"

Every web page has a head and a body. The body is read and arranged by our different browsers for us to read. Your browser reads the head of a page but does not to show it to you. Search Engines also read the head. The title in your page's head, <title> Keywords </title>, is your ticket into a search engine's listings because without a title your search engine ranking is so bad your site will not be seen. The keywords of your page titles are the most important keywords in your entire site to a search engine. You can, also, tell the search engines what the subject of your website is and give it the proper way of describing your site in the head of your page by using a meta tag containing keywords or a meta tag with a description of your page's content. See our Meta tag tutorial at art-teez.org/school.htm for more information.


What is a keyword?

When you search for information on topics of your interest on a search engine, you type in a word or a phrase and ask the search engine to provide you a list of pages on that topic. Search Engines visit millions of websites on the Internet and collect lists of descriptive words from web pages. They store them in huge databases. A search engine compares the words collected from your web site with the words searched on by visitors using their search service.

People come to the search engines with words to search on (keywords) and the search engines compare those words with the words from each of the web pages in their database. They rank those pages as more or less relevant according to how often the searcher's words appear in the words collected from each page. Search engines have their own formulas for giving value to words collected from web pages. A keyword in a title tag is worth more than the same keyword in the body text of a page for most search engines. Search engines score pages and give out lists containing the sites they rank the highest. Only the first 30 sites, out of, often thousands of sites, will be seen by an average surfer. There is a whole specialty of web site promotion called "Search Engine Optimization" that studies this subject.


Editorial Comments

At least this is the way it supposed to work. Lately a disturbing trend is emerging. Search engines are seeking to support themselves by selling the top positions on keywords. Those of us with valuable content but little money, the people who have made the web of interest with our content, risk loosing our fair access to traffic if this trend goes over the edge.

I predict, should that happen, that a movement of reaction will form a non-corporate sector of the Internet that has its own search engines. This sector will become many times more interesting than the sector filled with dollar grabbing ad hustlers with only superficial content to give.

The Internet is a network that shares information and which communicates - publishes via multi-media. It is communities within communities. It is a niche or magazine format medium type and, as such, is friendly to those who seek small, isolated, or specialty communities. It is friendly to controversy. It is an anarchistic forum and a network of networks. It is not a "TV captive audience where 'they' have total control of the flow - sit and watch a commercial - medium." It is interactive. The meek shall inherit the Internet. The mouse holds the power. While many community sites are thriving based on the diversity of their content and the networks they are building, many dot-com sites are crashing under the pressure of immediate profits.

Will community sites be buried by commercial sites, which pay for access? It is much too early to tell. The Internet is in its infancy and it is changing month by month.


Getting Search Engine Traffic

So, the descriptive words you use between the title tags and in your body text help bring traffic to your site from search engines. It is the words people search on that match the words you use on your site is what makes you rank high enough to be discovered. Thus, you need to know what words the people you are looking to be hooking are looking on! You want to use these words on your web. To find out more about keywords and how to find your site's keywords visit http://www.art-teez.org/school.htm and read the article on Keywords.

In a nutshell, to rank high, your site's keywords should appear in your page title (in the head), in the first <h1> headline on a page, and in the first 100 words of text in the body of your page. They should be in the "keyword" and "description" meta tags you use.



See Immediate Results as a Beginner

The best way to learn is to work with a favorite text editor or word-processor to type in your text and HTML codes. then use a browser to view how your developing page looks. As you make changes, you save the file in your word-processor and return to your browser. Open the page in your browser or if it is already open - click on your Refresh (Internet Explorer) or Reload (Netscape) button to view the page. Return to your word-processor to make more changes. Save the changes. Click on your browser and refresh/reload the page. See the results of your HTML. Learn what each code you add does. Experiment and in time you will have taught yourself HTML. If this paragraph mystifies you come early (12-1pm) to our SIG.

Or visit http://www.art-teez.org/cable.htm and click on Lesson 2 to be walked through this process using a text-editor and a browser to make a first HTML page. If you have never made a page before this tutorial will help. This is an on-line lesson, mirroring one of the 13 cable TV classes that make up a series called "Making a Popular Web Site" being produced by our host, the Uptown Multi-Cultural Art Center. Pages that will help you learn the basics will be added weekly through the end of September.


Urging on the Builders

More and more average people are learning how to develop their own web sites for their hobbies, businesses or community pursuits. They can afford to take their time to build class acts on-line if they eat the elephant one bite at a time. While big businesses crash in cash crunches caused by high tech overhead costs, community and hobby sites creep along growing ever stronger by slowly building networks of related sites adding content with simple designs created with basic HTML code.

In the long run only 20% of your traffic will come from the search engines. The links you make with other sites in your area of interest are your long-term traffic solution. Building content, interaction, and info services that keep people returning to your site is the key to a web site's popularity. Enjoy!



Do you know a link for us to add to this list on this topic? Click here to e-mail us!


Meetings of The Chicago Computer Society - Web Development / Promotion SIG
are 1:00 pm. until 3:00 pm. at the American Indian Center, 1630 W. Wilson.
Beginners are invited to learn Internet Basics from 12:00-1:00 before each meeting.

FUTURE MEETING DATES & TOPICS

We want your ideas! E-mail all future meeting topic requests for the Web Development / Promotion SIG meeting to: umcac@art-teez.org



Infoseek tips t-shirt promotions pointer 22

Click here for Free Website Graphics.





t-shirt art pointer 12 About Us | SPW Art | ART-ACT Art | Gallery Art | Art Contest | Help Us | Free GIFs

SIG Notes | SIG Dates | Web Site Class | SE Tutorials | Search Engine Aid | Site P.R.