etopiei's blog

A blog about minimalism, programming, productivity and happiness.
All Posts - RSS Feed

Blog Redesign


Recently, you may or may not have noticed (depending on how much attention you have paid) that my blog has had a major redesign. This has been both a UI change as well as a backend change to the code powering my blog. I'll discuss the UI changes first.
The UI was previously relatively simple, I whipped it up very quickly, and with little thought, like most of my design work. While it was functional, I wasn't too pleased with the overall aesthetic and wanted something more simple.
I began by emulating John Gruber (the creator of markdown and owner of 'daring fireball') I liked the simplicty, but also pleasing look of his blog.
I set about creating this design, with the sidebar containing links, and to the right of this, blog posts. While I was pretty happy with the desktop site, and even got one of my friends who is brilliant at art (@b.jadeart on instagram) to help me with the colours and positioning. However I ran into trouble getting this to scale well on mobile, and it quickly became a huge mess of CSS.
So I thought I ought to try again with a different design in mind. This time I started thinking about how I wanted the blog to look on mobile and then scale up to desktop. This worked quite well, and having a header, footer and large bodey of text in the middle made it easy to keep proportions reasonable and ensure it looked good on a variety of devices. I also was excited to try out a darker theme and ended up pretty happy with the colours chosen. If you have any feedback or ideas I'd love to hear them though.
In regards to the backend changes I decided to move away from the difficult to understand code I had originally written which utilised JSON to store my posts. Now I store posts in raw html and render them with javascript, I also utilised a more rigirous naming standard for these files and implemented a seperate post list which contains all the titles of the blogs and is referenced throughout the code.
This new system allows all the flexibility of html as well as the simplicty of presentation logic. The only thing left to do was to re-write the backend that handles editing of posts and adding new posts. Due to the new structure this was also quite simple, and as I'm the only person editing or adding files a basic database authentication system suffices and I was up and running very quickly.
If you'd like to check out the code for this re-design it is up on my Github which can be found at the bottom of the page. If you have any feedback or ideas I'd love to hear them too, feel free to hit me up on any of the social media listed below.
- etopiei (8/5/18)

< Previous Post Next Post >

Post History