Unit 14. Other Features (IV)

Web Page Resolutions


When creating 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 to make them alike.


The most common resolution is 800x600, so you will need to design the site to 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 in the best possible way.

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


As you know, the table size can be set in pixels or as a percent. When you set 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 a lower resolution, whose size is equivalent to the opened browser's window.

If you modify the window size, you'll see tables always with same size. The inconvenience is that when you maximize the browser window (equivalent to viewing the site in a big monitor with higher resolution), the right of 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 the width 25% 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 sized monitors and resolutions.

  Unit 14 exercises

  Unit 14 Test

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

Page 14.4