Late Night Rabbit

Simple Organism

Introduction

This little morsel was a personal project that I had been working on for quite some time. It started with the idea that I would come up with a development template and once a new project came in, all I would have to do was duplicate the folder and get cracking on the design. It obviously never worked but what came about was a great little XHTML/CSS/PHP template that I thought would make a decent tutorial to pass on. This is a compilation of many tutorials I've taken over the years with some flavor of my own. Anyway, here goes...

Why "Simple Organism"?

Simple: Not involved or complicated; easy.

Organism: An individual form with several parts that work together to carry on the various processes

Before we get started, a decent knowledge of HTML and cascading style sheets (CSS) would be great. I will also be using the correct terms for CSS syntax. To brush up, here are some quick samples...

Syntax Samples

Sorry for the jargon, there are some sticklers out there and I'd rather not get the slack about incorrect terms. Anyway, what we're basically going to do here is go from a bare bones layout to a stylized and dynamic layout. I realize the layout may be bland and the colors might suck but you can modify all of that yourself in the end. If you already know what you're doing and just want to dig into the code, feel free to download the zipped samples below.

CSS Only
This template uses only cascading style sheets

CSS with PHP variables
This one uses some inline PHP variables to turn on/off navigation and minimizes repetitive text

CSS with PHP variables and includes
Same as above but trims the document using PHP includes (similar to server-side includes)

A taste of things to come...

After that, we'll get into the dynamic part that uses a little PHP. Trust me, I'm no programmer and if I can pick this up, anyone can.

And of course, since I'm a geek, I'll toss you some of the resources I've collected.