Slek gets itself a new website

Slek’s website has had a makeover, and it hits technical excellence with a score of 100/100 on the four criteria Google measures: site performance, accessibility, best practices and SEO.

Why change the website? Because the old one took too long to update, and the site had to be able to move as fast as Slek does.

The Google audit

Since I was rebuilding anyway, my aim was to get the maximum score of 100/100 on the 4 criteria Google measures on its well-known PageSpeed Insights page:

• site performance (loading speed and so on),
• accessibility (for people with disabilities),
• best practices (a mixed bag) and
• SEO (search engine optimisation)

Target reached 🚀🚀🚀

100% on performance is often the hardest to reach. It is itself made up of more technical sub-criteria, and Google runs the test on a fairly powerful computer but also on a fairly old phone, where 100% is genuinely hard to get unless you have nothing but a page of text with no images. And we have a full-page video on top of that.

Maintenance

I can hear you thinking “a fast site is all very well, but it must be a nightmare to maintain”. Not at all. The article you are reading was written in a very friendly editor, into which I drop unoptimised screenshots.

That said, let us be honest: the overall architecture is still a developer’s business. We are light years from a Google Sites or a Jimdo, to name just two.

Only time will tell whether my choice was the right one.

Architecture

For the more technical among you, a few words about the architecture.

The foundation is Astro, a tool that takes files (images, text) and shakes them to generate HTML pages.

For CSS I am staying faithful to Tailwind. You either like it or you do not, but while separating a page’s structure (HTML) from its rendering (CSS) made sense at the start, today CSS tooling does everything it can to encapsulate styles and avoid side effects. To my mind Tailwind is where that road ends up.

In this architecture there is no database. The sources live in Git and get shaken to produce a static site where everything is optimised. That is what is known as SSG (Static Site Generation).

The advantage is that with no database, and with the history of the site at every change, a few clicks take me back to last week’s version, or last year’s.

Hosting is with Cloudflare. I had to leave Infomaniak, reluctantly, because they do not yet offer a way to host an SSG: the Git ➡︎ HTML bridge is missing.

Finally, I am writing this article in the Sveltia CMS editor. A young project, but a very promising one.

That is about it. All that is left is for you to enjoy pages that load instantly 🚀