We use tables to organise our pages neatly.
Images, text or animations can be placed within
the cells of our tables.
We can make the borders of the tables invisible.
It is possible to set the width and height of the
tables by pixels or percent of the screen.
For small tables it is fine to use pixels to size
them, for larger tables it is better to use percent.
The pixel size of users monitors can vary greatly.
Older computers use 800 by 600 pixels, or even 640
A common setting is 1024 by 768 pixels.
Check the pixel setting on your computer, by right
clicking on the desktop and clicking - settings.
If you set table size at 800 or 900 pixels, it will look
fine on some computers but will be untidy on older
machines. For this reason the percent setting can be
used. About 70% to 90% width for a reasonable sized
table should be fine.
Create some tables in Dreamweaver and preview
To create a table select the Table icon, below:
Remember when you create a table, columns go
down (vertical) and rows go across (horizontal).
If you are using your table for page layout, the
border setting should be 0. If you want to display the
borders, use 1, 2 etc.
Today we will create a simple photo gallery.
The first page will display small versions of your
When you click an image it displays the full size photo
in a new screen.
Also include BACK, NEXT and PHOTO PAGE links
with each photo, so you can click through the photos.
Select some photos to use in your gallery.
Create a table, about 5 rows by 5 columns.
Set the table width – 70% to 90%
Small photo size 160-120, large about 640-480. All the
photos need to be the same size and ratio.
Add a nice background to each page.
Don’t forget page title! I am still seeing “Untitled Document”
all over your websites…
The most important part of this lesson is
You MUST have all the small and large photos the
same size. You will need a lot of images and web
pages for this task. Make sure your links all work
before you upload. TEST your webpage.
Remember to use your web design folder.
I will be grading your websites.
Text Page Image Page Photo Page
Photo Photo Photo Photo