When Minimalism Meets Perfection - Yet Another Make-over for my Static Blog Site


Posted on July 19, 2020 | ⌚ 2 min read




There is a very fine line between minimalism and simplicity. While both words are often used interchangeably, they don't always mean the same thing. In my opinion, minimalism is the art of using the least quantity of elements to create the maximum efficiency and effect.

Simplicity, however, is the state of being simple in quality, which is the opposite of complexity.

This has been my issue with my blog since I created it. I have been juggling with perfectionism, minimalism while avoiding being simplistic. This prompted me to re-evaluate the old design and start a makeover, based on the HTML template Editorial by HTML5UP.

My old design has been VERY simplistic. It had no proper comments system, the blog posts where clunky, the navigation was counter intitutive and lacked some microtransactions that improved the UX. Editoral on the other hand is very well designed, but was not minimal by any means, but that was easily fixed.

The real power of the JAMStack and the SSG, makes it very easy to change the look and feel of the site quickly. Using Eleventy, it was just a matter of changing the CSS, and a couple of Nunjucks template files, and I was good to go. It all took a few hours of work, and is deployed instantly by Github and Vercel.

I opted to add Facebook comments widget, to make it quite easy for anyone with a FB account (who doesn't?) to leave a comment without any signing up or other hassles. Another big issue in static websites,beside the comments, is the search system. This issue is usually solved wih tools like Vue.js or React.js, but I really don't have the time to implement a complex system, and it seems counter-minimalist to me.

Instead, I used Nunjucks to create a JSON index of the website everytime it is deployed, and then using vanilla JS, this index is easily queried and the results are updated instantly. Sweet, minimal and quite effective.

I hope you like the new design. I'd appreciate it you share your comments and ideas about the design, or just the blog overall, in the comments section below.



image nature
Ahmed Mohamed

Ahmed Mohamed (staying safe)

Contracts and Claims Engineer

Ahmed Mohamed is a Mechanical Engineer by study and construction contracts administrator. Ahmed has been responsible for the entire contract lifecycle of several large projects, including tender management process, contract drafting, claim preparation and resolution. Ahmed is also knowledgeable in project planning and delay analysis. When out of office, Ahmed usually spends his time with family or programming and playing Football Manager.

Sponsored Content
Donate
This blog and all of its contents and resources are, and will always be, free. If you find here anything useful, please consider supporting me.
Contact Me
Please feel free to contact me anytime. I offer contract review, claim preparation/resolution and other contracts and planning services. Drop me a line.
Sponsored Content