Saturday, September 1, 2007

Do's and Don't in Web Design

Do's and Don't in Web Design
=======================


Technology Related
================


Do try to make the site using only divs and css (Don't use table tags atall!!)
Do try to use AJAX whereever applicable
Do follow Web 2 style!! (big and clear navigation..)
Do try to use a small image and use it as a background of a div/page .. i.e ... use repeat property so that the image may fill a large div and this will load very fast (Eg: 2 x 10 size image for gradient effect)
Do test your application in 3 browser before deploying (Firefox, Internet Explorer 6 and Internet Explorer 7 ---- If a site looks ok in firefox its most likely that it would run everywhere else)
Do use web design tools like macromedia dreamweaver.
Do try to place images and media files in folders and subfolders
Do avoid use of activex components
Do use flash swf file supporting version 6.0. (flash 6.0. is more common word wide) although the latest versions are rapidly gaining popularity.
Don't overuse ajax
Don't use animation too much..only use animation wherever relevant
Do try to use multiple themes, which can be selected by the user (red,blue,back,green...check msn site)
Do try to use the new generation technique of using xml, xslt (for advance users) including templating and skinning (is more applicable for very large sites which is partly static and dynamic [Is currently used in various cms packages])
Do use cross-platform javascripts/dhtml for varous purposes (Eg: validation, calling background sound, animation, cookie setting etc)
Do try to use preloaders if the site is heavy!!..
Do avoid popups!!..


General
=======
Do close popup screens
Do stop sounds
Don't try to mislead seach engines
Don't try to misleadingly attract visitors
Do register your site
Do read the stats
Don't count hits (may be a refresh..)
Do put contact info on your pages (clearly!!!)
Do try to use robots (robot.txt is used by search engines to get a list of all the directories/files you want search engine to index)
Do Try to use domain to come popular (In subdomains there are lots of restrictions)

Content
=======
Do know your audience
(Whenever you make a site target some set of people Eg: religion, programming etc)
Do provide topics
(divide a particular page into topics Eg: introduction, explaination etc..)
Do briefly describe your things
Do use correct spelling
Don't use meaningless words
Don't use jargon
(words used by particular groups but hard to understand by many)
Don't write technical
Do use important text on your main page
Do present the issues right away (good representation of data here)
Do use a descriptive title (very important for search engines)
Do use small pages (avoid long scrollers..)
Don't split topics (don't divide a topic into 100 sub topics..)
Do use implicit text for your links
(Try to write your text in such a way that a link is a natural part of
the sentence.)
Do comment on your links
Do update your pages
Do show date of update
Do ask for feedback
Don't show any page under construction (try to be complete and then publish)

Navigation
==========

Do use explicit addressing (try to specify up, down, left right, previous etc kink of links)
Do check your links (use a tool to check it for u..)
Don't change links (link renaming a file since it might be indexed by the search engine or may be a link at other site)
Do always supply textual links
Do suply a link to home
Do use navigational aids at the top and the bottom
Do use a table of contents
Do create a “what's new” page
Do use short routes
Do keep menu items related
Don't link to irrelevant pages
Don't repeat links too often
Don't use ambivalent navigation (it should not be a spagattei/noodles kind of links!!)
Don't create dead end pages (page without a link)
Don't frame other sites (don't load other site within a frame..the site won't go with the look and feel)


Design
=====

Do use a consistent look and feel
Do use recurring visual element
Don't use dark backgrounds
Don't cram your pages
Don't push your table out of the screen
Don't overuse frames
Do vertical align the content of table cells
Don't mix horizontal aligning


Bandwidth
=========

Do use few colors in your GIF's
Do use high compression in JPEG
Do reserve space for images
Do provide thumbnails for large images
Do reuse images
Don't reference images from other sites
Do provide size informationo
Don't use large textual images
Don't use wordprocessors


Presenting Text
===============

Don't use blink (old days..)
Don't use columns for text
Don't use small serif letters
Don't use all capitals
Don't overuse bold text
Don't overuse italics
Don't use small fonts
Don't use too many fonts
Do use punctuation
Don't hide your links
Do use all lowercase or all uppercase links
Do separate adjacent textual links
Do limit the size of predefined text
Do limit the width of text
Do use textual dates
Do provide a visual email address


Images and colors
=================

Do use transparency
Do use interlacing
Don't use too many images
Do make your graphics reproducible
Do break up images
Do combine backgroundimages and background-colours
Do use a browser safe palette
Don't use too many colors
Don't override only one standard colour

Compatibility
===============
Do supply alt's for your images
Do use alt text for areas
Do use alt text for areas
Do use NOFRAMES
Do use comments for javascript
don't be selective with browsers
Do test Java applets with all browsers
Do test with fewer screen colors
Do test with lowres
Do validate
Don't rely on plugins
Do check for browser version
Do warn for important cookies
Do offer alternative views



-taken from various resources plus my additions..

2 comments:

email marketing said...

Excellent tips. Very useful and unique tips. I really appreciate your efforts to make us well informed.

Anonymous said...

Sounds good, I like to read your blog, just added to my favorites ;)