A whole new theme

Upgrade complete!

It has been a long time coming.
My git repository informs me that it’s been over 9 months since I started working on this particular version of my blog theme.
And now I have finally got it to a point where I have applied it to my blog.
This new theme I’m proud to say was both designed and implemented by me.

If you never got a chance to see my old theme, here’s what it looked like:
old blog theme

There were a few things about the old theme that bugged me.

  1. Videos weren’t properly responsive. At mobile sizes videos pushed out of the bounds of the article and allowed horizontal scrolling of the page. You just don’t do that on mobile.
  2. Users had to scroll to the bottom of the page to access the search or categories list. This was particularly bothersome on the home page as you had to scroll through many articles to get to the bottom of the page.
  3. The theme was very… generic. It was a copy of an older version of the Response theme that I had made a few small modifications too. While alright, it wasn’t really something I could be proud of. As someone who does a lot of web development at work, I wanted to apply some of those skills to my own blog.

My design went through a few revisions, starting with this rather plain design:
blog theme first attempt

But ending on something that looked a bit more like this:
blog theme better attempt

My intention was to create something that was simple, but powerful.

I really liked the idea of having a large image at the top of my blog and articles as I felt like it was a good way to set the tone for the article. Also, since a lot of my words of the week come from anime, it’s a good way to show off some art that’s either related to the word or from the anime that I heard the word in.

I also wanted to keep the listing pages short. I didn’t like the idea that people were forced to load my top (however-many) articles when they came to my blog. Instead I wanted to present some initial information about the articles and allow the user to click through if they wanted to read the article.

In regards to the content bubbles, I drew inspiration from the default theme of Tumblr for this. I like the way Tumblr separates it’s posts, I also like the look of modular content blocks. So I implemented something very similar. With the blog article pages simply being one larger content block that is displayed in a similar way to how it appears in the listing pages.

There are still a few kinks that I will iron out over the next couple of weeks. Some involving me going back over old posts and updating them with better tags and to match the new format.
I might also need to make some changes to my feed generation to ensure the Japanese Word of the Week posts have the desired information in them.

If you have any feedback or suggestions, then let me know. I’m happy to hear it. :)