New 2012 Site Design

Just over a year ago I retired my old “The Humanaught” moniker and replaced it with the current domain. The change-over brought in a new site design — but not one I was ever overly happy with structurally. It had some things I liked, and a bunch of awkward things that I was constantly working around.

So the other day I decided enough was enough and started fresh. As this is my personal blog, I wanted a design that was fun, interesting and showcased various things I like. I also wanted a bit of a sandbox that I could play in with new CSS3 and HTML5 goodness. And so the 2012 edition of the site was born.

One of my objectives was to make the site lighter (in weight, not colour), but still be a bit of a visual smack in the face. As such I’m using CSS instead of images for display elements wherever possible — true, this is a good practice all around, but one that is easily ignored or forgotten when you’re eager to get things “just so”. Fortunately CSS3 support is pretty much across the board now (thanks for joining the group IE9, your dusty nametag is by the door), and that opens up a huge palette for a Web designer to play with.

This has resulted in a theme that uses only about 10KB of “layout” images, not counting the various background photos (which can be customized page-by-page — see the about page) or the slightly heavier home page due to those big social icons.

<rant>
However, if you still happen to be using an old browser, things are going to look a bit sketchy for you. I spend a lot of time making client sites backwards compatible, and it’s frustrating. Next to bookkeeping, it’s about the most mundane and irritating part of my gig. The truly insulting bit is that there are few things simpler than upgrading to a modern browser, and yet people refuse to do so. And this is why for my site, my site, I’ve said “to hell with it” and have barely given those fools a code line of consideration (if you are part of the 2% that come here using IE6 or IE7, I just called you a fool, de-fooling yourself is easy). A modern Web experience and browser security obviously isn’t a priority to people who are using 10-year-old browser tech, and I’d be doing them a disservice by enabling them to continue using it.
</rant>

Anyway, the design still has little ways to go, and there are lots of small (and largely long-forgotten) legacy things that will need to be dealt with (the downside to running this blog for a little more than 8 years now — seven of which have been in China — is that the way I laid things out in the past is a far cry from the more standard way I do things now, lesson learned).

One other change is that I’ve done away with Disqus for comments. As a rule, I try to avoid 3rd party integration for things that core software does well enough. I wanted to give Disqus a try though and so had installed it with the last update (a year ago). Overall, I like Disqus’ functionality, and I like that it pretty seamlessly can be enabled and disabled (you’ll notice all comments made during my Disqus trial are still there and still in the proper hierarchy). It also has some great SNS integration. However, I do a lot of work with WordPress, and I’m used to the WordPress way of managing comments. Because of that, the Disqus system never really felt comfortable to me.

I think that about covers it. Hopefully the new theme is as enjoyable to visit as it was to put together.

15 Responses

    • My head… palm tree… wha? You mean the screen capture? Lol. Hadn’t even noticed. The image resizes based on your browser, so (hopefully) my head isn’t palm-topping for everyone. Would sort of be fitting though…

    • If they’re limited to IE, that’s cool, as IE9 is pretty great (about where other browsers were 3-4 years ago). If they’re limited to IE6… then strictness is allowing them to be the next botnet. Outside of that, you should be golden.

  1. Loving the new design Ryan! Excellent stuff. I’m also loving the CSS3 features. If there’s one thing I would change in your design is to make the transparency of the top header just a bit more opaque (or not transparent at all). But hey, that’s just personal preference.

    Good job though! The comments section looks amazing.

  2. I’m all for upgrading, though I feel I should defend the 2% that might not just be too lazy to upgrade.

    Sometimes these poor buggers are forced to use old crappy browsers at their job, because their IT department’s age old policy wont allow them to upgrade.

    But that has to be a minimum of places and the future waits for noone.

    • The problem with an IT department forcing users to stay on old (and with IE6, we’re talking 11 years old) technology is that there is a flaw in policy. I get why it’s there, to prevent every jackass at the company from installing BT clients and such, and also to aid in the ability to upgrade/troubleshoot things consistently. However, when it comes to modern browsers, and their ability to easily auto-update and the fact that each new release brings with it as many security improvements as it does aesthetic/functionality improvements means that these IT departments need to change, and the Web should not accommodate their lack of willingness to do so.

      The biggest reason I still end up designing for IE6 though is simply that in China most Windows OS are pirated, and so don’t have Windows Genuine Advantage and can’t upgrade (easily) to IE8/9. The other (terrible, terrible) thing is that a lot of home-grown browsers (ie. 360) are built on the IE6 rendering engine. Professionally, I can’t ignore it, privately… fuck ’em 🙂

  3. Dude, that was quite a stunning and effective protest. Really kicked me in the eyes (in a good way).

    Oh, and to me your head floats between palm stumps, but that’s ok, it looks like the kind of head that is meant to float between palm stumps. Nice upgrade.

  4. Pingback: New 2014 design - simplification - Ryan McLaughlin

Leave a Reply

Your email address will not be published. Required fields are marked *

*