CREATING A DYNAMIC ONLINE GALLERY Why not store (Web server on xp)
CREATING A DYNAMIC ONLINE GALLERY Why not store images in a database? The images table contains only filenames and captions, but not the images themselves. Even though I said in the last chapter that you can always add new columns or tables to a database when new requirements arise, I m not going to add anything to the images table. Instead, I intend to leave the images in their original location within the website for the simple reason that storing images in a database is usually more trouble than it s worth. The main problems are as follows: Images cannot be indexed or searched without storing textual information separately. Images are usually large, bloating the size of tables. Table fragmentation affects performance if images are deleted frequently. Retrieving images from a database involves passing the image to a separate script, slowing down display in a web page. Storing images in a database is messy, and involves more scripting. It s much more efficient to store images in an ordinary folder on your website and use the database for informa tion about the images. You need just two pieces of information in the database the file name and a caption that can also be used as alt text. You could also store the image s height and width, but it s not absolutely necessary. As you saw in Chapter 4, you can gen erate that information dynamically. Planning the gallery Unless you re good at visualizing how a page will look simply by reading its source code, I find that the best way to design a database-driven site is to start with a static page and fill it with placeholder text and images. I then create my CSS style rules to get the page look ing the way I want, and finally replace each placeholder element with PHP code. Each time I replace something, I check the page in a browser to make sure that everything is still holding together. Figure 12-2 shows the static mockup that I made of the gallery and points out the ele ments that need to be converted to dynamic code. The images are the same as those used for the random image generator in Chapter 4 and are all different sizes. I experimented by scaling the images to create the thumbnails, but decided that the result looked too untidy, so I made the thumbnails a standard size (80 54 pixels). Also, to make life easy, I gave each thumbnail the same name as the larger version and stored them in a separate folder called thumbs. As you saw in the previous chapter, displaying the contents of the entire images table was easy. You created a single table row, with the contents of each field in a separate table cell. By looping through the result set, each record displayed on a row of its own, simulating the column structure of the database table. This time, the two-column structure of the thumbnail grid no longer matches the database structure. This means that you need to count how many thumbnails have been inserted in each row before triggering the creation of the next row. 321
In case you need quality webspace to host and run your web applications, try our personal web hosting services.