Thursday, May 30, 2013

Rules of Website Design - Site Design Part 3- E-Business Success Blueprint Workshop - Part 14

Website Design Rules
Previous lesson...

Today I would like to give you some guidelines when designing your site and pages.

Content First,

you must remember that the content of your site must be interesting and worthwhile.

Your site must be original, sticky, current, and easy to navigate. You can accomplish this by including a message room or chartroom or a web based email service. It must also contain unique content that includes free products, information or a free newsletter. Visit these sites for more information,, and

You don't want to fill your page with fancy graphics that take ages to download - optimize your graphics.


Second, you must make sure that your site is easy to navigate and contains appropriate buttons and links. To help you accomplish this goal, you might consider using pop-up menus to help inform readers while keep your site clean. Pop-ups tend to be especially helpful if you have a large site and desperately want to include key information “right smack in their faces.” Information that you deem is important and information that you want them to be made aware of.

You can download nearly any script you might need for free from and

Make sure that the buttons or links to your pages are obvious. It is a good idea to also have text links to your web pages as well as buttons, for example at the bottom of each page. This is because some people disable images so that they can browse faster, particularly using mobile devices, and more importantly, some search engines do not follow hyperlinks from images, so when they spider your site, they will not pick up the linked pages.

Optimize Graphics

Always use .jpeg (.jpg) and .gif  or .png graphics for your images. These are the three file formats universally used on the web - basically because they take up less space without much loss of quality. This is where an image is reduced to its smallest file size while retaining its best quality. The basic rule of thumb is to save the images in .jpeg format for photos and use the .gif format for your logos, and other graphics.
Understanding the difference in how these file formats compress an image is important in designing good web pages.

If you find that these are not acceptable, you can also try out some free graphic sites as well as download trial version of software for creating graphics.

Also, make sure that you don’t include larger images as it takes too long to download and visitors may get frustrated. Don't fill your page with photos that are 600 x 48 pixels and don’t include unnecessary graphics on your page - they only take up space. You see, most visitors will not wait for such large graphics to download. This is because anything over 30 KB takes  longer to load, keep in mind that there is growing mobile market which still has lots of bottlenecks is it comes to download speed . For backgrounds, you should also consider large GIFs as it takes only a few KB by using one or two colors.

Other Design Considerations

There are a few other things to consider when designing your site:

1. Not all browsers see your web pages the same way. If you designed a great looking site using Microsoft Internet Explorer, try also viewing it in Firefox and Chrome - it might look different! In addition, not everyone has the same resolution screen. In fact, most people have resolutions below1280x800 pixel. Either way, you must test and tweak the site until it looks right in all browsers and at all resolutions. Therefore, make sure that you check the site from different browsers. If problems exist, fix them right away.

2. If you design with 800x600 in mind, your site should still look fine in higher resolutions. Bear in mind that if you have a lot of text, long strings of text are more difficult to read than shorter ones, but if you need to get around the browser size factor, you can use tables with widths specified as percentages instead of pixels.

3. HTML allows widths of tables and forms to be defined as a specific number of pixels, or as a percentage of the browser window. By using the percentage option, the elements defined are seen in relationship to the viewer's own browser window. If you specify 90% then you leave room for a margin.

When using percentages, you also need to test the page in various browser window widths to ensure that you get the desired layout. What appears on separate lines in a narrower width may be strung out in a single line across a wider screen.

But don't worry much about this. If you design your site for an 800x600 resolution, it should look good on most screens.


There is a place for using frames on the web. For example, you may utilize frames if you want a certain part of your site to be always visible without having to reload each time or if you want your site to always be visible when a visitor scrolls down the contents.
However, there are some disadvantages to utilizing frames. For example if you want to reference a particular page of your website in an email or newsletter, it will load without the frames and therefore without the navigation menu. Therefore you need to refer visitors to the index page.

In addition, some search engines find it difficult to index a frames site because they treat each frame as a link, however you can get around this by putting content which you want the search engines to find, in the <NOFRAMES> tag</NOFRAMES> which comes at the end of the page after the frameset. Before using frames, carefully consider whether or not your site will benefit or not. In my opinion, you should not use frames if you want to use your website as a marketing tool to maximum effect.

Next lesson...

Bogdan Fiedur Copyright 1998 - 2013 - All rights reserved . 

Enhanced by Zemanta

No comments: