Satheesh Babu
2001/03/07
This document aims at providing a starting point on the guidelines and processes involved in developing web pages. .
Quoted from top ten mistakes in web design...
Quoting the top ten mistakes of web management...
If this is a new site If has idea of the content, ready and approved Create a new folder structure Create the folder Create subfolders for supporting components If site has subsections which can have more than 2 html pages: Consider that as a sub site and follow the whole process for that Make a default document Add other pages as necessary Else Stop, make sure you come back with content! Else If you have good idea on how the site is organized, and you have the modified content If you have come to add pages Create the pages with the site's template in mind Distribute the supporting content into appropriate subfolders Else If you want to modify pages Make sure no one else is modifying it at the same time Modify the content See if you broke any links or anything else that was working before your work Else Stop, get a grip on the site and come back Test the site Copy the files over to the staging area Clean up all your backup files from the staging area Get it approved - self or peer or supervisor Upload the file to the production server and do a final test.
Just remember that you don’t need to put all your HTML files in a single folder. Arrange these using folders based on subject and use, just like your normal documents. If you think some content needs only one HTML file now and will probably grow to 10 files in a year, start by making a folder for that first. It is a lot more difficult to arrange things into folders when you have a good amount of content.
Supporting components can be arranged into subfolders named like below.
Each page will have some layout and some content. Layout, or templates should be independent of the content. To make it easy for extracting content later, if need arises, it is recommended that you put enclose all your content in a page between two comments, like <!--content_starts_here--> and <!--content_ends_here--> .
Document Type - If you specify what type the document is (HTML3, HTML4) it will be useful in future.
Title - Make sure your title is something other than Untitled Document!
Meta information - It is a good practice to put meta information like content, author, keywords, summary etc.
Frames - Avoid frames as much as possible. These makes a mess of site analysis, testing and page scaling.
Tables - Tables provide a good way to do page layout. However this can sometimes cause ugly HTML. If you use tables, make sure you view the HTML source (if you used a WYSIWYG tool) to see whether you understand it.
Absolute Positioning - The ease with which it can be done in the tools is a curse. People often try to make their page have a specific width and have sections with specific width. This is often true when people with experience in composing printed media lay out your web site. A browser is not intended for that purpose, and the beauty of the web is that you can consume content in any format you want and you can search. Images and absolute positioning are against these! If your designer insists on this kind of layout, explain that you are developing a web site and not a flyer or a magazine. Many designers make extreme use of the invisible single pixel GIF image to achieve pixel precise alignment. Just think how your page will look if that image file was deleted somehow :-)
Some tags are recognized only by IE and some others are valid only in Netscape. To keep things simple, use only the tags that you know work with both! Please see www.w3c.org for details on the standard tags.
HTML-Kit from Chami Software is an excellent free software which will clean up your HTML, align the code and even do error checking. Even if you use only DreamWeaver or FrontPage, it is recommended that you download this. This is actually an HTML editor (not WYSIWYG), but it has other features which will help you in making What-You-Make-Is-What-Others-Will-See pages.
If you know HTML, use any editor that you are comfortable with. If you don't, Macromedia Dreamweaver is a good choice. In any case, it helps to know HTML.
A very good feature rich editor. Supports template based visual site building. Cons include ease with which people can put useless eye-candy and layers that facilitate absolute positioning. Also, hard to find menus for cleaning up HTML and checking for broken links!
Another visual editor. Very bad compliance with W3C HTML standards. Makes assumptions that people view your page using only IE.
Another visual editor, makes it easy for people to quickly put together HTML documents. Produces extremely ugly and senseless HTML. Good for generic documentation for the print media, but not to be used at all to make web sites.
Not a visual editor. You get toolbars to help you with the tags. Extremely good at cleaning up HTML (even Word's) and can automatically upgrade your pages from HTML3 to HTML4. Very much recommended, at least for testing.
Since you are seeing this, it means that your browser does not support cascading style sheets. Please download and use one of the many browsers that support web standards.