At last… a new website! It has cost us a lot of blood, sweat and tears, because that’s how things are at usmedia – everybody has an opinion about everything. In the end we opted for a step-by-step approach, so that everyone could make their contribution to the final result at some point. And to what follows, of course, because a website is never “finished”… We are curious to hear your reactions!
Static Site Generator
We didn’t want to use a CMS for our new website. That only adds complexity, and we don’t really need its functionality. So a static site generator looked like a good alternative. There are several of these on the market. After all, the concept is starting to gain in popularity. We chose the ultrafast Hugo..
The idea behind opting for a static site generator is that a CMS sometimes only adds greater complexity, at the expense of flexibility, and takes up server capacity unnecessarily. A static website can run entirely on a CDN. Easy! Another advantage is that it requires no special skills – it’s just HTML, CSS and JavaScript. So everyone can contribute. And last but not least, we wanted to be able to head in any direction we fancied. Creating your own website is difficult enough.
Because we don’t have a CMS, we simply write the content in Markdown files. Directly into version control: easy for the techies, rather harder for the rest.
Razor-sharp images
To ensure that we present razor-sharp images on HiDPI screens, such as Retina and 4K displays, we make use of so-called client hints and the srcset attribute. This means that the browser requests an image adapted to the DPI of the screen in question. So whatever device you are using – smartphone, tablet, laptop, desktop – the picture you see matches its screen dimensions and resolution.
Images thus have to be customised for supply in various resolutions. That’s drudgery we would rather avoid. Using the imgix service, however, visuals are adapted on the fly to the required webp format.
Hosting on AppEngine (Google Cloud)
In principle, we don’t need AppEngine for a static website. But it does deploy nice and easily. That’s great, because it allows us to make use of a global CDN network for all static content. That’s a standard feature. Moreover, it’s extremely easy to use a Let’s Encrypt certificate through AppEngine and to serve the website via HTTPS without any hassle.
We roll out new versions with the aid of BitBucket Pipelines. For both automated builds and automated releases, that is done directly from version control.
TypeScript
OK, for this site it’s really over-engineering a bit, but we do always love to play around with fun techniques. So we write the JavaScript in TypeScript. Why? Because we can!