I was quite unsatisfied with my tumblr theme so I started to make one from scratch. This is how it went.

Early on, I found out that making a theme for quite easy. It had a moustache like syntax for adding template blocks in your html. I also discovered that tumblr had some pretty rough limitations on how you can make themes.

For instance, I cannot upload static assets on tumblr. Heck, there is no ftp facility.

But at the same time, tumblr themes are lean and powerful. Consisting of only one html page, you can make a lot of stuff if you want to.

Stumbling along

First, I mapped out the limitations of my theme. Assets would be stored on dropbox, Fonts will be delivered via google webfonts and only the html will be copied over on tumblr.

Then I started designing. I realised there was a reason why dev blogs on tumblr are so minimalistic. So I started designing on the principles of less-is-more.

shash7 site preview

Preview of an initial prototype.

Fast forward to some days later when I grew frustrated by my design. The initial site was a single column page but it just didn’t fit in my head.

I threw everything away and started again. But there were a lot of problems in designing the grid and the right typographic combination. Finally I settled on using montserrat as a heading font and the evergreen georgia as the body font.

Finally

I started making some headway. I figured out the content is the king then why shouldn’t it come in the center (Because originally the layout was one column). Unlike traditional sites, the header is on the left and the sidebar is on the right. This gives the content lots of breathing space and looks fabulous, especially on tablets.

Then I started implementing the baseline. Boy was this tough. This was the first time I had paid such attention to typography. But it payed off in the end. Everything started making sense.

As for responsive web design, the columns were simply given a width of 90% on less than 768px viewports.

Conclusion

Did it work?

Absolutely. This is the first time I have implemented baseline strictly in my design. Also, the layout is paying off as the UX is really great and navigating the site is a breeze.

Now onto making some blog posts …