In a classical HTML website we use a combination of CSS and HTML. The content lives in an HTML page whereas styles and presentation are defined in a separate CSS file. This approach may prove limiting when the amount of data grows on the website and one often ends up using methods which mix sever-side scripts and light relational databases to better separate data from the representation. A common example of this which is PHP/MySQL.
Using XML this separation is done intuitively. The data lives as XML and we use XSLT which stands for eXtensible Stylesheet Language Tranformations to literally transform the XML document into another XML document particularly into an XHTML document.
The overhead of using a solution based on external databases and server side script can be quite astonishing for such a small website. And surprisingly nobody seems to care about that. On the other side we have clients where multiple core processors of several gigahertz are commons. Using client-side XSLT allows us to deleguate the work of processing the data into XHTML pages on the client side. Not that I wish to imply that one needs a dual core processor to process such pages. But the total amount of work is greatly reduced and parallelized as the HTTP server can fully exploit its primary function, that is parse requests and serve the pages accordingly.
Another advantage of this solution is the now clear separation between data and its representation. It was still unclear with the CSS layer. But now add content to the site is really easy. What more is we can now also exploit the caching capability of the HTTP protocol which is inherited directly from the file based approach whereas many quick and dirty handwritten server-side scripts do not even pay attention to this.
This site also uses the Google's WebP image format when available to reduce the bandwidth. WebP lossy images are 25-34% smaller in size compared to JPEG images at equivalent SSIM index. Most browsers do not support this format especially firefox so I use a script to change the src location of the images when needed.
You may learn more about XSLT at www.w3.org/Style/XSL/WhatIsXSL.html, www.w3.org/TR/xslt and http://wiht.link/XSLT-intro. You may also learn more about XML if don't already know at www.w3.org/TR/xml and www.w3schools.com/xml and finally you may learn more about WebP at developer.google.com/speed/webp.
Except where otherwise noted, content on this site is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.