Renewed Website

Architecture

There are many ways to manage and publish the content of a website. And I've used or tried quite a number of them, both professionally and casually. For a personal website like this the default choice for most people is probably Wordpress. But I'm not 'content' with that at all. I want more flexibility and less overhead.

I have found a way that allows me to change the entire structure of every page within seconds, reuse my own set of components, separate presentation from structure and content layers, style components differently depending on where they appear, and reference components within content. A flexible content management ... mechanism.

Semantics

An important aspect is the semantics of the website. A website can emphasize the semantics by using semantic technologies, such as HTML5 tags. But i.m.o. it should also support microformats, such as hCard, RDFa or Schema.org. The new mechanism generates Schema.org microformats, for both the entities Person and CreativeWork.

Mechanism

The mechanism is rooted in PHP (since that is available on most hosting platforms) and server side XSLT. PHP is the de facto standard for web servers and is a suitable starting point to handle a browser request. The PHP code only triggers a XSL transformation, so only a few lines of PHP code are needed. The focal point of the XSLT is not the content, but the structure of the page, expressed as components. Components represent content, or other compound structures. For example:

and

When needed, a component inserts the required content. The content, the components, and the structures are separate, but interlinked, and easy to maintain. It's also pretty quick, and can be tested locally using command line XSLT tools, like xsltproc. Apart from the flexible page lay-out, the (responsive) presentation relies entirely on CSS.

Once set up, I can focus on the content, instead of any technical aspect. But I can still introduce something radically new at any time, and apply that as a reusable component. Try doing that with a tool like Wordpress.

There is room for expansion as well. A flexible content editor for example.

Result

All this to create this simple webpage? Well, yes. But it is free of bloated HTML or other overhead, like you see with Wordpress and the likes. It produces pure (validated) XHTML5. By adding pure (validated) CSS, the presentation is separated nicely from the content (and it allows the pages to behave responsively to different screen sizes). It does not require any javascript. It does not store any data at the client, including cookies. It does not collect any data from the client. And it allows the website to use OWASP security headers such as Content-Security-Policy.

If validation is something for you, go ahead and check the microdata, HTML code, CSS code, and HTTP headers:

• Validate Microdata
• Validate HTML
• Validate CSS
• Validate HTTP headers