Designing a Data Driven Website - Part III
Designing a Data Driven Website
Part 3
Ok, so now we've set up our scripting language and database and have a data model (you did make a data model before you got started on the site right?). Now we've got to get down to the nitty grit of coding up the data driven site. There are a few tips I have learned that can help make this process a lot easier.
1. Build a Template
This is pretty easy. What we want to do is to take into consideration what type of information our site is going to display and how we want to lay it out. For Madirish.net, I had to keep in mind that I was going to be displaying a lot of text articles that were very long, and could run into problems with unbroken lines of code that I wanted to be able to extend to the right without including line breaks. You probably want to keep you page designed to a width that will display properly on a monitor with 600x800 resolution (this is about 700 pixels) with borders provided for the edges of a browser. You're going to want to find a color scheme for your site and also probably work up the CSS of your pages at this point as well. You want to design a template that includes easy links for navigation, but no redundant links unless they are really necessary. You want a user to be able to get back to the beginning of your site without too much hassle, and make sure to put your most important sections in some sort of highlighted area. Be sure to design your template so that it will accommodate all the different areas of your site. You want all your navigation to appear in consistent locations on the page (no shifting the 'Home' link from the upper right to the lower left of the screen depending on what page a user is looking at). You want to make sure a user can scan the page and easily find what they are looking for over and over, no matter where they are in the site. You will also want to take into consideration how graphics intensive your site is going to be. Too many swirly pictures and your download time will become abysmal. Just make sure you set out to create a theme that you can use across your site. The template should have blank space for all the areas of your site that are going to change. Save your template so that you can plug in all sorts of information in any of these dynamic areas. Once you have a saved template, simply open, edit, and save your template with a new name to create each of your pages. This will ensure consistency in your site and save you the hassle of recoding the same page over and over again.
2. Use includes
Includes are sections of code that can be reused. For instance, the header graphic and link bars on Madirish.net are all includes. I wrote up one file for the header, and always call it in the same place in my template. The tables on the sides of the page are also includes, as are the footers. The reason you want includes is so if you have to change information in, say, the top navigation field, you won't have to change your code on every single page of your site. All you have to do is change one file. Includes can be called in PHP using:
<?php
include ("template.php");
?>
So we could write up a header table and some navigation, save it as "header.php" and then write up all our pages like thus:
<html>
<head>
<title>Page Title</title>
</head>
<body>
<?php
include ("header.php");
?>
content
</body>
</html>
Includes will allow you to reuse code and help to centralize much of the essential code that will appear on all your pages. Don't be afraid of using too many includes, you can subdivide your includes to make it easier to manage different sections of your site.
3. Organize your directory structure
Don't just lump your whole site into one folder in your www root. Make sure you create subdirectories and catalog the pages of your site properly. Make a directory for includes, one for images, one for files, etc. This will save you a lot of headaches down the road as your site grows in size. It is a lot easier to find what you are looking for if you can portion up your site files in a logical manner. The level to which you want to organize your data is entirely up to you. I know some developers who keep separate folders for site images and graphics to keep them separate. Make sure you structure is logical though, since once you divide up your files you will have to use relative linking and image sourcing. A good directory structure might look like this:
/www /downloads /documents /imgs /includes /js index.php firstpage.php
This way all your essential files are in the /www folder, but your download files are all placed in the /downloads directory and all your include files are in the /includes directory.
4. Track hits in your dynamic scripting language
Log files are great, but they're a pain to parse up. Creating a table in your data model for hits and creating an include file that logs browser, IP, OS, referrer, etc. to this table and including at the top of your page will help you to easily create a dynamic page that will display your user info. Using SQL to query a hits table is a lot easier that writing a log file parser and cheaper than buying WebTrends. You will also be able to easily customize your user data to suit your own needs and/or client requests.
5. Make management pages
If you are using dynamic pages, make your life easier by taking the time to make management pages. Create a secured directory in your file structure and script up pages that will quickly allow you to upload, edit, and change content on your site. This will include pages that will allow you to do inserts, updates, and deletes without having to code raw SQL every time you want to alter the tables in your data model. If you have a 'Links' table, make a page with forms that will allow you to insert new links, edit the existing links, and delete/deactivate extraneous links. Although it takes a large time investment at first, creating a site management area will save you time and headache in the long run. This functionality will also save you from potential mistakes in SQL coding since once you have the code correct you will be able to reuse it over and over again.
Conclusion
These are just a few of the handy tips I have learned during my time as a web programmer. Make sure that you poke around and pay attention to those with more experience than yourself. I have found the advice I've gotten from more experienced programmers invaluable in the past. Often they have found time saving techniques that you won't discover until it is too late. Also there are shortcuts that you may not realize you should have implemented until you are months into site development.