Web Design 35S‎ > ‎Tables‎ > ‎

Picture Table(s)

Before you make your web page, make a rough sketch on a piece of paper to show where all the various parts of the assignment will be located. Make sure I see the sketch before you begin.

Today you're going to create a layout for a website photo gallery or something similar to that.  To get all the photos to play nice together, you're going to have to create your layout using tables, three tables to be exact.

What are you going to have to do?

  1. Get nine photos. They should be ones you're legally allowed to use. I got mine from Morguefile. It's a great site. You'll like it.
  2. Trim eight of your photos so that they're the same size. I like to use MS Picture Manager for this. It's probably the best tool we have on our server for this purpose.
  3. One photo should be the same width as the other eight, but twice the height.
  4. You are going to use three tables to create a layout similar to the one on the right.  One large table will encompass the other two smaller tables.
    • Consider making your tables separate colors to help you see what you're doing. You can always change the colors later.
    • You don't need to set heights or widths for your cells. The pictures themselves will make your cells an appropriate size.
James Dykstra,
Mar 18, 2011, 7:46 AM