| Web Menus |
Expand Menu Studio
*NEW* Construct and maintain multi-level menus with this complete menu solution. Includes a menu editor and 50 menu design templates.
Read More...
Mercury Buttons
Dynamically build graphical web buttons and tabs in just minutes. No images required!
Read More...
Fission Menu
Quickly turn a single image into a stylish themed panel of web buttons with the minimum of effort!
Read More...
eXpand
The classic 2-level menu applet. Dynamically expand sub-menus as you move over top-level menus.
Read More...
|
| Banners |
Spotlight Banner
Create fantastic eye-catching lighting effects with the Spotlight applet.
Read More...
|
| Security |
Abstract e-mail
Abstract offers a truly simple solution to protecting e-mail addresses on your site.
Read More...
|
|
|
Web Site Designing For Beginners
Designing and building a web site can be an exciting - but daunting - prospect if you've never built one before. It's very easy to get carried away adding impressive graphics but neglecting the important fundamental building blocks that need to be put into place first - a bit like decorating a house before you've finished building it.
There are some critical areas that need to be thought about as they can have a huge impact on the effectiveness of your site. So let's dive right in and learn how to design a great web site:
Visual Design Many people enjoy the visual design aspect of building web pages. Choosing images and the look of the site is great fun. However, a little bit of careful thought early on in the site development can prove to be beneficial later on.
We'll discuss three factors that you need to be aware of before building your web pages:
- Use a consistent font type
- Stick to just a few colors
- Make efficient use of images
One of the mistakes beginners often make is to have a mixture of font types on their web pages. This can end up making web pages look amateurish and unprofessional - it is best to stick with one specific font type throughout the entire site. Different sizes, weights and colors can still be used to differentiate between sections of text, but the same font type throughout will give your web pages consistency.
Another mistake to make is to use a huge variety of different font colors. This simply makes pages confusing to read. It's best to choose three or four colors for your basic color palette and then try to stick to them throughout your site. Again, this leads to consistency throughout your web pages, and your visitors will find the site simpler to read.
It's very tempting to add some fantastic images into your site, isn't it? Logos and banners tend to appear on most pages and can be great for drawing attention to specific areas. But you need to be very careful. Not everyone has a super-fast Internet connection. You need to consider this when selecting the image formats you're going to use.
Images come in a variety of formats. The most common are BMP, GIF and JPG. The trouble with BMPs is they're stored in an uncompressed format, and are thereforewellhuge. Using BMP images will have a terrible performance consequence for your visitors, as will they have to wait much, much longer for your web pages to load.
GIF and JPG images are, by contrast, compressed. This means they are much smaller than the equivalent BMP images. Depending upon the complexity of the image though, either of these two image formats could end up creating a smaller image.
What could swing your decision, though, is the fact that the JPG format is a 'lossy' format - because of the compression method used, it changes some of the pixels in your image to further enhance the compression. This 'lossy' compression isn't too noticeable on things like photographs or complicated images. However, it is fairly obvious when used on things like web buttons and logos.
A simple rough guideline would be to use GIFs for images that need to appear sharp and clear, and use JPGs for images that are photographs.
Structure And Navigation You may construct some great pages within your site but if visitors find it hard to move around and find information, they won't be spending very long there. It is worth sitting down with a piece of paper and sketching out how everything will link together in your site before you start constructing it.
- Start with your home page
- Group areas together logically
- Streamline your navigation
Every site should have a home page - an entry point leading your visitors to your other pages. If you're designing a commercial site, you should consider also including an about page, containing a brief description of your company.
Jot down simple headings of what you're intending to put onto each page. Then group together the related areas. The areas should have obvious headings. If, for instance, you are designing a site for a games company, you'd probably have separate areas for game information, downloads and purchasing. Then, you'd have groups of pages for each of these areas. Your sketch should now give you a good idea of the structure of your site.
You should try to make your most important pages accessible within two clicks from anywhere on the site. You don't want visitors to have to hunt around needlessly for information - you should be leading them to it as simply and quickly as possible.
There are two common techniques that you could employ here. You could just have a simple navigation link area with your main headings on, leading to other pages with more navigation links on. Or you could have a more complicated menu arrangement (such as a dropdown menu) where your visitor can easily drill down through your menu structure without having to leave the page.
You should make your navigation links as obvious as possible. Placement is important - there's no benefit in hiding your main navigation links away in a corner. Traditional places for your navigation links are at the top or left of your pages. That way, you leave the majority of your page free to place your content on.
When creating buttons that you want your visitors to click on, add a shadow to the button or 3D effects to ensure the button stands out on the page. You need your links to be obvious to your visitor. Similarly, with text links, make sure all the links are a consistent colour.
Remember, if you use JavaScript or Java applets to activate your links, these are not picked up by automatic search engines. If search engine ranking is important to you, you should also place standard HTML text links somewhere on your page.
Content The layout of your textual information can make a big difference to the look and feel of your pages. There are a few key factors to take into account:
- Don't force visitors to scroll horizontally
- Break up large blocks of text
- Enhance text with images
- Use bullet-points
Be aware that the maximum page width you should design for is 800 pixels. Any wider than this and you will probably be forcing your visitors to constantly use their horizontal scroll bar to view information on the right-hand side of the page.
Vertical scrolling is perfectly acceptable, but horizontal scrolling will simply make your page awkward to use and should be avoided wherever possible.
Too much text, all crowded together is extremely difficult to read. To improve the readability of your page, you should consider breaking up large blocks of text into logical areas with appropriate headings. It is also worth shortening paragraphs wherever possible or breaking them up into separate ones. You will find this will make your pages much easier to read.
You can also add interest to your page by adding relevant images. When used wisely, they can both enhance the text and provide a useful visual bookmark for the reader. You should, however, refrain from using too many images or ones that are not relevant to your text. You'll simply be wasting important space on your page and making the page take longer to download.
The average web visitor will not have a long attention span. It can therefore be useful to use bullet-points rather than lengthy paragraphs. A quick list of short bullet-points is extremely effective and can immediately convey a huge amount of information to the reader.
Conclusion Armed with these basic design principles, you should now have a clearer idea of the important factors you'll need to take into account when designing your web pages. Experiment with your web pages, learn by looking at other sites, and you should then be prepared to create some fantastic web pages.
This article was brought to you by Wibbleware, providing innovative Java applets to enhance your web pages. |
|
|