About this website
This web site is static, i.e. pages and their contents coming from the same domain are sent as is by the server, without any on-the-fly creation.
If you're not interested in the technique, you can also learn more about me.
With Eleventy, static is fantastic §︎
The site was previously generated by Jekyll, another famous Static Site Generator, but its development staled, and after multiple years I still wasn't confortable with Ruby development, so I moved to something easier (for me), yet at least as powerful.
In order to migrate the hundreds of contents written since 2001 in specific SPIP syntax, I developed a SPIP → Markdown plugin which transforms as much as possible this specific syntax into Markdown syntax, including with the YAML Front Matter.
Some plugins §︎
An increasing number of plugins exist in the Eleventy ecosystem to enrich the base solution.
The images benefit from my
eleventy-plugin-images-responsiver plugin to use the SaaS Cloudinary service in order to generate the different versions necessary for Responsive Web Design, while optimizing performance.
The webperf §︎
Web site performance has been one of my hobbies for many years, being above all frustrated as a simple visitor by sites that are slower and heavier than the others.
Producing a static website helps to optimize this performance, as generating pages on the fly is no longer necessary. But I have focused on providing a very pleasant experience for visitors, with a high-performance site.
For this purpose, several recipes have been combined:
- For basic operations such as concatenation and minification of CSS and JS, plus adding a hash to force a long cache to the browser, I use Rollup.
- For fonts, after testing the Flash Of Faux Text technique from Zach Leatherman, I finally gave up loaded fonts to go back to web safe fonts.
- For images, the standard syntax
<img srcset="..." sizes="..." />generated by my
eleventy-plugin-images-responsiverplugin is perfect: it's enough in 95% of the cases, is lighter in HTML, and more optimizable by browsers.
The external resources, potential sources of trouble, are mainly :
- the players of videos, including Youtube, Vimeo or Dailymotion
- the widgets of certain services, including Ulule, Speakerdeck or Slideshare
- Google Analytics, to find out what's going on on the site.
Switching to static made me lose the comments I had natively in SPIP, so I decided a little later to switch to Disqus so as not to lose the contribution of the discussions, although I don't really like the comments to be hosted elsewhere.
I had also started to implement Webmention fairly quickly to explore a new standard inter-blog dialog technique.
Search with Algolia §︎
Setting up an internal search engine on a static site is no simpler than for comments. It is necessary to make dynamics, find elements meeting the search criteria and list them.
With a dynamic site, it is possible to index directly the contents present in the content repository, usually a database. Some CMS even directly integrate this functionality, more or less turnkey.
Publishing new content has become more complicated, since you have to produce the Markdown and possible illustrations, then launch the compilation by Eleventy, before deploying.
All this could be made easier with Netlify, but I didn't move this site there yet.
But having a clean content source, in a more standard format, and versioned in GitHub, is a considerable gain.