HTML for the System Administrator


Reader Please Note: The information in this article is correct to the best of my knowledge. If you find any errors, have any comments, additions, or just have questions, please feel free to contact me at billetter@networktechnologist.com

Introduction

Today everyone needs to know html, even system administrators. This article is a collection of html hints and tricks. It contains nothing more than survival html - the bare necessities needed to work with html. I use it as a place to keep those useful tidbits of html that I always forget, but seem to need on a regular basis.

Recommended DOCTYPE Identifier

It is recommended that all web pages have a DOCTYPE identified that identifies the level of html being used. Currently XHTML 1.0 is being used, so this is the recommended identifier:

<!DOCTYPE html PUBLIC "-//W3C/DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">

It needs to be the first line in your html document.

Basic format of a web page

All web pages need to have a basic format:

<!DOCTYPE html PUBLIC "-//W3C/DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">
<head>
<title>This should be the title of your webpage</title>
</head>
<body>
*****The html code goes here*****
</body>

Recommended Web Page Footer

All web pages should have a footer.  The footer provides basic contact information, copyright statement, date of last update and url of the page.  All of this information can be important to both the web page author and to the user who views the page.  Here is a sample footer:

 <hr color="#800000">       
  <address> Copyright Bill Etter 2002 all rights reserved<br />
   Last Revised August 27, 2002<br />
   For more information, contact <a href="mailto:billetter@networktechnologist.com">
  billetter@NetworkTechnologist.com</a><br />
   http://www.networktechnologist.com/sysadmin/html.htm </address>

You may recognize it as the footer for this article!

How to link to another page

Linking to another page uses the anchor tag, with the href parameter.  For example:

<a href="http://www.networktechnologist.com/sysadmin/html.htm>Go to HTML Article</a>

This code will create a link to the file html.htm anytime someone clicks on the text "Go to HTML Article".  In the html document that text will clearly be identified as a link.

How to link to a location within the current page

Linking to a location within the current page requires 2 steps.  First the location must be given a name.  This is still done by the anchor tag:

<a name="sysadmin">      </a>

Then the actual link needs to be created, again using the anchor tag:

<a href="#sysadmin">System Administrators</a>

Clicking on this link will take the user to the location of the name anchor in the document.  This is a very use method of allowing users to jump directly to content of interest in a web page.

How to link to a CGI program

Linking to a CGI program is just as easy as linking to another page.  The only difference is that most CGI programs are stored in a separate location on the server (for security reasons).  We will assume that you want to link to the cgi program sh-messages.cgi:

<a href="http://localhost/cgi-bin/sh-messages.cgi>
<b>View the Messages Log</b></a>

This link will call the program sh-messages.cgi when the "View the Messages Log" link is clicked on.  Note:  in order for this to work properly the sh-messages.cgi program must have execution permissions - usually granted by the unix command:  chmod a+x sh-messages.cgi.

Navigational Bar for the top of the web page

Every webpage needs navigation buttons.  In most cases it is sufficient to place them down the left side of the screen and across the top of the screen.  Here is the code necessary to put a simple navigation bar across the top of the web page.  It will look something like this:

Resources are available for: System Administrators | Network Engineers | PC Support

The html code is split into the navigation bar and then separate anchors within the document that the navigation bar points to.  Here is the code for the navigation bar:

<p>
Resources are available for:<a href="#sysadmin">System Administrators</a> |
<a href="#neteng">Network Engineers</a> | <a href="pcsupport">PC Support</a>
</p>

The area of the web page the System administrators points to has the following anchor which names the area:

<a name="sysadmin">      </a>

For the other areas of the page, the anchor is similar:

<a name="neteng">     </a>

<a name="pcsupport">   </a>

How to display text without losing it's format

After you have written a few web pages you will notice that white space is ignored in html.  This causes formated text to lose it's formatting.  To overcome this problem you can use the <pre> tag.  Anything between the <pre> and </pre> tags will retain it's whitespace formatting.

Automatic Redirecting from one Web page to another page

Sometime you would like one web page to automatically (without the user doing anything) link, or redirect to another web page.  This is accomplished by the following command:

<meta http-equiv="refresh" content="N; URL=http://[web address goes here]">

N is time to wait is seconds, N=0 means immediate redirection.  For example to immediately redirect a web page to my home page use:

<meta http-equiv="refresh" content="0; URL=http://www.networktechnologist.com">




Back To Main Page For List Of Other Documents

Copyright Bill Etter 2002 all rights reserved
Last Revised September 20, 2002
For more information, contact billetter@NetworkTechnologist.com
http://www.networktechnologist.com/sysadmin/html.htm