This paper will go over the needs of each page, and display the HTML content as required.
The heading on each page needs to have an Eastfield College banner. Also, this banner needs to be clickable so that a user may click on the banner, and be returned back to the Eastfield College Home Page.
First, each page should start with the following two lines:
<html lang="en-US">
<head>
The lang attribute on the HTML tag tells the browser what language is used on the page. en-US means that this page uses US English. If you were to create a page in Spanish, you would change the attribute to: lang="es"
The title must be included. This is the line that will appear at the very top of the users web-browser, and will inform them of where they are while on our system. Replace Area/Department and/or Page Title with the respective information.
<title>
Eastfield College - Area/Department and/or Page Title
The next line closes off the title tag.
</title>
We will be using the meta tag to identify the creator of the page:
<meta name="author" content="Your Name">
Make sure to use "author" in the name attribute, and use quotes.
We will use another META tag for your email address. (This is just so we can
contact you if there is an error in the page or for updates):
<meta name="owner" content="Your email address">
If you page contain time sensitive data, such as a class schedule, or an upcoming event held on campus, you may wish to use the expires attribute of the META tag:
<meta name="expires" content="02-Mar-2001">
There are two other meta tags used to help your page get noticed on search engines. The first is "keywords." Each keyword should be separated by a comma. Use keywords that are relevant to your page and it may rank higher on search engines.
<meta name="keywords" content="Eastfield College, web page content, guidelines">
The other is "Description." Write a brief description of what this page contains. Many search engines use the description on the search results page.
<meta name="description" content="This page describes what content should be on all Eastfield College web pages.">
Pages on the Eastfield web should have a white background and use the Arial font. There is a style sheet that has this and a few other styles as well. You can link to this style sheet with the following tag.
<link href="/EFC.css" rel="stylesheet" type="text/css">
Now we close the head section.
</head>
Insert a remark tag that gives credit to the creator of this document. Replace Creator/Converter with the appropriate person. Also, instead of Page Created by you might want to say Page Converted by. These are just hints. Use your own judgement when making a remark. You can create as many remark tags as you like.
<!-- Page Created by Creator/Converter -->
We'll start the document by using the <body> tag.
<body>
Next, create a space for the Eastfield banner, centered at the top:
There are now two banners to choose from. The one decribed below is the easiest to add to your page.
<div align="CENTER">
Now we make a link back to the Eastfield College home page, and display a graphic header on the screen at the same time. (The graphic will become the clickable link back to the home page). All of this information will be centered at the top of the page.
<a href="/">
The <IMG> tag inserts an image into the document. The border=0 statement tells the tag that we do not want a border around our image. Finally, the alt="Eastfield College" specifies text that will appear on the screen in case the image of the Eastfield College header does not. The alt text also appears in newer browsers when the pointer is left on the image for a few seconds.
<img src="/images/banner.gif" width="730" height="107" border="0" ALT="Eastfield College link home">
Now close the link tag.
</a>
The main body of the document now requires a heading. We'll use the heading tag, level three size and center it.
<h3 align="CENTER">
The next line should be the same text as used in your page title. (If you used abbreviations in your page title, I suggest spelling out the complete words here).
Area/Department and/or Page Title
Now close the heading tag.
</h3>
Ok, now type your document. Include any HTML codes you like. At the bottom of your document, insert a "horizontal rule" <HR>, so that there is a line running across the bottom of your document. This will separate your document from the closing statements at the bottom of the page.
To separate the main portion of your document from the Questions or Comments line, use a horizontal rule like so:
<hr>
Next, turn on the centering, italics, and bolding features.
<center><i><b>
Include a finishing remark concerning where questions regarding this page/document should be sent.
Questions or Comments?
Replace the 4Webmaster@DCCCD.EDU with an Email address of your department head, or whoever is in charge of receiving Email from the Eastfield College Web.
Send them to the <a href="MAILTO:4Webmaster@DCCCD.EDU">
If you replace the Email addresses with one of your own, remember to also change the title to reflect who it is that Email will be sent to.
Eastfield College WebMaster
End the link, bolding, italics, and centering tags.
</a>
</b></i></center>
The bottom of your document needs to close out the body tag.
</body>
Finally, end the document using the closing HTML tag.
</html>
You're done! Submit the information to your department head for approval, and then hand the information over to the department PageMaster for publishing on the Eastfield College Web.
Over 90% of visitors to the Eastfield College web site are using Internet Explorer or Netscape. Try to make sure that your page looks good in these browsers. If possible, preview your pages in both Internet Explorer 5 and Netscape 4.7.
When using images in your page, make sure to use the ALT attribute for an alternate description of the image, as shown in the example:
<img src="\images\texas.gif" alt="A map of Texas">
Make sure the ALT attribute gives an accurate description of the image. This is to ensure those who have turned off images on their browser and those with disabilities can get an idea of what the image is.