| HP003/004.05 | HP003/004.06 | HP25201 |
|
|
||
| Step One: Creating Your Webspace | ||
| Step Two: Getting Our First Web Page | ||
| Step Three: Making Our First Web Page | ||
| Step Four: Uploading Our Page Via FTP | ||
| Step Five: Making A Second Web Page | ||
| Step Six: Backgrounds, Links, and Color Schemes | ||
| Step Seven: Inserting Images Correctly | ||
| Step Eight: Tables | ||
| Fin: Conclusion and Tips | ||
| Bonus Page: Connecting to FTP via Dreamweaver | ||
Step Eight: Tables
Ok, I now have a bunch of images, sized them to my satisfaction, and even arranged them visually on the page. But doesn't this feel a little sloppy to you, that it could be organized more coherently? Also, if I want to write things alongside or beneath the image (such as crediting the author, commenting on the image, etc) it is very hard and annoying to align them properly with the image, and different browsers may not show the alignment fully to my satisfaction. How do we fix these issues? Tables!
Let's start by making a new table. Place your cursor where you'd like it on your page, go to the "Insert" menu, select the Table option, and a new dialog box will pop up riddled with options.

Alright, the number of rows option determines how many horizontal strings of table cells you're going to have, and the column option determines how many vertical strings of cells you're going to have; like a 3 row 4 column table would look like a 3x4 rectangle with 12 "cells." The table alignment is pretty self-explanatory, just where you'd like the table to be aligned. Check or uncheck the border box if you want a visible border surrounding your cells. Table width determines how wide the table is going to stretch across your browser, we can adjust this later but when making a new table I suggest starting with a 100% table width. Ignore the table height option, it'll only cause issues, and you can leave the column widths equal unless you know you want certain columns to be narrower than others. The table background options work just like the web page background options we fooled around with earlier, select a color if you desire or an image if you have one. Here's my sample:

Voilà, your table is inserted. Now to put your pictures in there
either insert them directly into a cell space, or if they're already on
your page, just drag them into the cell where you want them. You can edit
your font and images exactly as you did before within a table, only now
they'll be conveniently organized for you. Feel free to try out the other
table options that I only glossed over too; adapt your table width % so
that the information looks better on your page, increase the table border
if you want a larger distinction between cells, and insert rows and columns
as needed. I've done some of that myself, I even fooled around with Duket's
masthead table too, here is my final page:

Tables are excellent tools once you know how to use them. They can be
used to organize and arrange information clearly and perfectly, since doing
it with font alignments or using the Tab key or Spacebar may result in
strange layouts depending on people's individual computers. Tables act
as a good standard that gets around all these problems and I recommend
you use them whenever they may seem remotely necessary.