Welcome to the third brand new version of my website. It's not only a face lift but also (again) a complete
rewrite of the entire website. I officially switched the page to English now and German posts are specially
marked since this fits my habits more. Theres also some new stuff like the tag cloud, the projects
page and a proper archive. I've also added some funny things like the blurred navigation
subtitles and some texts at the bottom of pages. So feel free to look around.
Ok, that was the obligatory introduction everyone probably skips, so right down to the interesting stuff.
Motivation
The old website was fairly sophisticated and had a lot of features, so why another rewrite? Basically
because it was sophisticated and complex. Maintenance also was a concern since Rails applications tend
to be a bit difficult to deal with in the long run. However the strongest point was simplicity.
Often complexity is added without properly thinking about it and I wanted to know how far simple stuff
can carry you. I'm not talking about the simplicity frameworks like Rails or CakePHP give you: this simplicity
is often bought by knowledge of a framework which tries to hide it's own complexity (Rails is very good
here). However if you look at it in the greater scale (e.g. like a good system administrator does) such a
framework adds a tremendous amount of complexity to your application which you will always need and
use.
I wanted to get closer to a form of "absolute" simplicity. If there is nothing, nothing can break and you
have nothing to maintain. However I need at least something to write my stuff and the bare minimum for that
are a bunch of files: text files with the content and some additional files like pictures grouped into some
directories. This was the simplest way I came up with and much to my surprise it's all you need for a
basic website like this one. Add a few simple PHP lines to the mix to present these text files as nice HTML
and use SSH to create and edit the text files. That's it. It does not only sounds easy, it is easy.
The weblog files in Ubuntus file browser
In a time where many ditch SQL in favor for more scalable (and simple) key-value stores the move to
simple files looks a bit odd. At least to me it did. However if you think about it some time you realize that
this opens up many new options. Caching is basically as simple as with key-value stores (e.g. serialize and
store frequently used data) and if the disc I/O becomes a bottleneck you can move the most used ones
to a RAM disk. You can use version control for your content (e.g. SubVersion) or can do any crazy stuff you
can do with file systems (UnionFS, EncFS, …). It happened to me more than once on this
project that simplicity proved to be equally flexible and extensible.
Server side technology
Enough about why, lets go on the the how. For the text files I used the format that is used so often that
most programmers don't even notice it. No, I'm not talking about XML but a simple header and body
structure like used by mails (SMTP), HTTP and many other protocols.
A simple post file
Title: My post
Tags: test, files
And here comes the content.
These files are then read by some PHP pages. I didn't used a PHP framework… well, if you look at PHP
close enough it already is a framework. Thanks to the alternative control structure syntax
and short opening tags you get a nice template system for free. There are also some other features like
anonymous functions that keep the code clean as long as you keep it reasonable simple and
not to mention the large standard library.
In the greater scale I used some mod_rewrite rules to build nice and clean URLs that get rewritten to
a Rails like structure of PHP files. There's one PHP file for each action and it contains the logic code at
the beginning, followed by the view code (mainly HTML with some embedded PHP). And thanks to
output buffering it's easy to wrap everything into a layout. That are about the features that
I used most of the time. You get all this for free without any maintenance. Well, you have to install PHP
but thats just one package you can install along with Apache.
Design
The new design with the same test entries as in the prototype
The most visible change is a new design based on the Modern Ambience design prototype. However
the whole design was made completely from scratch directly as HTML5 and CSS3 code. I didn't opened
Inkscape once, simply because it wasn't necessary. The article Beautiful UI styling with CSS3 text-shadow,
box-shadow, and border-radius more or less was the spark it all started with. While the original
Modern Ambience prototype took several weeks to complete the current design was done in about 3 hours.
All thanks to the new CSS3 properties. However these properties also made this website a little browser
benchmark and you actually see a performance difference between Opera, Firefox and Chromium.
Writing the HTML code with the semantic tags of HTML5 that matched the content at hand was actually fun.
It just feels good if your markup gives you a good representation of the content. Thanks to CSS2 and 3 selectors
styling them isn't a problem and in the end I only needed one semantically useless div element in the layout.
I strongly recommend anyone building websites to check out the Beautiful UI article. It's
astonishing what's possible with CSS and it's actually faster than using an Image program like Photoshop or
Inkscape to design the website.
The endless details
As with every project there are a lot more details I could write about. Some interesting use of the table-*
values of the display property for the figures and their captions, the tag cloud, HSL-colors, the PHP class
used to load the files, simple caching functions, the comment markup, no foreign request policy etc. If you
're interested in some details feel free to post a comment. I'm willing to answer any questions. :)
As a last note: This project proved for me that simplicity is worth the time thinking about what you
need. So before the next project spend the few minutes and think about what you really need before
firing up your framework of choice.