Reboot Successful

Update, November 1: The CSS Reboot site is now showcasing all of the new designs. If you like my design and wouldn’t mind taking a minute to vote for me, that’d be radass! You can do so here. It’s sorted by username, so just look for me… about half way down.

Whoa, hey… I’m back! Feels like I’ve been offline forever, when it was only a couple weeks. Which in internet time, translates to about 2 years, I’m sure. Anyhow, I’m back and I’ve got a fancy… errr, dirty new site!

As I mentioned previously, I took part in the November 1 CSS Reboot and there’s a good chance that’s how you ended up here. So, to all the new comers, I welcome you and thank you for stopping by. Feel free to drop me a comment or email to let me know what you think of the new site.

Now, if you’ve been here before, you should be noticing some massive changes. First and foremost, I had to figure out what I wanted to do with this site. It’s been online for about a year and a half now and everything’s been pretty ‘by-the-seat-of-my-pants’… and I mean everything! The presentation was horrible, content was all over the place and I didn’t have a posting frequency that could be identified. So, why would anyone who doesn’t know me personally want to come back? Once I addressed all of the above, I was able to plan my course.

It took me a while to organize the homepage. I had a long list of things I wanted right up front, about half of them made it into the final version. I narrowed it down to things that relate directly to my most common posting topics. Gaming, music and tech/web related stuff that is presented along the right column and along the bottom. All of the ‘external’ content is marked with green headers, which I’ll get to in a second. The main content of my site is the blog, so obviously, it gets the most space and is first in line in terms of how the content is laid out. I like the idea of ‘featuring’ the latest post – which is what I’ve done, but also provided the next 5 most recent posts directly under the latest post. Similarly, recent comments are presented in the same fashion. Also, rss feeds for both recent posts and comments are provided at the top of each section.

Colour

I knew I wanted to go darker from the get-go. To offset the gloom that can accompany a dark design, I threw in 3 bright and cheerful colours. Pink represents personal content of mine ,while blue is user contributed and green is ‘external’, or links away from this site.

CSS/Validation

I used this opportunity to try out some of the new techniques that have come to light lately. Namely, CSS Sprites. Originally, I had planned to use this technique for all of the headers, but decided against it due to the varying colours and background colours. Instead, I used it for the navigation (which is actually only half there at the moment). A quick rundown for those that aren’t in the know – the CSS Sprite technique is to use a single image containing multiple elements and use CSS to move it around and display the portions you want for given areas. Have a look at the nav image, and it should click, if it hasn’t already.

On a few posts, my site doesn’t validate. This was a tough decision. I know why it doesn’t, and I know how to fix it… but I’m not going to! *deep breathe* There! I said it! I decided to go with content over validation. If you check out my Quake 4 post, you’ll see a ‘Related Media’ box floating to the right of the content. I figured this was the best way to present this content to ensure it isn’t missed had I placed it post meta section where it was originally in my design mocks. If you view the source, you’ll see why it doesn’t validate – an unordered list wrapped in a span which is enclosed in a paragraph. Clearly, this is not valid code. But I need that content where it sits and can’t figure out how else to do so with WordPress. If you have any ideas, I’d definitely like to hear them! While I’m not going to lose any sleep over this… I would like to see the entire site validate.

Edit November 3: Now validates under XHTML 1.0 Strict guidelines.

Tags and Categories

Perhaps my favourite among the heard of social web apps are tags. Technorati seems to be leading the pack, so I decided to go with them. I have a WordPress plugin running that allows me to add tags to my posts which generate a wicked nice tag cloud on the Archives page. At the same time giving you a new way of finding content that may otherwise be buried. The first obstacle with introducing tags was that I found myself tagging posts with words I had used for categories. At first, I was contemplating getting rid of categories all together. But I do like the broad scene of a category and will often browse a site by category over tags. Instead, I redefined and cleaned up my categories and made sure that tags and categories don’t cross paths. I’m pretty stoked to think that you can browse all my posts to do with gaming, or only the ones specific to Xbox or PC, or whatever your preference may be.

Video Content

I’ve wanted to bring video to my site for quite some time now. But I wasn’t sure how I was going to display it or for that matter, what I was going to present. After discovering FRAPS, the latter was clear. I’m always going on, telling friends about the games I’m playing. Half of which would love to at least see what I’m talking about but don’t have a machine capable of running some of today’s more demanding games. I figured I could bridge that gap by adding gameplay footage to my quasi-reviews. But then there was still the question of encoding and which is best suited for my needs.

Flash Video was my first choice. Most users already have the plugin installed and if they don’t, it’s about 30 seconds to get setup. It’s super quick to load and streams flawlessly. Not to mention the flexibility you have with the interface. But alas, the Flash Video 7 just wasn’t looking so hot under 700kbps and the file size was a little on the huge side.

The new Quicktime H.264 codec is simply amazing, but too new, too much of a pain to upgrade/install and only available to Windows 2000/XP users.

My last choice (well, Real would be my last, but the last I would actually use on my site…) was Windows Media. It ended up looking the best, next to Quicktime and had the smallest file size. Also, since the majority of my visitors are Windows users, I figured there probably wouldn’t be many that would be required to download and install the 10mb+ media player.

Then Flash 8 was released. Suddenly, video at 400kbps looks great and the file size is a lot more reasonable. I made up my mind and converted the videos encoded in WMV to Flash 8 (yes, the Flash 8 video encoder can do that!) and will be using it moving forward. It does require an upgrade if you have any version prior to Flash Player 8 installed, but again – it’s a 30 second process, max.

Moving forward, I’m planning to include video with all of my gaming posts. Whether it be an HDR demonstration (Half-Life 2: Lost Coast coming soon!) or simply gameplay footage. Video content will be a regular occurrence from now on.

Photos/Screenshots/Flickr Feed

I’ve had a Flickr Pro account for months now, but I don’t even own a digital camera – or at least I didn’t until this afternoon. Deanna and I combined our efforts to get ourselves an early Christmas present. We picked up a Sony Cybershot DSC-W7 7.2 Megapixel camera this afternoon. Needless to say, I’ll finally be able to make use of my Flickr account! Stoked!

Also, to go hand-in-hand with the video content, I’m going to post game screenshots on Flickr. I usually include one or two in a gaming post, but I take a ton. I think I had close to a thousand by the time I finished Half-Life 2. I plan to upload them in batches as I play through games. So there very well could be screenshots showing up on a daily basis.

And finally, this is where the Flickr feed comes into play. I don’t expect anyone to bookmark my Flickr page and I sure as hell can’t be bothered posting a notification every time I’ve added a new batch of photos/screenshots. So, at the top of every page, the 5 most recent photos to be added to my Flickr account are displayed.

Quick Bits

I come across things on a daily basis that I’d love to post about. But I’m not keen on short posts whose sole purpose is to point you in another direction. Enter ‘Quick Bits’. I’m using the built-in WordPress links manager to present these, so they don’t get archived and don’t appear anywhere else (including rss feeds) but the Quick Bits section on the homepage. Expect to see these changing quite frequently. I usually check my feeds a couple times a day – and usually see one or two things I’d like others to know about.

Still to come…

As if all this change wasn’t enough… I’m actually no where near where I wanted to be. A big goal for this redesign was to finally display my portfolio. Unfortunately, I wasn’t able to pull it off, but I am working on it.

From 1997-2002 I played drums for a ska/punk band called Lucky Number Seven. This band played a huge role in my life for the five years we rocked Ontario and I’d like to pay some homage. I plan to create a sort of LNS shrine, if you will. A bunch of photos, some stories of some of my favourite memories and all of the recordings, plus some live shows for free download.

Well, I think that about covers it. If you read that whole thing, I must thank you again! Congratulate yourself for reading the Longest. Post. Ever. And thanks again for stopping by.

Happy CSS Reboot to all the other rebooters out there!

Oh, and yes, I do realize I went live a little early. The official Reboot time is 12am GMT on November 1 – which is 7pm EST on October 31. I’ll be out trick-or-treating at that time with Hannah and I have to work all day, so I went early. And… it might have had a little to do with me being super stoked about launching my new site! But not much!