Who we are


Web Hosting & System News Schedule

News  Oil  Exchanges & Economics

Weather Storms Mosaic Satellite Lightning Hail Snow Ice Air Temperature Tropical

Online Payments

Applications - Latest versions  Firefox Add-ons Thunderbird Add-ons Chrome Add-ons

Open Source Applications

Open Source OS/GUI

Viruses, Spam & Security

RSS News feed

Hobbies / Guinea Pigs

Utilities  RF Safety Calculator

WebCAM(1) (2)  (3)  More


 user login


 W4/VP9KF radio


Do’s and don’ts of webpage design

WYSIWYG Design tools Just about all of these have their own problems, but you can try the following for free:
 Nvu. Simple to use. Tables are a bit difficult to handle
Komposer. Derived from Nvu, with many bug fixes.
Trellian WebPage.

FTP (upload/download) tools
FileZilla (not a Mozilla product). Easy to use. v3 still being improved.

Other tools
OpenOffice. Useful tool for changes and conversion to PDF files.
LibreOffice. Useful tool for changes and conversion to PDF files.
TextPad. Very useful text editting tool for code patching.
JAlbum. Neat way of making slideshows on the web Use the Java versions only.

Top tips:

1. Fast Download

6. Absolutely minimise new technology

2. Usability

7. Avoid frames

3. Navigation

8. Keep it up-to-date

4. Scrolling

9. Branding

5. Simplicity

10. Links

1. Fast download

Ensure that your site downloads quickly. Within 10-15 seconds at an absolute maximum, preferably 8 seconds or less. Assume that your user is on 56k dial-up and NOT on broadband aDSL or Cable. Therefore the total file size of a page (including graphics) should never exceed 30k.

To decrease file size and increase download speed - use as few graphics as possible, optimize the graphics you do have and create clear, concise HTML. Always include width and height attributes in the <img> tag so the browser can download the rest of the page while waiting for graphics to download. Include alt text in the <img> tag so that the page makes sense before the graphics download or if the user has graphics switched off.

Server side “includes” speed up download times as the included file only needs to be downloaded once to be used on several pages. This happens "server side" so that download time to the user is negligible. Style sheets also only need to be downloaded once. Using one means you don't have to specify style within the HTML page, which makes for a smaller html file size.

2. Usability

If your web site is not user friendly, visitors will not be able to use it and they will become frustrated and will not return to it. It is return users who will buy your product or service, not a unique user who merely visits your site just once. The key to good usability is found in easy to follow navigation and simple site structure.

3. Navigation

Poor navigation is where most unusable sites fall down. At any one time, the user should be able to reach any level of the site and clearly see where they are in the site's hierarchy. A well designed site should have a logical hierarchy of more detailed information as the user delves down into the site.

The main home page to a site should have links to a variety of levels, usually in the form of a navigation panel. On subsequent pages, the user should be able to reach other pages of the same level as well as be able to go up to the previous level and always be able to get immediately back to the home page.

Make sure the page title, located in the head information of your HTML, shows the page title and where the page is in the site. This is the title of the page that is visible at the very top of the browser window. This is useful to users who bookmark your site and ensures its name makes sense in a whole list of bookmarked sites.

4. Scrolling

Never use horizontal scrolling, users find it annoying - check your site on machines with smaller screens and with other browsers just to be sure. Avoid vertical scrolling, especially on the home page. Only 10% of users will scroll down further than they can initially see, so keep the important information and navigation at the top of a page. This is beneficial to search engines too, as they often only index the first portion of a page. What you put at the top of the page can entice users to scroll down to read further. If your most important content is hidden "below the fold", most users will never even see it.

5. Simplicity

Keep your site simple. Use white space carefully - don't waste it by having fixed width tables so that much of the screen is blank in a wide browser window. However, make sure you don't have more than 12 words to a line of text - it is difficult to read if there are more. Don't have gratuitous animated graphics, scrolling text or other moving items all over the place - they draw attention away from the content. If an animated graphic is used, only loop it once so it doesn't distract the user from the rest of the page.

Don't overcrowd a page with too much information and too many links, the user won't know what to look at first. However, one exception to this is when the information is technical and extremely useful to your visiting surfer.

6. Absolutely minimise new technology

Don't ever create sites that rely entirely on new technology, such as Flash, Java Script or Java. Many users won't spend the time or know how to download the plug-in to view the site. You can't guarantee all users will have, or want, the plug-ins, and you will "scare off" potential customers. It's more important to have people actually use your site, rather than simply ooh and ahh at its special effects. Use new technology sparingly, especially because it increases loading time dramatically and because it often causes browser crashes.

7. Never use frames

Most use of frames on the web is unnecessary, especially when it's been used simply to separate the screen into content and navigation. This is often confusing for users, can create unnecessary scroll bars, destroys the URL for people to e-mail the current page to someone, or bookmark it for future use. The URL they save ends up being the top of the frameset, not the one they wanted. This could lose you customers/visitors who don't want to trail through the site finding the particular page all over again.

Frames are also detrimental to search engine listings. Search engines can't spider a frameset, directories often look on them as bad practice for the above reasons.

8. Keep it up-to-date

Keep the content on your site current. Most good sites are constantly updated, so if yours is out-of-date, users won't return. Encourage people to come back with "news" or "highlights" sections on your home page which have the most up-to-date content. If your site has outdated material, users won't need to return as it appears they saw all there was to see the first time. This is true even for large sites. However, don’t make every page a nightmare to update. Keep the majority of information pages static (no maintenance) and change only a small number of very important “newsworthy” pages.

9. Branding

Maintain your company's (or site's) branding across all pages of your site. If there is no branding on a page, users won't necessarily know they are still in the same site. This is especially important for users who have entered the site from an external site and will need to know which site they are in. This is also relevant for printer friendly pages where site navigation is less important. These still require at the very least a company logo or site name which is a link to the home page, preferably in the top left hand corner.

10. Links

To a user, links are the structure of the world wide web. A user doesn't care whose site they are on, just the information they require. Standardise your links to make user's lives easier. Always use blue for unvisited links and red/purple for visited ones and always underline them (unless in an obvious link bar at the side or top of the page). Don't underline any text which isn't a link. Make your company logo or site name a link on every page. If you're linking to an external site, display the name so that a user knows they are being taken off to a different site.

Users have become accustomed to these attributes and while your site may look prettier with different colored links etc, it can be confusing in that it's not obvious where they have been before. Going to a previously visited page is frustrating and time consuming. Most users don't have the time to go to every relevant link in your site, make it easy for them to browse through to the information they require. Don’t create circular links where your user gets stuck in a page and can’t get out again.

Finally, don't move links! By this we mean don't change the URL of a page. People bookmark pages which are relevant to them for a long time (sometimes years). If you move pages, you could lose a valued customer. If a site clean up is necessary, then activate a re-direct for that URL to the new page location. In addition, for sites with constantly changing home pages with news stories or press releases, always produce a permanent location for the whole story at the same time. Place a link from the abstract to the full story so people can link to this. Changing the URL of a page causes havoc in search engines, giving people searching for your product or information the frustration of thinking they found just what they wanted on Google and then finding that it has disappeared because you moved it.

Other tips!

Don’t use gaudy colour schemes.

There are plenty of terrible examples of this on the web. A lot of them hinge around using black backgrounds for their pages.

Don’t use large text.

When large text is used, it might be nice for those more senior in years, but it creates a very un-professional look and makes it look like you’re shouting! Large text should only be used in titles.

Don’t use weird fonts

Most windows machines come with about 100 fonts. If you have installed others on your machine and then use them in a web page, the receiving computer doesn’t know anything abut that font and will substitute, normally, Tahoma font (because it is the Windows default font used on the desktop icons, etc.).

Test your web page at any early stage of design.

Test and test often – after every upload of code. Test using different connections, but always test using 56k dial-up. Test with different screen resolution settings. Above all, test with Internet Explorer, Netscape, Opera  and Mozilla Firefox and make sure that everything works and renders OK. If you can, test with MAC OS-X and Safari and test under Linux with Konkeror or similar browser.

Use a relevant & tasteful background.

Backgrounds are very difficult indeed to design and test. Keep them simple. Fade them out much further than you would first imagine, otherwise your content will be overwhelmed by the background. Keep them small and highly repetitive. Test on several different types of screen – 15” CRT, 17” CRT, TFT standalone screen and a TFT and LCD notebook. You’ll be amazed at how the background takes on different appearances on each type of screen. Most of all, don’t go for a dark background, it makes the surfer think they’ve entered the black hole of Calcutta!

Here are some other useful tools and tips:

• Designing with colour
• Hexadecimal colours

Home  | Who we are  | Capabilities  | Web Hosting & System News  | News  | Oil  | Exchanges  | Weather  | Online Payments  | Applications - Latest Versions
Open Source Applications  | Open Source OS/GUI  | Viruses, Spam & Security Alerts  | RSS News feed  | Hobbies  | Utilities  | WebCAM  | Politics  | Software

© 2003-2017 Hintlink. All rights reserved. IP footer
User Agent: CCBot/2.0 (http://commoncrawl.org/faq/) IP Address: Remote Host: