Ah hah! Build easier, more efficient web pages with Server Side Includes

After posting Design like a pro: 20 web design tips last week, I began to put some of those tips into practice myself. Today, I discovered Server Side Includes (SSI)—-a technique so simple, I’m offended no one told me about it.

SSI allows you to reuse a piece of code without having to hand code it into every single page. For example, you can keep a navigation header (or any other repeating element) of your site in a file by itself. When you want to include the header on a page, you simply insert a tiny piece of code to point to it. The web server writes the header into the page each time it loads.

To make a change to the header you only have to change one file. Every page that “includes” the header will reflect the change automatically, saving worlds of time and energy.

This tutorial explains the technical details, and other ways of achieving the same thing with PHP and ASP. All are easy for anyone comfortable with HTML code (I’m a beginner myself). I got a demo working in under 30 minutes.

Figuring this out was an “Ah hah!” moment for me. I knew it was possible, but I had no idea how easy it was. This may be the most important tool I have learned for developing web sites.

Do you have any simple, yet indispensable techniques for web development? Tell us about it, or link to a tutorial in the comments below.