You don’t want to re-invent the wheel every new website you begin coding on. Instead maximize your productivity with a template or skeleton if you will of a basic site design.
Your implementation may vary. I’ve tried to keep mine terse for the utmost configuration.
We’ll start with a basic header:
head.php
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Change Me Later</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <link href="/style.css" rel="stylesheet" type="text/css"> </head> <body>
I’ve choose HTML 4.01 strict for various reasons. You will need to remember to fill in your title.
As you may have noticed, I’ve included a style sheet in this header, so let’s go over that.
style.css
* {margin:0;padding:0;}
Not much to see here, we reset our margin and padding to 0 to eliminate cross browser quirks and general madness while designing. Some people prefer more in their default CSS.
Let’s continue on to the main page.
index.php
require('head.php');
<!-- Do stuff here -->
require('foot.php');
Not much to see nor explain. Now onwards to our footer.
foot.php
</body> </html>
And there you have your skeleton. It’s up to you to add the muscle.
A few ideas:
- Include your name, version and other information in comments in the header and stylesheet.
- Include your statistics code in the footer.
- Include any javascript you might use.
- Instead write a php library to generate your header/footer bassed on doctype/chartype.
- Set default text styles, colors etc to your liking in your CSS
One other thing to consider that I always use and like in a seperate file is menu.php. You’re always going to want a menubar in some respect and it’s nice to have the piece external as well.