Internet

Technical tips for designing a good web page

How do I create a good quality web page?

When designing a good web page, just keep in mind the following points:

  • Ensure all Web pages emphasise the one main purpose of the entire web site - is it to sell, buy or inform your readers? And what exactly are you trying to sell, buy or inform to your readers? This is important because when people are surfing, they are usually looking for something. And to find something fast, a Web page must have a definite purpose to make life easier for the readers. Remember, don't explain to your reader why you and/or your company is the biggest or the best in the world. Just show how easy it is for people to find what they want or buy.
  • Put your most important, attention-grabbing information at the top four vertical inches of the page, as this will be the first thing the audience will see on the screen when your pages are being downloaded.
  • Keep web-page loading times as short as possible. The maximum downloading times considered just bearable for a majority of readers is about 28 seconds for a standard Web page with static and/or animated graphics and text, and 3 minutes for watching an online video.

    "Response times rule the web: if it's faster, it's better. We say this because when we do studies, all users say the same thing: they don't want to wait for slow download times." Jakob Nielsen (1)

    On the Internet, speed and reliability are everything!' IMC Online (2)

  • If, for any reason, you must have a web page that takes time to download, advise your visitors of the fact. Tell them that the page you are about to enter will take so many seconds or minutes to download and explain why it takes that long. In that way, visitors can decide whether or not to download the page or go elsewhere. Remember, even if visitors are forced to download a page without good reason and it takes too long to download, they will quickly decide to stop downloading the page altogether and go elsewhere. So it is better to let them know how long it will take and why, and then give them the option to download it if they want to.
  • Use several small, or one appropriate-sized picture or video relevant to the content on the page, rather than lots of large pictures.
  • In the case of an online catalogue where you might need to display lots of pictures of various items, you are better off creating lots of small "thumbnail" images saved at a much lower resolution and with smaller dimensions than downloading a whole lot of large images, even if you have specified in your HTML to display the large image files as small pictures in your web page.
  • Avoid putting headline text into GIF or JPEG picture file format. They will only increase download times and probably annoy the hell out of your audience. Try using the H1, H2, H3 etc and STYLE HTML tags to achieve the results you want (download and check the HTML in this page for further details).
  • If you want to create a highly compact background graphic image for your web pages, locate a small enough graphic and use the TileMaker capabilities of say Adobe ImageReady 1.0 or higher (found under the Filter>Other menu command) to turn the graphic into a tile. Or use a freeware/shareware utility to create tiles out of your graphic images. A tile is a graphic image which when opened and multiple copies of itself are laid on all sides of the tile creates a seamless image as if no tile ever existed there.
  • Consider zooming in, resizing and/or cropping pictures for use on the web to ensure the most highly relevant information is presented.
  • There are two main image compression graphic formats used on the Web. The first one is the GIF format (denoted by the.gif file extension). Use the GIF format for displaying non-photographic pictures in your web pages. It works best with black and white line art and simple coloured graphics (e.g. cartoons) because there is no loss in image quality when reduced to a 256-colour palette. For photographs that require better and more customisable compression and a greater range of colours to render skin tones in a more accurate way, use the JPEG format (denoted by the jpg file extension on graphic files). However, the more compression you give to JPEG files, the smaller the file and the more you will lose in image quality. Always save a JPEG file from an original picture in different compression levels and choose the compressed image that you think looks best and is suitable for your web page. Always keep the original picture in a safe place should you need to come back to it and make changes.

    UPDATE

    Because Unisys has patented the GIF compression technology in 1994, the company has conveniently decided at a late stage to charge software manufacturers and developers massive licensing fees for using the technology. For most average Internet users (i.e. the ones having no commercial interest in creating GIFs), you will probably not have to worry about this so long as you have already purchased a commercial graphic package to do the job for you or have acquired a freeware utility at the right time (before Unisys announced its intentions to charge license fees). If you have to buy a new software package today to create GIF images, you will probably notice an increase in the cost of the package. However some software developers trying to sell low cost software to the consumer but can't because of the license fees and some commercial web site owners using GIFs are moving over to the new web graphic format known as Portable Network Graphic (PNG). PNG is sort of the best of both worlds (i.e. JPEG and GIF). PNG files have a large colour range (more so than JPEG) making it ideal for photographs on the web, yet it compresses almost always 10 to 30 per cent better than most GIF files. And while JPEG cannot handle transparency regions like GIF can, PNG can handle tranparency regions just as good as GIF. Finally PNG files have the advantage of being able to control its own brightness using gamma correction. So you will never have to worry about an image looking too light on a Macintosh computer, or too dark on a PC.

    ## SPECIAL TIP ##

    Want to know how to send digitised photos to friends by email without worrying about the size of the photo files? Use JPEG (or JPG). Nearly all freeware, shareware and commercial graphic software packages should have this graphic file compression facility. Otherwise reduce the size and colour density of the images. Or use a combination of resizing and JPEG for the best results.

    UPDATE
    July 2004

    Following in the footsteps of Unisys, Microsoft Corporation is looking to have people pay for their patented FAT-file format used on PCs. One group is trying to oppose the move claiming the new license fee will stop rivals improving on it. We have to assume Microsoft is strapped for cash at the moment after making this decision.

  • There is no conceivably good reason why your graphic images must have a resolution greater than 92 dots per inch (dpi). The monitors for displaying web pages on most people's computers can't show the extra information contained in images carrying a higher resolution. In most cases, an image resolution of 72 dpi is probably more than adequate enough to do the job of displaying graphics on the web. When preparing images for the Web, scan them at a reasonable resolution like 150dpi or more to get the detail (in RGB or CMYK colour mode), and then reduce the resolution to 72dpi with the help of a quality graphic package.

    NOTE: When scanning an image, you may create an unwanted pattern effect called moire. This is caused by the dots in the scanned image becoming out of sync with the dots making up the printed image. To minimise the effect, scan the image at a high enough resolution of say 300dpi or more and reduce the image size to 92 or 72dpi.

  • The general procedure for manipulating and preparing graphics for print and web use is as follows:


    BITMAP/RASTER IMAGES

    (i) Work in the three-colour RGB environment for all colour images; and greyscale for all black-and-white images.

    (ii) Save images as TIFF files.

    (iii) To print sample images on a colour laserwriter, stay with RGB and let ColorSync do the matching of colours to your printer. When you are ready to print professionally (i.e. a coffee-table book or colour magazine), convert all images to CMYK and save as TIFF.

    (iv) For "standard" magazine print resolution of 150 lines per inch, all images should be at least 250 dots per inch (dpi) or better.

    (v) For web sites, all images need only be 72dpi.


    VECTOR IMAGES

    The following rules work for pure vector and a combination of vector and bitmap images:

    (i) Always save your images as EPS.

    (ii) Make sure black always overprints.

    (iii) Hairlines in an image usually don't print well on ImageSetter film. So set all hairlines to at least 0.25pt in width.

    (iv) Want to print the images in Pantone Spot Colour? Make sure you correctly choose and stick to the colour name as shown in the Pantone Spot colour tables. The colour name will appear on the printed film and the printer will know exactly the ink colour to use from the name given.


    DOCUMENTS

    The rules are the same for documents containing pure vector and a combination of vector and bitmap images. Just make sure you know whether the job is going to be printed as 4-colour CMYK mode (Process Separation) or the Spot Colour mode (i.e. no Process Separation). Convert colours in the document to the appropriate mode for printing.

  • To reduce the size of your image files even more, consider reducing the colour depth of the image. The colour depth of an image is measured in bits. So an image having a colour depth of 32-bits has more colour information than an 8-bit image. If your image is not a photograph requiring accurate digital colour reproduction on the web, try reducing the colour depth of the image with the help of a graphic package without sacrificing too much quality.

    To give you an idea of the size of your graphic files, use the formula:

    Image size=Width (in pixels) x Height (in pixels) x Colour depth (in bits).

    Therefore, an image that is 100 pixels wide and 100 pixels high with a colour depth of 8-bits has an image size of 80,000 bits or 10,000 bytes (roughly 10KB).

  • The quality of your Web images are not only determined by the type of scanner you use (how clean the glass top is, the scanner's optical resolution, colour density etc), but also the type of software (e.g. TWAIN driver) you are using to handle your images. Try to keep your software (i.e. mainly the scanner's software drivers) up-to-date to ensure the colours are accurate to the original.
  • If scanning images from film, avoid negative film (C-41 and black & white types) unless you want your scans to appear much grainier. Either try to scan a large print made from the negative film, or use positive "slide" film only.
  • To reduce the graininess of your images even further, apply the Despeckle filter in Adobe Photoshop or similar graphic package to the individual colour Channels where the grain shows up the most. Then click on the Combined Channel to reassemble the image once more for a quality result.
  • When scanning images, get your hands on the raw full colour (CMYK or RGB) data produced by your scanner before any sharpening, resolution reduction or other filter is automatically applied to the images by your scanner and graphic image software. In that way, you can see exactly what you are getting. Then it will be a simple matter of deciding how much sharpening you want to do to the image, or whether you want to make a black and white version of your colour image etc.
  • A GIF image can be "interlaced". All this means is that a rough look of the image will be displayed on the screen immediately and then the image will get progressively sharper and more detailed as the Internet browser downloads more and more information. This is useful if you want your readers to know the image is being downloaded. The only drawback with this feature is that the image file size will be larger. If you want images to download as fast as possible, avoid interlacing. But if your web pages are going to be downloaded fast on a digital network, interlacing will be okay and helpful to your readers.
  • Keep table formatting in a web page simple or it may take some time to render them properly. If using a table at the top four inches of a page, make it so simple that it will appear on screen quickly.
  • Show clear signs of where to click when navigating through a web site/page. But don't go overboard with heaps of navigation buttons as most people tend to use the Forward and Back buttons on their browser toolbar as a simple navigation solution as well as a safety feature when navigating through a Web site. On the other extreme, never design a web site that does not have any navigation buttons because not everyone is proficient in using the Forward and Back buttons on their browser toolbar.
  • Mouse clicks are often seen by visitors as a serious obstacle to an enjoyable web surfing experience. To make the Web experience a truly pleasant one for your visitors, minimise the number of mouse clicks required to navigate through a site in order to find the information they want. Consider as a possible solution to this problem by placing the most common and useful navigation buttons on all Web pages, and why not keep the number of web page levels on your web site to a minimum (i.e. you should not have to hide HTML files inside several nested folders).
  • Remember, a web site is not only a promotional tool, it is also an online information tool as well. So make it easy for your readers to find information quickly. In fact, it should take no more than 30 seconds for a reader to find any information in your entire web site. That is now becoming the norm. As Simon J. Bevan of the Kings Norton Library in Cranfield University said:

    "The secret of an effective online tool is to allow users swift and easy access to the data." (3)

  • Part of that ease of use should also include the use of simple icon/picture previews (or choose clear "hyperlinked" words) to give some indication of where a link will take you before you have to click on the link.
  • Give some indication of who owns every page on a web site in case a reader happens to browse for the first time somewhere in the middle of the site. Consider, as a possible solution to this problem, placing a logo and/or name on every page and make it link to the home page so that people can quickly work out who owns the site and how to start from the beginning.
  • For large web sites with more than a hundred pages or so, a means of searching the information within the site (e.g. an index page or search engine) is helpful. This search/index page should be linked by a "Search" button on every page.
  • If you intend to sell something over the Internet, don't let your potential customers see any forms at the start of your Web site unless you can hide it at the end. If they are interested in seeing a form, they will decide when and where to go. Just concentrate more on greeting your customers with a welcome message, followed by a concise list of all your products and their prices, and make the entire experience of browsing through your Web site for your customers a truly positive and simple one.
  • When designing forms for customers to fill out, determine which information you absolutely need. When customers are making a financial transaction online, all you should need to know about the transaction is the name of the customer, billing and shipping address, email address, credit card number and expiration date, and the name of the person written on the credit card.
  • If you need to know more about your customers, give them the option to decide whether they want to give more information about themselves. Ask them the basic interactive question, "Would you like to provide some additional information that would help us serve you better?" Before your customers can have a chance of saying "Yes" to this question, you must go one step further by explaining exactly why you need that information and how it will be used. If necessary, publish a Privacy statement on your site to show how responsible you are with handling this kind of potentially sensitive information. And tell your customers whether you intend to sell or pass on that information to others in the future.
  • If customers are required to fill out a form, keep it concise. Make sure the form can fit on one page or screen.
  • Give every Web page on your site a simple page title. The title should explain precisely what the page is about. Use subheadings within a page to help break up large chunks of information to facilitate quick scanning of the page for your readers. Or consider creating additional links to other web pages to help discuss these subheadings to greater length.
  • Some of the best home pages generally lead with a catchy headline, followed by a short introduction of what the page or web site is about, then a list of clickable hyperlinks underneath with a small picture next to them to make it quick and easy for readers to know what the hyperlinks are about.
  • Keep the number of hyperlinks on a page to a minimum unless it is necessary to have lots of them. If you have to include lots of hyperlinks, keep them organised in such a way as to help readers find the appropriate hyperlink they want. The reason for keeping the number of hyperlinks on a page to an absolute barest minimum is because there has been research done claiming the average person can cope with a maximum of five choices at a time. Whether this is true or not, certainly the less information a person has to sort out in his/her head of deciding where to go, the more enjoyable is the web experience of that web site for the person.
  • Keep text information to an absolute minimum where possible. If a simple picture can explain the same idea in a more interesting and quicker fashion, then use it. But always accompany pictures with some form of text for those who decide to browse in text-mode.
  • Although minimising download times is critical, the judicious use of graphics or pictures on a web page is actually a welcome relief for many visitors. It relieves the eye from having to read large slabs of text. Just take a balance between text and graphics to achieve maximum results for your audience.
  • The language used in writing your web site should be simple and easy to understand. This is an important issue to bear in mind when designing a Web site as not everyone who reads your site is a literary genius or have the same level of command as you do with your own preferred language. In fact, it is likely that many of your readers will come from a country whose language is not the same as yours, but may know just enough to understand what you are saying.

    Percentage of English and Non-English speaking backgrounds of Internet users, June 2000.

  • Because your readers are probably already up to their necks in information after reading a few web pages, you should construct the sentences on your web site in such a way as to make them easy and quick to communicate the essential ideas. Keep your sentences short and snappy. Use where necessary bullet points, and include headings and subheading to help break large chunks of information into smaller and more manageable parts in order to facilitate rapid scanning of your web pages.
  • For people with mental retardation, partial blindness or other disabilities or even children with learning difficulties, use large print for web sites, numerous illustrations and videos, and a reading level that is simple and easy to understand. Be prepared to use graphic icons instead of words as a means of navigating and summarising ideas. Use audio recordings to help make it easier to know what's on the web page.
  • In Australia, there is now a legal incentive to make your web pages "accessible" to the following groups of people:


    1. Users with visual, auditory, cognitive and mobility impairments.

    2. Elderly people with similar disabilities mentioned in 1.

    3. People using older browsers.

    4. People using mobile devices.

    5. People on slow connections.

    6. People who browse with graphics turned off.

    7. People in noisy or poorly lit environments.
     

    If, as an individual or organisation, you wish to publish a Web page in Australia by placing the web page on an Australian server, please be aware that you must now comply with the W3C web accessibility guidelines enacted by the Australian Federal Government in the Disability Discrimination Act (DDA) as of 2002. Any individual or organisation who fails to provide adequate accessibility could face legal action by those parties who feel they are being discriminated against by any of your web pages.

    However, don't feel frightened off by the legal mumbo jumbo. This kind of legal action can only take place (i) if the parties concerned have exhausted all other avenues for improving the accessibility of the web page(s), and that means evidence of contact with the web publisher via email and traditional means; and (ii) the web page(s) is published on an Australian server.

    The only thing you may have to remember when publishing web pages in Australia is keep your HTML simple, use a large enough font size for your text, and use a fluid page design using the TABLE command or other means for maximum accessibility.

    NOTE: There are people who will provide a testing service to determine your web accessibility. These people will check for things like validation of style sheets, validation of HTML used, testing the web pages with speech recognition software and screen magnifiers, and so on. If you really must contact these people to help make your web pages safe from potential litigation, check your local Internet Industry Association and ask for someone who will provide the service.

  • A web site is a constantly changing medium requiring regular updating and improving of your communications to others online. Hence you are allowed to make the occasional spelling mistake or incorrect use of grammar. But do make every effort to regularly improve on your communications. And make it clear that any misinterpretation in your communications made by readers will not be subject to possible legal action. Make it clear that your information is only a guide and further clarification of your information should be obtained by other means.
  • The photographs you may use on a Web page should look good on different computer platforms, the primary ones being PC and Apple. This is because Windows displays a slightly different gamma value whereby images displayed on a PC will appear slightly darker than on a Macintosh computer.
  • The pages should work on different internet browsers, the primary ones being Microsoft Explorer and Netscape Navigator.

  • SOURCE: Interse, November 1996

    SOURCE: UK magazine .net, May 2000.

  • The pages should work on different-sized monitors (both in resolution and physical size). In the web designing world, this is called liquid design as opposed to fixed-width design where the page layout is independent of the window size. Most web sites today are designed to be viewed on a fixed-width window size of 640 pixels wide (or even less with the advent of handheld computers and Internet-ready mobile phones). But there are an increasing number of web designers who are using their big monitors of 800 x 600 pixels or more to design web pages. The result is often a very wide web page that has to be scrolled to the right when reading all the information. So test your web page. Go and visit some of your friends or attend the local library to find an Internet-ready computer to help view your web pages using different monitors.
  • To give your web pages that liquid design effect, use the table command in HTML and set the width of the table as a percentage of the width of the screen. In that way, you can force your text and other information into all sorts of different window sizes. Otherwise the only other alternative you have is to resort to Cascading Style Sheets (CSS). However, Microsoft Internet Explorer versions 4.0 or less and Netscape Navigator version 5.0 or less either don't support CSS, or if they do, it is often very limited and do not display information in the correct and standardised way as the web designer has intended. Although it is now conceivable for the latest Internet browsers to display Web pages correctly using CSS without the use of tables in HTML, for most people it is better to stick with tables in HTML until enough Web users have downloaded the latest Internet browsers.
  • Although your aim is to fit your information onto one page or screen size, there is no rule that says visitors must never scroll downwards (or to the right if you must). Just make sure you don't force people to scroll without a good reason (e.g. for better design reasons or whatever).
  • Create easy links from any page on your Web site to the main home page, the contacts page, and all the essential products and/or services provided on the site if any.
  • It is a particularly good idea to keep all your primary links to the contact page, the order form page, the index/search page, your products page and so on, in one central location on a web page called a menu. The menu can be placed along the top or left-side of a page. But don't put your menu on the right, or it may not be seen by readers using a small screen size to view your pages.
  • Keep the category names for your menu short and snappy. The word or words you use should be simple and easy to remember and understand.
  • The contact page should include addresses, phone and fax numbers. All telephone numbers must have international dialing codes added to them.
  • For large web sites, add a "What's New" page for visitors who want to know what has changed. This will save time and money for your visitors when they need to find something new fast.
  • If you get lots of common queries from visitors about your web site and/or your products and services, consider the inclusion of an FAQ (Frequently Asked Questions) page. Or alternatively, redesign the web site to help answer all the most common questions from your visitors.
  • Don't mess around with the link colours. Everyone has come to accept blue as the standard colour for all unvisited hyperlinks, and purple for visited hyperlinks.
  • In keeping with standard colours, you should also keep an overall consistent style throughout your web site. For example, not every font you may use in your text is available to all visitors, so keep it simple. Avoid using too many different fonts. Just use a common and readable font available to most users like Arial or Times New Roman. And make sure the font size is large enough to be legible on screen, especially for those users who may use a large, high-resolution monitor. As for navigation buttons, it is a good idea to reuse the buttons on all pages where you need some form of navigation.
  • Reusing graphics from other web pages makes sense from a technical point-of-view when minimising the download times for all your web pages and not just from a design point-of-view when maintaining overall consistency. By reusing the same graphics for navigation buttons, logos and so on, the browser will download only once the graphics and store them in a "Cache" folder on a reader's hard disk. So everytime a HTML page looks for the same graphic files, the browser will use the copy of the images stored in the Cache folder first before it attempts to download them from your web site. This makes for a much faster download of your pages.
  • Keep file names for all your HTML documents short and sweet if you wish to improve download times. This is particular important if you are using an invisible spacer GIF to indent text or keep graphics properly separated. For example, if you name the spacer GIF as SPACERPIXEL.GIF and use 20 of them throughout a page, you will take up 300 bytes of information. But if you name them as S.GIF, your Web page will take up only 100 bytes of information. An incredibly big saving indeed if download times are critical for your web site.
  • For successful online business activities, the world's best e-commerce sites always have clear, well-defined paths to making a transaction.
  • Use appropriate combination of 'easy to look at' colours. Avoid a black background with red or white text if your web site is going to contain lots of text to read. And please, oh God please, don't use red text on a blue background or vice versa. It can make some people go blind just trying to focus on the text properly!
  • Make full use of the white space on a web page to position all your text and other design elements in a neat and simple fashion. This will make it easier for your readers to browse through and understand your Web site. In the old days of desktop publishing, people love cramming as much information as possible into each page using the old paper format. Nowadays, the reverse is true with web pages. Because web pages can be of any size for no extra cost, it is better to make use of that space to make everything look simple, clean and easy to read.
  • Most web pages are divided into four main parts: (i) the top or header section for identifying the page and the name or logo of the organisation or individual; (ii) the left-hand sectionA containing the navigation strip; (iii) the content section for holding the main source of information for the web page; and (iv) the attribution or footer section usually containing a copyright declaration, contact details, disclaimer about the accuracy and/or how up-to-date the information is, a page counter, and/or ownership of the web page.
  • There is now a trend to develop a one-screen-sized "map" of your entire web site in the home page. In this way, people can find everything in the web site with a single click of the mouse button and to know immediately who owns the site and how to contact the owner. So don't be surprised if you start noticing a lot of fancy graphical-based home page with a few or lots of links on it and the rest of the web pages in the site being simple and text-based for easy downloading and printing.
  • Once your web pages have been created and uploaded to your web site, try to maintain the same URL for the pages. Few things are more annoying than for a reader to bookmark a favourite web page or article on your site, only to find a few days later that it has moved to a different URL. And,
  • When the web site is up and running, try to keep the information up-to-date and/or changing to prevent visitors from getting bored with static sites. While it is still a good idea to maintain stable and dependable information for your visitors to apply for many years to come, every now and then do attempt to improve, make more interesting and funny, and/or add new information to keep the visitors coming back.

But perhaps the number 1 rule in the Internet game when laying the foundations for designing a successful Web site is know your purpose. Rule number 2 is speed; followed by good presentation and good content as rule number 3. As one of UK's best-selling magazine, Personal Computer World, stated:

"You also need to have a long hard think about why you're creating a website. Lots of websites, from tiny, one-person operations to multi-million dollar super-sites, come unstuck because this has not been fully thought through. Don't create a website just because everyone else has one. For a site to succeed it has to serve the needs of the company or individual who's created it, but it also has to cater for the needs of the people you want to visit it." (4)

Finally, World Wide Web or the World Wide Wait, if people cannot download your main front page (or any other page for that matter) in about 28 seconds (maximum), you might as well forget about creating a web site unless it is for yourself and your friends. As Personal Computer World states:

"...poor website performance will lose you more visits than any other single factor." (5)

Yes, but I'm not good at web page designing!

So are we and quite a few million other people online from what we can observe. But if going to Art school to learn graphic designing does not appeal to you, then the best tip we can give you is to look at many different web sites created by different people. Then ask yourself, "Did that web page look good?" (your emotional response) and "Why did it look good?" (your technical response). Once you have answered these two questions will you have some idea of what graphic designing on the web is all about.

What topics should I talk about?

Well, practically anything really. So long as people are aware of the presence of your web site, there should be no problems in finding at least one person out there to read your pages no matter how mundane or ordinary your site may look.

However, if you want a lot of people to visit, read, and perhaps be captivated by the content and presentation of your web site, then you will need to understand the profile of most Internet users for an idea of what type of content and presentation will work online, followed by the ability to make things look good. For further information on the content of your web site, we suggest you click here for the page containing an essential look at the profile of most Internet users.

Alternatively, ask your friends to decide from a list of topics you've prepared on paper what they think is interesting. Be ready to act on the advice of your friends. And don't be afraid to push aside those topics considered uninteresting or unnecessary. Of course, if you feel absolutely certain the topic(s) is important for everyone to read, then include it. In the end, you must decide what you feel and think is best for your site and for the Internet community as a whole.

To give you some idea of what people want to read online, consider these words from Alex Kiam, author of the popular publication entitled, Australian Beginner's Guide to Making Money on the Internet:

"Online users want:

  • Useful information.
  • Something for free.
  • Entertainment.
  • Sex.

By fulfilling these desires, you can draw people to your Web site of their own volition." (6)

Should I design my web page first and then my content, or vice versa?

This is the proverbial "chicken-and-the-egg" situation. Which starts first?

A peruse through other people's web sites can reveal some interesting results. If a web site emphasises good design, there is a chance it will lose out on good content. Similarly, there are sites with great content, but have pretty lousy design.

We recommend taking the balanced approach when designing your web site because the world's best web sites will follow this balanced approach to good content and good design. So where do you start?

It doesn't really matter. You will eventually come back to where you started in the first place. If you like, start from the content and explore all the possibilities in this area, but always bear in mind you are looking for a good relevant design to make the content stand out well, easy to find, and present itself nicely. Eventually you will start to create ideas of how to design your web site around your content.

To ensure the design is really good, swap over and explore all the design possibilities. Perhaps you will see an alternative design which is better. Or maybe you will see the need to go back to your content and improve on it. What you hope to achieve in the end is a unified web site that ties up your content and design in a most logical, creative and emotional pleasing way.

You will sense this moment of achievement when you are finally pleased with your web site design and content and know that you have explored all the known possibilities when creating a quality web site.

Whatever content and design you come up with, just make sure it is interesting, fun and creative, and not just practical. Remember, few sites score highly on both an interesting content and an appealing design. So make the most of it and try to take the balanced road in your attempt to stand out from the crowd.

The basic principles behind designing web pages

Okay. So the things to remember when designing web sites are essentially this:

  1. Keep it simple;
    By keeping things simple, you will reduce download times (especially while the bandwidth is limited and not everyone can afford the fastest and best computers and high-speed connections in the world).

  2. Provide good content;
    By providing good content, people will be interested in your web site and will stay longer to read the information you have.

  3. Make it look good (without over emphasising all the design elements on a page).
    By making it look good, you will make it easier for people to navigate, find, understand and remember the purpose and content of your web site.

  4. Have someone check your web site regularly.
    By having someone (or something) checking your web site regularly, you can ensure your customers are appropriately helped along the way with prompt and professional service.

And if you intend to place email address(es), postal address and telephone numbers on your web site, make sure it is clearly prominent or accessible (via a link) from every web page, and there are resources to back it up (i.e. there is someone or something regularly checking for email messages and responding to calls from customers).

What is the most expensive part of designing a web site?

Creating a Web site is actually the cheapest part of getting on the Web. If you want someone else to do this job for you professionally, expect to pay up to $5,000 (i.e. basically chicken feed for most businesses!). However, the costs really start to mount if you employ an outside techno-talent to manage all your email, monitor traffic and constantly update web site content. The price can then climb to $50,000 or more per year! If you wish to reduce the financial headaches of creating and managing a web site:

  1. Create the web site yourself;
  2. Ask someone else to create a web page template using Macromedia Dreamweaver or other similar web page designing software. In that way, you merely add pieces of text and graphics to the template as you require;
  3. Provide only the information you are able to support;
  4. Use software tools to automate web site management and common customer enquiries (e.g. online live databases that link up to different kinds of information from different sources and keep it up-to-date); and
  5. Pay certain Internet users/part-time assistants outside the business to help manage your customer enquiries (i.e. outsource the support work).

Estimated percentage of the commercial costs for properly putting a web page online and maintaining it.

Before choosing someone else to create a web page for you, ask the person to show you an example of his/her work.