h2g2 The Hitchhiker's Guide to the Galaxy: Earth Edition

*This message was also posted on the Technical Feedback page.*

Dear h2g2 Tech Team,

First off, congrats on being hosted by the BBC! I hope it opens many new opportunities for you!

I'm webmaster to a growing website about various things, mostly about my upcoming book and multimedia files. It's recently moved to [oops, I can't have an URL ], and this has opened a lot of opportunities for myself. As a very keen web designer, I am eager to try out many new designs for my website, but even using templates, it takes a long time to convert all the site's contents to the new format. In addition, I can only have one design of the website online at any one time, so this poses problems.
Now, I know that the h2g2 site is very advanced, and am particularly interested in how you set up the multiple skins system. What I would like to do with my site, if possible, is to set up a similar system, so people can chose the design they like best out of a range, and I can express my webdesigning talent more fully. It would also give my 'rivals' in this industry something to think about.
And I was wondering if you could help me. The details for my server are set out below, and taking those into account, I was wondering if maybe you could at least tell me the basics of setting up a skins system, if at all possible with my specifications. If it is not possible, please tell me how you set yours up, so I might be able to have a word with my host and see if I can arrange something.
Any help would be greatly appreciated, as I'm really interested in how the system works.

Thanks a lot!

---------

Server Information:

Operating system - Linux
Server software - Apache
Script support - Perl execution (cgi-bin not needed), PHP3, PHP4
Other features - .htaccess & .htpasswd usage, access to a MySQL database.

Well, our servers run under Windows NT and IIS, although the real work is done by our server software, Ripley, written in C++. The first version was written in perl, but that didn't have the same skins system.

All our content (articles and forums) are stored in a SQL Server database.

To do skins easily, you should make sure that all the content on your site is stored as XML in some form or other, and definitely not in HTML. Decide what tags you want to use to represent your content. I can't really give you any suggestions, as it will depend on the type of content you host. Remember that in XML you are storing data, not the way it is presented, so you can think about making your content much richer (in data terms). For example, any dates could be marked as so that in future you could extract date information more easily than if it were just text. Also consider how they might be displayed in HTML or other display formats. Then you'll need to find an XSLT transformer that runs under Linux and Apache. There is an Apache XSLT projects callen Xalan which might do the job. You then write a stylesheet in XSLT which takes your content in XML and transforms it into HTML. You'll have to learn how XSLT works, but it's not that difficult, and as long as you're careful to try and avoid using HTML tags too much in your content (remember the key is to separate content from presentation) you should be able to get completely different looks to your pages.

There's a *lot* of information around about XSLT. I'd recommend Michael Kay's book from Wrox on the subject.

And that's all there is to it.

Ah, thanks for that!

Most interesting indeed...
I've never heard of XSLT, so I'll start researching it right away!

BTW, the URL to my website is at the bottom of my user page.

Thanks again...

Oh, actually, a couple of new questions, if you have time...

I'm guessing then that I make each individual 'page' an XML file, then.
But how would I call it? Would it be a link to page.XML, or to the relevent stylesheet, like skin.XSLT?page=page.XML (if that's the extension).?
And how would I let the site visitor chose the skin?

Well, that's the real trick, isn't it?

In an ideal world, all your users would be running a browser which can do XSLT transformations on the client side, so you'd only have to serve them the XML pages, and they'd do the rest.

In the real world, IE is currently the only browser that fully supports XML/XSLT, and even then only if you've downloaded the latest XSL patch. Without it, the variant of XSL that IE uses bears almost no similarity to the XSLT 1.0 spec (which the latest download adheres to pretty-much completely).

However, you can run software on your server to take the requested XML document, look at the request from the client browser, maybe check a cookie to see which skin they want (or encode it into the URL like you can on h2g2) and run a server-side XSLT transformation, then send the client the result of this transformation.

Of course, this is quite costly, and if your pages are mostly static (unlike h2g2's pages) you could cache the resulting HTML so that you don't need to apply the stylesheet each time.

Microsoft have a server-side component that does a lot of this - detecting browsers and delivering the correct version of the page by applying stylesheets. I don't think they do caching, and in any case you'd need to use something else if you're sticking with Linux/Apache, but the principal is the same.

And it's *always* going to be more costly than delivering straight HTML pages, so if that's a worry, take the easy way out and pre-generate HTML versions of your pages for each of your skins, and put them all down different subdirectories, so that blahblah.com/shiny/index.html has one look, and blahblah.com/woody/index.html has another.

If you're just a little smart about your navigation, this would allow you to develop one set of pages, and have them running under any number of different skins, as long as any time you change your XML source, you remember to generate a new page for each skin.

None of it's easy, but then if it were, we wouldn't be about the only site around doing this.

Yeah...you really do have some fantastic stuff running on this site (or rather, on your servers). My friends just won't believe me when tell them this is one of the most technologically advanced sites there is.

Anyway, thanks for the info. I'll try and get something sorted out, although it does look like I'll have to do the subdirectory-method - one I'd already come across in my journey for websiting mastery.