• October 2011
• Site Launch
• RWD
• CSS

Site Launch: JeffBatterton.com

Responsive web design, progressive enhancement, CSS illustrations, fresh look and feel: some of what you’ll find in the long-awaited launch of the all-new JeffBatterton.com.

Over the past year, I’ve been pretty busy. I’ve done some really exciting work for a small social network with huge potential (that I can’t name), I’ve worked with a few agencies, and of course I’ve done a lot of work on my own. These were all amazing experiences. However, they have caused me to fall behind on my blogging and the upkeep of my portfolio site. So a few months ago, I decided that it was time for a rebrand/redesign/relaunch and hopefully getting back on track with my blog.

Personal

With my JeffBatterton.com designs in the past, I’ve always tried to focus more on the actual portfolio content than on me as a designer/developer. It’s almost as if I were eluding that the work is all that matters; everything else is secondary. Not that I’m saying that’s the wrong approach, it’s just not the direction I’m wanting to take my career. That in mind, I’ve rethought the kind of content that would displayed in my site and I’ve decided to add quite a lot more than what was present in my previous versions. This decision will ultimately enable me to develop much stronger relationships with the people I work with; something that I am going to pursue a lot over the next couple of months. Anyway, more on that later.

Technology

So it’s no secret that web technologies are expanding at an extremely rapid rate. And it’s probably also not a secret that my previous site was...um... lacking a bit in the area of advanced technology. There, I said it. Not at all the case with this new version. I’ve knocked out the stops and really took this one over the edge — WAY over the edge.

Responsive Design

Of course it’s one of the latest buzz terms, but responsive web design is also a very interesting path down which I’ve decided to travel with this version. Yeah, go ahead and re-size your browser, I’ll wait right here. Cool huh? My site resizes/reformats to allow for standard/desktop view, the on to a smaller version for iPads and other tablets/netbooks with smaller screens, and then finally on to a fluid variable-width layout for mobile devices. I had a lot of fun with this and I plan to further explore responsive web design in the future. NOTE: This is actually my first responsive web design project. I’m still very new to the subject and I know there’s a lot I could/should have done better. I also learned quite a bit more about RWD after this site was built.

CSS Graphics & Illustrations

Of course, there has been a lot of negative noise abroad lately concerning CSS graphics. Certain people are throwing a blanket statement over CSS graphics suggesting that using CSS to design graphics is the equivalent to using HTML tables for layout. I understand from where this concept is coming. However, I think the statement should be revised. My personal opinion is that if you aren’t adding any extra/unnecessary markup and browser support isn’t a concern, CSS graphics are the way to go. Anyway, that’s my opinion and I’ll blog about that at a later time. Meanwhile, you may be surprised to discover which graphics on my site are actually CSS-generated and not linked images.

Obligatory Browser Support Statement

What about IE, you ask? Truth is, if you’re using IE, chances are you’re not going to appreciate the time and effort I put into designing beautiful graphics. Of course, this mindset doesn’t work on every project, but it sure enough does on my portfolio site!

In Conclusion

So those are some of the really cool key features that I wanted to point out. I’m sure you’ll find a few others that I’ve not mentioned as well as an “Easter egg” or two. I hope you enjoy my site and I hope you are inspired to do something amazing.

If you like what you see, go ahead and share this post. Tweet it, email it, post it on your blog/site, tattoo the link on your forehead...ok you don’t have to do all that. But I won’t complain if you do. Well except the link on forehead tattoo thing, that’s a bit extreme.

Anyway, have an amazing day and thanks for visiting.

Cheers! J