Expandable Website Design:

Wednesday, October 28, 2009

While web designing and development strategies, the most important one is to make sure that the website fit all resolutions. This is due to the fact that we cannot say about the resolution being used by the user, so the website might not work properly to the user’s browser and resolution. Try out in all resolutions higher than 800 x 600 and you will find that it is designed to fit the page exactly.

Therefore, visitors who have higher resolution can see more content in one page which reduces scrolling. Most web sites are designed for only one resolution. They may look perfect in 800 x 600 resolution but if viewed in a 1024 x 768 resolution look a little empty. You'll find a lot of wasted space around it making the web site look quite small.

Step 1: Decide the lowest Screen Resolution

Before you start you need to decide on your lowest screen resolution. Your web site will have to be designed keeping the lowest resolution in mind. The common resolution is the 800 x 600.

Step 2: Design Your Web Site on This Resolution

Once you decide on your lowest screen resolution you need to design your web site for that resolution. Design your web site and export the images as you do normally.

Step 3: Converting your design to HTML

You need to work in terms of percentages and not pixels. If you work in pixels you are giving an absolute measurement to a table, whereas working in percentages gives a relative measurement. The table will be a given percentage of the screen resolution.

Step 4: Insert images and content

Once you have designed your tables in terms of percentages you need to insert your images and content. A graphic designing company makes sure while customizing the images for certain website that these must behave good in all resolutions.

Step 5: Testing your site

The last step is to test your site in all the resolutions that are available on your computer. To do this you need to:

1. Right click on your Desktop and click on Properties
2. Click on the tab Settings
3. Under Desktop area click shift the scale to 800 x 600, 1024x768 or higher if possible
4. Once you have chosen the resolution you want to check the site in, click on the Test button
5. If you can see the bitmap clearly you can click on Apply

Check your site in all the resolutions and if it is working fine you've successfully completed the website design and development process compatible to all resolutions.

0 comments: