Whew. This took way too long, but here we are with a new design! I am loath to admit that I’ve been building this off and on for 2 years, but it’s true. Let me give you the rundown.
- I’ve lived with this last design for quite some time and it was getting stale. I wanted something a bit more flexible and brighter.
- I wanted a view into my social graph (i.e., everything I’ve been doing outside of this site).
- I wanted a project that would take way too long to finish and become way too complicated (not exactly true).
The Design
I’ve long pined for the beautiful structure of Khoi’s blog and the free-flowing nature of Jason’s. I’d like to think I created something original that draws from what they’ve been doing for years.
The fonts in use are FF Tisa Web Pro, FF Enzo Web and Verdana (my commitment to chunky sans-serif fonts continues in this latest iteration.). The first two are served from Typekit1, which has been a fun experiment.
As for the colors, I just wanted something bright and fun. I tried to make use of the color as an accent instead of blinding you with a yellow background or blue body text (don’t cross me or I just might). I think the color choices are the most successful aspect of the site.
The Social Graph
Like most of you, I’ve been Twittering and Flickring for quite some time, and I wanted to get that onto the site. Sure, I could have used the widgets they provide or even the action streams provided by Movable Type, but that would have been “fast” and “easy”. So, I wrote a set of scripts that grab data, parse it and write out some interesting widgets throughout the site. Some of this stuff is a little buggy, but for the most part it turned out well.
You can see good examples of this by looking at the monthly archives, which only have data from that month, instead of just the most recent. I wanted it to be a view into what I did for the month (probably more for me than you, when I think about it). The homepage has some nice views as well. You’ll notice a graph for the top Last.fm tracks. I built that using Highcharts, which is a jQuery graphing library. I’ve been playing around with these for a few months now — mostly at work — and this one is the most full-featured. I also really like Bluff.
Since this is only bringing in data about what happened and when it happened, I’m also reviving reviews. I haven’t reviewed anything here since 2005, but that will change post haste.
The Tech
The site is powered by Movable Type 4.33, several MT plugins, jQuery, Typekit and the custom social graph scripts I wrote. While everyone else is moving to hosted blogging solutions, some of which are awesome, I’m still a tinkerer. I want to be able to dive in and play with the code. It forces me to learn new tricks, even if I occasionally have to debug an errant template.
I’m using jQuery in some fun ways around the site. You’ll notice at the bottom of the home page you can load new entries. “But Matt, how is that possible if you use a CMS that publishes static files?” Well, in MT 4.3 I helped usher in the ability to paginate entries and I thought it was only appropriate I put it in action here.
Another change is the addition of authenticated commenting and tags. You can still comment anonymously, but now Facebook, TypePad, Google and Yahoo! users can log in and keep their identities. In regards to tags, I’ve been adding them to entries for a while now, but I’ve gotten around to exposing them.
Finally, I have dropped support for IE6. Only 3% of my visitors use the browser, so sorry dudes. You’re out of luck. The site does still have some issues in IE7 and 8, but I’ll fix those over the next week or two. Ya’ll can read the content just fine, so I think we can both wait a bit.
Summing Up
I’ve been blogging for over ten years (yeah the archives only go back to December 2000, but I lost some old hand-coded entries) and I feel like this is the first design I’ll be able to (intentionally) keep going for some time. I also feel like it represents who I am right now.2
If you happen to find anything that looks odd, feel free to let me know. You can find contact information on the about page or just leave a comment here.
Thanks to everyone for visiting over the years. It’s been fun so far and I’m looking forward to many more years of funning with you.
Footnotes
- Typekit has been fantastic, but it’s still a bit buggy. You may notice some issues here and there (especially in Internet Explorer), but I’m going to live with it. The service is run by smart people, so I’ve got confidence. ↩
- How right now is it? The about page uses a random Flickr photo of me. That’s pretty right now, right? ↩
02/15/10 11:15 PM
Am I supposed to say something like, "FIRST!"?
Looks great, my friend.
02/15/10 11:16 PM
Thanks Dan! I'm just glad commenting works!
02/16/10 12:04 AM
Great job, dear husband! Now, how bout that photo blog?
02/16/10 12:15 AM
A beaut, I love the graphs.
02/16/10 1:28 AM
I'm with John, the graphs are awesome. I dig everything about the design. Lively colors. Great mix of all the services out there. Fun fonts.
One niggle? I love the reviews landing page so much, I want access to those categories (and homepage sidebar content) in more places. I temper this love with the cleanliness of single entries, so I'm torn.
02/16/10 1:46 AM
Nice work. Sign me up for another year's subscription.
02/16/10 2:00 AM
Lovely work! The graphs on the side are great and I love the use of non-standard fonts through TypeKit.
02/16/10 6:26 AM
Wonderful work. The color scheme is a real win; the green and black in the header is bright and fun, as promised.
Oh and is there a way to save comments that a user might have started to enter prior to signing in? That's what just happened to me; I started writing this comment, then realized I needed to sign in at left, went off to another page, and when I came back everything I'd typed had been cleared already.
Anyway, the whole thing is great. Congratulations.
02/16/10 6:51 AM
This is good.
02/16/10 9:39 AM
My first critical thought was "the navigation is fun!"
I think the fact that the word 'fun' shows up repeatedly in this feedback points to how successfully the new design represents you, my friend.
02/16/10 10:41 AM
Looks nice. Congrats!
One minor issue? Maybe the linked text is a bit light colored with the font? Makes it a little difficult to read. But it may just be my eyes.
02/16/10 11:04 AM
Thanks for the kind words, everyone.
@Glass: Indeed, I am torn. I'd like to integrate more into the sidebar, but I want to let it marinate a bit more.
@khoivinh: A wonderful feature request that I'll pass on to the Movable Type team. Maybe I'll use some Javascript to copy the text to your clipboard automatically if you click "Sign In".
@tienmao: Yeah, it's a bit light. I haven't spent as much time looking at this on monitors that produce less light (this MBP is bright!). I'll keep it mind though.
02/16/10 11:14 AM
Nice work Matt!
I love the fancy fonts and review landing page.
02/16/10 11:45 AM
I love the colors and the different displays! nice job Matt!
02/16/10 2:35 PM
Looks GREAT, Matty! I especially like the fonts and graphs. Been looking into HighCharts myself recently; this is a nice implementation. I also REALLY like the fact that you've captured your "social graph" for each of your monthly archives. That will be fun for you to review after another 10 years of blogging has gone by!
02/16/10 2:40 PM
Pretty! I like it!
02/16/10 7:12 PM
Oooh - so much fun! I love the sidebar too. Congratulations! (Does this free you up for new projects?)
02/19/10 12:54 AM
Super redesign. Clean. Innovative. Fun. Love it!
02/19/10 3:38 PM
@Liz: Yes, I suppose it does! First on the docket is my wife's photoblog; she's been waiting the longest.