Unit 14. Other Features (IV)

Web Page Resolutions


To create a web site you have to remember that it will be visited by many users with different size and resolution monitors.

It is impossible to make a web site with the same view in all the different monitors, but you need to try make them alike.

The most common resolution is 800x600, so you will need to design the site with this resolution. This means that you will need to create the web site in a monitor with this resolution to clearly view how is it going to appear in the browser, and to be able to distribute the content the in the best possible way.

Tables are normally used because they are very useful to distribute the page content.

As you know, the table's size can be defined in pixels or as a percent. When you define it in pixels, the table will be seen the same size independently of the window browser's. However, when the table size is defined in percent, the table will be automatically adjusted to the browser window size, which implies that the content will be out of place.

Click here to check a site with a static size table in pixels. Imagine that the page has been designed to be seen in a small monitor with low resolution, who's size is equivalent to the opened browser's window.

If you modify the window size, you'll see tables are always the same size. The inconvenience is when you maximize the browser window (equivalent to viewing the site in a big monitor with high resolution), because right at the tables will be an empty space.

Click here to check a site with variable size percent table.

If you change the window size, the tables will be adjusted. Using tables with changing size may be problematic at the time of maximizing the window as the tables will be out of place.

In the beginning you may feel that it's better using tables with static size even though this implies an empty space on the right in the case of high resolution monitors. But by practicing this, at the time of working with tables you can fix the problem and define the sites with percent size, and take advantage of the width when monitors have higher resolution.

Not only the table size can be defined but the also cell's size. The same as in the tables case, a cell's size can be defined in pixels or as a percent.

The cell's size will be specified by W (width) and H (height) values through the properties inspector. Normally only the width is specified.

Cells W and H values are in Pixels. The cell in the previous image has a width of 208 pixels. To make for example the width 25 percent of the table you would have to write 25% in W.

Changing cell's sizes, and knowing their contents (images, text right aligned, text left aligned, big font text, etc) you can make the appearance be alike or barely affected by the change of the browser window when viewing the site in different size monitors and resolutions.

  Unit 14 exercises .

  Unit 14 evaluation test

  Ir a la página anterior Índice del curso  Ir a la siguiente página  

Page 14.4

Legal warning: Authorised on-line use only. It is not allowed the use of these courses in companies or private teaching centres.
© aulaClic. All rights reserved. Reproduction in any form whatsoever is prohibited.