New website with Hyde

Vincent Bernat

My pre­vi­ous web­site was gen­er­ated (dy­nam­i­cally) with mod_autoindex, a mod­ule from Apache tar­geted at ren­der­ing an in­dex page for the files con­tained in a di­rec­tory. Pretty ba­sic (but themable). Here is a new, re­vamped web site us­ing Hyde, a static web gen­er­a­tor writ­ten in Python.

Static or dynamic?#

It has been a long time since al­most ev­ery­body is cre­at­ing dy­namic web­sites. Most of­ten, they are pow­ered by some blog en­gine writ­ten in PHP like DotClear or WordPress. In­fre­quently, they are crafted with bare hands us­ing one’s pre­ferred lan­guage. Nowa­days, host­ing a dy­namic web­site is pretty easy. There are a lot of cheap vir­tual servers so­lu­tions that al­low you to get root access.

How­ever, dy­namic web­sites have some drawbacks:

  • Se­cu­rity needs to be mon­i­tored tightly, es­pe­cially se­cu­rity up­grades; some plat­forms are more of­ten vul­ner­a­ble than others.
  • Dy­namic web­sites may have some prob­lems han­dling an in­creased load.

With a static web­site, se­cu­rity prob­lems are eas­ier: there are far fewer com­po­nents to mon­i­tor, and most of them (for ex­am­ple, the web server) are pretty solid and well audited.

A site pow­ered by ng­inx can han­dle sev­eral thou­sands of new con­nec­tions per sec­ond with­out any spe­cial tun­ing. Get­ting this kind of per­for­mance with a dy­namic web­site is far more dif­fi­cult. Scal­ing is also eas­ier: add more web servers and copy the con­tent. No data­base, no syn­chro­niza­tion mech­a­nism needed.

Host­ing can even be done on sim­ple plat­forms like Ama­zon S3, even if there are now more ap­pro­pri­ate plat­forms for this like Ama­zon CloudFront.

More­over, even a static web­site can re­ceive com­ments us­ing a sys­tem like Dis­qus which lever­ages the use of JavaScript to add a com­ment sys­tem to any static page.

Hyde#

Hyde is a static web­site gen­er­a­tor writ­ten in Python. There ex­ist a lot of these beasts. On StackOverflow, a ques­tion about this got some in­ter­est­ing an­swers. You will also find a fairly com­plete list on this blog. If you like Ruby, I as­sume that nanoc and We­b­gen are good can­didates.

Let’s go back to Hyde. It was rewrit­ten re­cently and the doc­u­men­ta­tion is a bit in­com­plete. You will need to read the source code or look at ex­am­ples (like the shipped one or this site) to un­der­stand how things are han­dled. Ev­ery­thing is han­dled by a plugin sys­tem. I hope it will not be­come a mess in one year (I play a large part in this).

Hyde takes your files, ap­plies a lot of fil­ters to them, and gen­er­ates the fi­nal web­site. It uses Jinja as a tem­plate sys­tem, Mark­down for markup syn­tax, Less to write CSS in a more ef­fi­cient way (and to minify them), UglifyJS to minify JavaScript, etc. It is also pos­si­ble to add meta­data to files (ti­tle, au­thor, cre­ation date, etc.). But since ev­ery­thing comes as a plugin, you can use any tech­nol­ogy you like.

In the end, you can tune all knobs but you need to do most of the work (HTML, CSS, JavaScript), as well.

Con­ve­niently, there is a small web server that re­builds mod­i­fied files on the fly. This comes in handy but this is a com­mon fea­ture with this kind of generator.

New website#

Here is a new web­site crafted with Hyde. It is trans­lated both into French and Eng­lish. This is done with the help of a small plugin. I am quite happy about the result.

Tech­ni­cally, there is one mini­fied CSS file, and one mini­fied JavaScript file. The de­pen­den­cies (like jQuery) are loaded with the help of yepnope.js, which will be­come part of Modernizr.

I don’t want to sup­port In­ter­net Ex­plorer 6, but I plan to sup­port Fire­fox 3, In­ter­net Ex­plorer 7, and re­cent ver­sions of Chrome and Safari.

For the de­sign, I have al­ways been un­de­cided. I am pretty im­pressed by some raw web­sites but also by some oth­ers more elab­o­rate. Since I am not a tal­ented graphic de­signer, I have tried to keep things plain and simple.

If you are in­ter­ested, sources are avail­able on GitHub!

Up­date (2026-05)

Here is a screen­shot of what it looked like at the be­ginning. 📜

Screenshot showing how this article looked like 15 years ago. It's not that
different.

Up­date (2026-10)

I am not us­ing Hyde any­more. I have switched to a cus­tom static site gen­er­a­tor, us­ing doit to track de­pen­den­cies and to build in parallel.