Anew

Welcome to the new site. If you prefer to have a look around, before – or in lieu – of reading this post, go ahead. The links are right at the top of the page. As you see, I have only brought over a few articles yet, nearly all of this year, plus the older ones that are linked from the 2018 ones, hence the topics are somewhat skewed. Lots about battery bloat and heat sinks.

OK, you’re back from your tour. – When I moved to Mauritius, I wanted a quick and easy solution to set up a website and blog. As I already had two other websites with some service provider, the most straightforward solution was to use the Wordpress blogging framework right there. In the meantime, things have changed somewhat.

Wordpress is a really good platform, and I would recommend it to anyone to get started, and also beyond, depending on the requirements and conditions. It has lots of functionality right out of the box, and there’s a vibrant market of templates and plugins, free and paid. As long as you stay within the boundaries of the looks and the functionality of these components, your blogging life should be fine.

However, I wanted to change the looks. Not that the current site is a mess, but I felt I could do a better job in presenting my content. So I looked around, but could not find a template that met what I had in mind. I write articles, and they should take centre stage, literally. Most templates have sidebars for Recents Posts, or Archive, and collections of links to other sites, or even ads. And most importantly, unless you dive into a template’s CSS files (the definition files that define the layout and looks), the possibilities for tuning are limited. Because Wordpress has lots of functionality, the corresponding CSS files are complex, also as the pages are generated dynamically from a database, which means making my changes could easily break things. There usually are lots of dependencies. Doable, but asking for quite a time investment to build the know-how.

Also, I increasingly felt that I don’t really own my contents there, and that I am locked in. Sure, I legally own it, but my posts are stored in the server’s database, the backups are out there as well. To write, I need to login to the server, and then write in a limited editor that runs in the browser. Quickly open an old post to check something, or find a link, and then switch back to the current one – a hassle. Switching to another article can take ten, or also 30 seconds. Not fluid. No joy.

I love good typography and layout. Go back to the old site – see how the paragraphs use about a full line of margin in between? Yuck. I cringe and wince every time seeing this. Look at this site again: about half a line is the correct margin, plus/minus some fine-tuning. For paragraphs, that is. Now check the headings (maybe scroll down): here, the top margin must be bigger, and the bottom margin smaller, so that the heading “attaches” to the following text. That sort of thing.

Ah, yes, one more thing: I love tinkering, making something work the way I envision, fail and learn, and improve and change stuff accordingly going forward.

So decided to give it a go, and start a new site, using a much simpler technology, and with the control fully in my hands. For the nerds, I’ll write about the infrastructure and tools in a separate post.

Objectives

  • Basic principle: minimise, no clutter. Minimise until it nearly hurts. Then maybe – just maybe – add stuff.

  • Clean look: focused on presenting articles for easy reading, the text centred right in front of you, with suitable proportions of text size, line height, and line length. No distracting side-bars. Make it like reading a book. Use a nice font, and design the overall typography with appropriate typeface sizes and weights, line heights, margins, and so on, without going overboard – at the end, the contents is rendered in a web-browser, not a printing press, and each of them (Safari, Firefox, Chrome, …) has its own ideas of how to implement nitty-gritty details of the specs.

  • Simple navigation: each page has exactly one purpose – presenting one single article, listing available articles, finding an article. Keep the site’s structure flat and easily comprehensible. No additional back to previous page or links of this kind, as each browser has a back button, right?

Anew
  • In-line pictures, and galleries: be able to insert pictures in-line in posts, with the possibility to enlarge them, like the corny photo to the right (if you have JavaScript disabled, no enlargement, sorry). In addition, have the possibility to present a gallery of pictures right on the page, as here.

  • Desktop and mobile: look decent on desktop computers as well as mobile devices. I test on my Mac with the 27” and the built-in 15” display using Safari, on my iPhones (XS, 7, 5) and my iPad Pro (10.5”), and my Windows PC using Firefox, Chrome, and Edge. Still need to find a poor soul using an Android device for testing. Don’t strive for maximum backwards compatibility with ancient browsers. These days, everyone should run an up-to-date browser version, and if they must use Internet Explorer at work – well, they should not read this site there anyway, right?

  • Know my stuff: last, but not least, I want to understand everything that I care to change and tweak. Some margin does not look good, some font size seems out of whack? I want to know exactly where to make changes. I don’t need to know the internals of the generator (see below) – I don’t understand the inner workings of, say, the Lua compiler either – but I want to know every line of CSS. In fact, I want to write every line of CSS.

Workflow

To write a post, I fire up my text editor and create a new file. I then write the article using Markdown syntax, which is basically a structured text file. Easy and straight forward.

To check my work, in the terminal (command shell) I execute

$ jekyll serve

and I can see the rendered article in the browser, right on my Mac, while I write and edit. This local web server also watches the relevant directories for any change, and automatically re-renders the site thereupon. Very fluid. (Jekyll is the site generator; as said, more about the tools later.)

When I am happy, I run:

$ jekyll build
$ rsync -av --delete site-dir/ user@host:/var/www/life-new.me/

Done. Published. No need to log in to the server. In case I want to make a change after publishing – say, I have overlooked a typo –, I simply run jekyll build and rsync again. It just takes a few seconds to execute both, about the same time as a simple Save Draft command in Wordpress.

Of course, if I use any pictures, I need to prepare them, and put them in the site’s images folder on my Mac, from where the rsync command will upload them to the server as well. I use Adobe Lightroom to prepare the JPEGs, and “tiny-fy” them. Uploading many pictures may take a bit longer, but there’s no need to re-upload them for a later text change – rsync takes care of that and uploads only changed files.

Going Forward

As of today, the site is working and looks decent on all the above devices and browsers. I am happy with the basic looks for now – it doesn’t get simpler than that. Maybe I’ll try a variant with a dark background. Maybe I’ll slightly reduce the text size, but then again, I am old and prefer bigger text. I have experimented with using thumbnail images in the post lists, but abandoned the idea for now for the benefit of a clean look. I might add archives by category, not just years. But categories don’t make too much sense for my type of writing. Maybe tags. Dunno.

Over the next days, or probably weeks, I am going to migrate all contents over. It’s not that I expect that anyone would want to read the old stuff anymore, but I want to have it all in one place, to then be able to shut down the Wordpress installation for good.

Going forward, I’ll correct any defects, and tweak the looks as I see fit. Any change is just a build & rsync command away.

Please direct feedback of any kind to fb@grayraven.org.