HTML Help & How-to's

I use the simple *FREE* Notepad program that comes with Windows to create and edit my webpages. I have been programming for over twenty years but even when I started my first webpage I used Microsoft Word to create the basic HTML and then cleaned up the code and edited it by hand as I learned HTML. Most of the Microsoft programs that you can create pages with do a nice job but they produce messy code which doesn't always work the way it should on some non-Microsoft browsers but are extremely easy to start with and most people are already familiar with using them.


HTML commands & examples:

Document sections:
<HTML> HTML outlines your entire HTML document marking its start and finish and should be closed with </HTML>
<HEAD> the HEAD contains your metatags and other information for your webpage and should be closed with </HEAD>
<TITLE> the TITLE contains the name of your page and is displayed on the title bar of your browser window (Title must be enclosed in the HEAD of your document)
<BODY> Body outlines the body of your HTML document where the visible part goes. Body is closed with </BODY>
Body commands:
<P> P is used to mark a paragraph. Your paragraph should be closed with </P>
<P ALIGN=> ALIGN is used to select where your paragraph is aligned (Left, Center, Right). EX: <P ALIGN="LEFT">, <P ALIGN="CENTER">, <P ALIGN="RIGHT">
<H?> H? is used to display a heading and can be one of six levels from 1-6 with 1 being the largest and most prominent. H? should be closed with </H?>
<H? ALIGN=> ALIGN is used to select where your heading is aligned (Left, Center, Right). EX: <H? ALIGN="LEFT">, <H? ALIGN="CENTER">, <H? ALIGN="RIGHT">
<CENTER> CENTER is used to "center" a section of your page and is closed with </CENTER>
<B> B is short for BOLD which emphasizes some of the text in your page and is closed with </B>
<I> I is short for ITALICS which italicizes some of the text in your page and is closed with </I>
<EM> EM emphasizes some of the text in your page and is closed with </EM>(Usually Italicizes)
<U> U is short for UNDERLINE which underlines some of the text in your page and is closed with </U>
<BLINK> BLINK is short for BLINK which causes some of the text in your page to blink and is closed with </BLINK>(Not standard HTML)
<STRIKE> STRIKE is short for STRIKETHROUGH which causes some of the text in your page to struck through and is closed with </STRIKE>(Not standard HTML)
<HR> HR places a hard ruler line across your page
<BR> BR cause a vertical break in your page
<SUB> SUB is short for SUBSCRIPT which causes some of the text in your page to displayed in subscript and is closed with </SUB>(Subscript is printed below regular text)
<SUP> SUP is short for SUPERSCRIPT which causes some of the text in your page to displayed in superscript and is closed with </SUP>(Superscript is printed above regular text)

Tabular Data Control:

Tabluar Data Control uses ActiveX (Pretty much exclusively a Internet Explorer only function) and I wanted to stick to HTML that would run equally well when viewed with any browser. But since there isn't a common standard way to display a simply TXT file on a webpage such as a client side include yet I figured going with the most common browser would be the next best thing. This will allow you to make webpages that people can easily maintain themselves without having to purchase expensive software or learn HTML themselves. What good is making a webpage for a business if the webmast has to come back every week to update the sales and other news articles. Oh, thats right! most webmaster charge per visit and per hour! Well skip this article if thats the way you work. TDC can get fairly involved so I will give a brief overview and an working example where I tied in the calendar function of Microsoft Outlook allowing easy and quick updating of a webpage's activities page. This is easily adaptable to display current sales and products available as well as a calendar of upcoming events!

The following goes in the head of your HTML document:
<OBJECT ID="OBJECTNAME" CLASSID="CLSID:333C7BC4-460F-11D0-BC04-0080C7055A83">
<PARAM NAME="DataURL" VALUE="FILE.TXT">
<PARAM NAME="UseHeader" VALUE="TRUE">
<PARAM NAME="TextQualifier" VALUE="&#34;">   &#34; is the entity for a quote (")
<PARAM NAME="FieldDelim" VALUE=",">
<PARAM NAME="SortColumn" VALUE="Start Date;Subject" Field Type="Date">
<PARAM NAME="Sort" VALUE="">
</OBJECT>

Now to display the data this object creates just place the following code in the proper location in your HTML document:
<TABLE DATASRC="#OBJECTNAME" BORDER="0">
<THEAD>
<TH>Header1 :</TH>
<TH>Header2 :</TH>
<TH>Header3 :</TH>
</THEAD>
<TR>
<TD><SPAN DATAFLD="header1"></SPAN></TD>
<TD><SPAN DATAFLD="header2"></SPAN></TD>
<TD><SPAN DATAFLD="header3"></SPAN></TD>
</TR>
</TABLE>
The header1, header2, and header3 will have to be replaced with the header field in the your FILE.TXT. Any number of columns can be added or taken out as needed. Of course OBJECTNAME can be replaced with any name that has meaning for you as long as it is used in both places. FILE.TXT can be replaced with any URL pointing to a file on your server or anywhere else on the web. If you would like to see this in action check out the KOfC376 Activities page and then view the source.

Links:

HTMLTIPS page for my Knights of Columbus Council
Search the web using Google!Websearch with Google!

HTML Gear from Lycos powerful add-ons to enhance your website for the small price of a banner on your pages. Here you can find Guestbooks, Link Managers, Feedback, News headlines and the ever popular webpolls!

Fastcounter.COM an easy quick small way to add a semi-free counter to your website. Requires you to get a .NET password and registration

Free counter and statistics
This incredible *FREE* little counter gives you all sorts of useful statistics such as where, how and what browser your visitors are using!

moreover.com probably the largest and easiest to configure free news and information tickers for your website. Can be setup to show articles with certain keywords.

All News Tickers I'm sure there are others but... ;-) from Kresch.com Dynamic content that is easy to add to any website!

A great place to learn HTML and see examples! From Case Western Reserve University.

Jimtools.Com. This site has a NICE auto submit feature, link checker, spell checker, HTML checker, re directors and much more! A good one to check out

Create FREE graphics at FlamingText.com Create FREE graphics at FlamingText.com

Use this to create text for your website:


Email Mike!

Mike's webpage index:

WEB Design

A.I. - Broadband - Dnets's - HTML - Linux - Mikes Vintage - Neural nets - PDA's - Spam - The net - Vintage - Windows
Amazing - Cats - Free - Great events - LEO's - News - Satellites Wii
Genealogy - MOST wanted, Berringer, Kubik, Laferriere, Mailman, Wessell.

Mikes homepage

Valid HTML 4.01!

KofC Council #376