HTML Guide - Coding Style

HTML GUIDE
CODING STYLE

SOME HINTS ON CREATING GOOD CODE

You don't need vast experience to write good code.
Indeed, the main cause of bad code is that authors have too much experience in writing in a bad style.

Good code just requires a bit common sense and a fair amount of patience.
As a result you'll probably think the tips on this page are blatantly obvious - but you'd be surprised at how many people ignore them or just can't be bothered.

Code Layout

In any computer language the code you write must achieve two purposes.
Obviously, the program must work, but more important than this, it must be well presented.
I know this sounds a bit back-to-front, but programs are modified more often than they are written. If the code is badly laid out, it can take hours to understand and alter.

So how can you make it easy for yourself in the future when it comes to modifying your pages?

Try to adopt a standard layout to the files you write.
It doesn't have to be conventional, as long as it helps you view the code more clearly and you stick to it.
You'd be surprised at how easy it is to edit pages when the HTML code for all of them looks the same.
Take time to structure the tags one your page.
When a browser reads your page, it will not alert you to any mistakes you have made in the code.
If you have mistyped a tag name, it will completely ignore it and carry on regardless. In some cases this will result in whole blocks of text going missing from the screen!
(e.g. forgetting or mistyping a /table, /td, /tr tag)
- Limit the number of tags on any line to three or four.
- Immeadiately after entering a tag, type its cancellation tag underneath.
  This makes sure no tag goes un-cancelled.
  You can then insert text between the tags.

The main point when writing code is to know what you want and how you're going to achieve it.

Page Layout

Obviously, it's not my place to tell you how to structure your page, but don't fall into the trap of thinking that everyone else has your computer using your browser and your options setup.

UNIX, Mac & PC machines, aswel as the type of browser, all spurn peculiarities in the way pages are shown on screen. Although the basic layout of the page will remain true, often text on PCs is larger than on UNIX, which can cause alignment problems.

Don't align images and tables with text or line break tags.
If you want text or images to line up use the align attribute of an image or a table.
Don't overload you're site will images..
You might think only sad people don't automatically download images - but there's an awful lot of sad people in this world (including me), who'll surf straight out of you're site when they all they see is links to images.
Nothing makes me hit the back button faster than a page totally comprised of pictures.
- Include an alt description with your image.
  This will give visitors who haven't downloaded the image an idea of what the image is and whether or not they might want to view it.
- ALWAYS specify the width and height of an image.
  Without this the alt message will not appear and more importantly (as I mention in page 6) it helps the browser to place text around the image before it is downloaded. If the width & height are not declared the browser will wait until the whole image is loaded before placing any more text on the page.
- Include a text menu bar somewhere on your page.
  If you're going to use images as links (or even if you're not), it's a good idea to put a list of links at the base of your page. I know it looks dull and boring and they appear on almost all sites but they do look professional and there's a damn good reason why nearly every site uses one.

Try to view your page with as many different options, browsers (and even computers) as you can.
It doesn't matter how you see your page, but how it appears to other people.

Š1998 Stephen Battey
This page hosted by Get your own free home page