Displaying your Masterpieces
The first step is to gather all the images you would like to display and place them in a new folder(this one is called images). I would have folders setup as follows:
Try to make all the files in small case letters to avoid confusion when trying to find them. The first page will be called "index.html" which you would save inside the "showcase1" folder or whatever you have called it.
If you have a program that will automatically make thumbnails - this would be the easy part - Each picture in the image file is resized to about 100x100. If you have more than 20 thumbs on one page, you may want to make them 80x80, if you like the look of larger ones, I have used 200x200 - just try to put fewer of these per page and have more pages!
I have a couple of free programs that make thumbnails (and one expensive
one - Photoshop 6 --LOL!)
In PSP, open each image,
Window -- duplicate (or cntrl d) to make a copy and close the original.
Go to image, resize & select your size. (Also effects, sharpen if desired). Then save copy as "samename_t.jpg" or "samename_t.gif" . Use the jpeg or gif optimizer to get a small file size.(we just add a "t" to the name of the file so you know which are the thumbnails.)
Putting It Together
Open a new file in the editor and call it "index.html". Save
this in the showcase folder - should now be like this.
If you are using a WYSIWYG editor,(that is - not actually writing html code
yourself) Check the menu for a "table" option. (Where it is depends
on what you're using - check your help files)
If you are using a WYSIWYG editor,(that is - not actually writing html code yourself) Check the menu for a "table" option. (Where it is depends on what you're using - check your help files)
I'm trying to write this using Front Page Express just to see how it does work , but I would usually just use a notepad type editor to keep the table very similar to this type of codecode
With your table creator (hey they have one of those at Yahoo-Geocities) Create a 4x5 cell table. Say 4 rows and 5 columns or vice versa. Like so,(this has a colour added)
Now I know when you look at it you think - ah my pictures will not fit in there!! - but it will grow! Place your cursor in the first "cell" & go to the insert image button or command, find your thumbnail folder& thumbnail. Now select the thumbnail (which is in its cell) and create a link to the full picture in the images folder. Some programs you may have to type in the image name yourself. I noticed this program I had to just write in the hyperlink location as images/psp7ani.jpg
Add comments if desired,
Then just continue to the next "cell" to add your next picture the same way until you're done. Don't forget to keep saving along the way.!
Test your page by viewing it in a browser - just file/open and browse to the file location. You of course would add titles, links and a neat background and then upload your page.
You may want to expand to tables that do more - selecting the width, double backgrounds and more. If anyone wants to learn more about tables or webpage building there are tons of resources out there... Some good ones are these:
or the Yahoo-Group HTML Learning Corner