Responsive starter theme now with genericons

genriconsIf you’ve visited the Bluelime Media website lately, you’ll have noticed that it’s undergone yet another design change. This latest design is simpler, I removed a lot of content but more interestingly, I substituted the social media icons with genericons. Genericons are vector icons embedded in a webfont designed to be clean and simple keeping with a generic aesthetic. Brought to you by Automattic, they are indeed a pleasure to work with.

With more and more folks migrating to new Macs with retina display, I thought it would be a good idea to get in the habit of using vector icons.

In addition to the Bluelime site, I’ve also built a few responsive sites lately and my starter theme has proven very handy. However, I did find myself changing the same things over and over again. So earlier today, I made the following changes to the BLM responsive starter theme.

  • The social media icons have been eliminated and replaced with genericons. I also had to replace delicious with tumblr. Delicious is no longer as popular as it once was.
  • I’ve updated both desktop and mobile navigation. The small menu now display the menu title and upon click opens up the navigation.
  • I’ve simplified the CSS and removed the gradients from the navigation.
  • The header image, if used, now links to the home page.
  • I’ve also updated silly errors here and there that Robert must have missed.
    ( ahem.. yeah, it must be his fault. I wouldn’t have done that.)

If you’ve used the BLM responsive starter theme, I would love to hear your thoughts. If you think it could be improved, enhanced or modified in any way, please let me know. For those interested in seeing the code changes, have a look through the commits.

Responsive Theme and Patterns

These past few weeks I finally started getting serious about responsive sites and finally completed my Bluelime Media website conversion. I started almost a year ago, but never got around to finish it. I had the chance to work on a few responsive sites this year and I predict that more and more websites will opt for responsiveness in the future, so as the saying goes, one must practice what you preach.

Lucky for me, Robert Dall at 32 Spokes, offered to help me convert the Bluelime Media HTML5 basic starter theme to a responsive version. Following an intense week of tweaking, refining and testing, I’m pleased to say that a responsive version of my starter theme is now available for anyone to grab on Github.

Like my other themes, this theme contains the bare minimum. The theme also only has one option for mobile navigation. There are loads of different options one could choose and one couldn’t possibly include them all.

If you’re looking for different responsive patterns, you might want to visit and bookmark Brad Frost’s collection of responsive patterns. Brad has compiled an amazing list of useful patterns and resources.