HomeGraphics
Week 1
Week 2
Week 3
Week 4
Week 5
Week 6
Week 7
Week 8
Wouldn’t it be great if someone would just tell you what was wrong with the HTML on your home page? Well they will! Point your browser to the HTML Doctor, click on single page analysis and type in the URL of the address you want it to analyze. We’ll use my Creation Web Page as an example. I type http://www.cameron.edu/~julie/creation/index.html, choose long report format, and then click on go.
The Symptoms
- The first information you will be presented with after
clicking on go is a page summary. I learn that it takes
8.2 seconds to download my Creation Web Page over a
14.4kbps modem. I also learn that while there were no
document or table structure problems, I do have a
problem with an image and there is a potential spelling
error. Looks like we may have to operate.
- The Cure
- Right under the summary report are some links that will
give you more information. They’re all on the same web
page though, so just click on the first link: Document
Structure.
- Structure
- The document, table, and form structure links analyze
your web page for matching pairs of html tags. Is <HTML>
at the top of your page and the corresponding </HTML> at the bottom? If you have an error, HTML Doctor will give the line number of the error. Missing closing tags can often mess up your document and the way it looks. Particularly if you are missing an </A>.Close all the open codes! - Images
- Image Analysis and Image Syntax look at the graphics on
your website. The graphic type (gif or jpg), size,
download time, width, and height are listed for each
graphic. Not surprisingly, most of the 8.2 seconds to
load my page is for graphics.
The Image Syntax section can really help shape up your page. Any time you are working with graphics, you need
to include two things: height and width attributes and an alternative text description. HTML doctor tells me I haven’t done either of these on my Creation Web Page! First, I login to cuok and type " cd public_html" to get to the directory my web page is in. (If you maintain a department page, type "cd www".) Now I pull up my file using pico or the vi editor, whichever you are more accustomed:"Must Haves" for the <IMG> Code
- width
- height
- alternative text (alt)
$ pico filename.html or
$ vi filename.html
The Image Analysis section told me my graphic is on line 10, so I arrow down to line 10. I was also told that my image width was 200 and the height is 200. The alternative text I choose is "The Creation Web Page Logo." I need to add these attributes to the <IMG> tag. Here’s the resulting html:
<IMG SRC="musictrans.gif" WIDTH=200 HEIGHT=200 ALT="The Creation Web Page Logo">
HTML doctor also spell checks your page and checks any hypertext links to see if they are still working. Rather than going to your page and clicking on each link to make sure it works, let HTML Doctor check them all at one time.
In fact, I’d recommend using HTML doctor every time you make any sort of changes to your page. You’ll be amazed at what problems are cured when you make regular visits to the doctor.
Page maintained by Julie A. Duncan, Information Designer.