User experience experts and web developers have a tough course; not only do they have to work together to create an aesthetically pleasing, functional site, they also have to dig deep into user psychologies to develop experiences that leave a lasting—and positive—impression of the brand. It requires both careful precision and a bit of guesswork, but the recent emergence and development of data trends is making the process more accessible.
John Chow released a new version of his site on September 10th, sporting a more controlled, almost corporate look compared top the previous version. The new John Chow dot Com is the third version, and was designed by Unique Blog Designs. In many ways, it is a better theme, but there are, of course, some things I’d like to comment on.
Just like when TechCrunch redesigned, John Chow’s readers have voiced a lot of comments, 227 of them as I’m writing this. Nothing gets the readership involved like a brand new design!
- I like the fact that they got rid of the car in the header. Nice balance between logo and the 468×60 pixel ad as well.
- The logos for ad and affiliate networks that John pushes aren’t obtrusive, thanks to being in grayscale until you hover them. This is nicely done, since they should be annoying just because of their placement under the main menu.
- The RSS and subscription functionality in the top right column blends nicely.
- Good spacing in the ad segment, under Blog Sponsor.
- The Featured Video box works nicely together with the ad below, and the recent photos, and the about box.
- I like the navigation links below the entire site, even though it is a bit illogical to have them below the copyright type.
- The JC logo is bland and boring.
- The site lacks color, it is basically just white, light grey, and a very tuned down blue, which makes it look corporate and stale.
- The Recent Photos block is pretty nice, but it needs to be better aligned with the width of the column, now it is 20 pixels less wide than the other elements in the middle column on the front page. If the plugin used won’t solve it for you, then put it in a box or something.
- The categories part of the footer is decent enough, but the rest of it is a bit messy. I’d also do the copyright text in a different color, font, or whatever, to cleanly part it from the content in the footer.
- The about page isn’t optimized for the design at all, sporting too little content to fit with the right column, and a photo that is too small. Same goes for the contact page, really.
The What Now?
- Contextual keyword ads in posts are one thing, but why are they in the featured articles slide?! Same goes for the listings of blog posts on the front page. Really, that’s too much.
I can’t say that I’m thrilled about the new John Chow design. My main issue with it is that it feels like a corporate website rather than something from “a Dot Com Mogul”. At the same time, there are some really good layout decisions here, and I especially like the way the header manages to not feel littered with ads.
One other color to work against the stale look would do a lot to lift this design.
What do you think about the new John Chow dot Com redesign?
Michael Arrington’s web 2.0 startup news blog TechCrunch isn’t just a huge success, making Arrington the poster boy of the tech blogosphere, it is also a very prominent leader in the blogosphere. When TechCrunch changes something, other bloggers look at it, and sometimes copies it. It was like that with the 125×125 pixel button ads, the de facto industry standard in the blogosphere right now, which I daresay got big because of Arrington’s design change in 2006 (from this version, I might add, to the previous one, screenshotted in this post).
And now they sport a new design, which in turn have sparked a lot of commentaries in the blogosphere, as well as 300+ opinions voiced in their Yep, We Redesigned post. Everyone’s got an opinion, it seems, as always when it comes to something as personal as design.
In other words, I won’t shut up either.
- I like the whitespace, the easy colors, and the choice of fonts.
- Front page using excerpts tightens the design a lot, toning down the need to scroll, and brings a better overview. I don’t care if the main reason is to get more pageviews, this adds to readability in TechCrunch’s case.
- Top story on front page works, although I would’ve wanted some more schwung to it perhaps.
- I like the middle column in the front page, only present for as long as needed. It works surprisingly well and almost gives the stories left of it a sort of a sub-top-story feel to it. Almost…
- Previous/next post links on single posts are always good.
- The far right ad column is cluttered. Also, ads aren’t ideally aligned/placed, however, this isn’t something that is easily resolved, and ads are always the great EVIL of a design, so I won’t say more about it.
- The site looks pale on high resolutions with maximized browser windows. Granted, that’s hard to do anything about if you want a clean and sober look.
- The footer is simple, which is good, but I would like something more there. Especially on short posts with few comments, where the right ad column is a lot longer.
- The subscribe element on the top of the right column is confusing. I expected some sort of tabbed box, instead I got links. I also miss the RSS icon (available in the footer), since it is something I think should be pushed.
- A network menu is good, but it is not obvious that it is a network menu, it could just as well be a TechCrunch menu.
The What Now?
- Why do you have previous/next post links on top of single posts? Sure, they might come in handy with short posts, but I find them unnecessary.
- A blog like TechCrunch could really use a little more elaborate archives page. This one is just lazy.
- No dates on the front page. While this is something I normally think is OK, the news orientation of TechCrunch makes me think it should be there.
Among the criticism of the new design is the fact that it isn’t “TechCrunch green” enough. The previous one certainly was. Personally, I think it does alright on that area, with a simple green bar in the absolute top of the browser window, green links and green hovering on headlines, and so on. It works, sure, it could’ve been picked up a bit more had they wanted to, but I don’t think there is any actual need for it, really.
Also, while clean, sober, and whitespaced, the design is a bit boring. I should like it, and I do, but it is a bit too corporate for my taste. That is a fine line to thread, and I think the real issue there is the use of images. Just doing logos, and always having them on the same spot, certainly doesn’t help with de-corporatifying the design. Then again, it is a business focused blog, so it isn’t necessarily a bad thing. After all, trying to be something you’re not isn’t something for the faint of heart, so why go out and about trying to look like a magazine, when you’re a news blog about startups?
My verdict: A step up, clean, sober, suitable, I like it overall. Good.
What do you think of the new TechCrunch design?
08/08/08—what a date for today’s Friday Focus! Aside from celebrating the start of the Beijing Olympics, how about enjoying some user-generated goodness for our sites this week?
Designs of the Week
This mashup brings together all 08/08/08 content from all over the net, particularly through Twitter, Flickr, Technorati, and Google. This site is beautiful not just because of its catchy logo (which you can download and personalize), but because it also presents oodles of content from everyone in a well-organized manner. I only wish it auto-refreshed!
There are several different things I like about the interface of this site, but what I like most is the pseudo 3-dimensional look applied to the header and other elements.
The variation in image sizes lead the visitors eyes effectively: there’s one big featured image that spans the width of the layout, then there’s the left column contains medium-sized images for more popular creations, and finally there’s the right column containing small images for recent creations.
Social Media Weekly
Design – 14 Design Retrospectives
A list of articles that describe the redesign process of their websites. This tip is twofold: you can get inspiration by reading them, and when you’re done with your redesign, be sure to write about it as well.
Programming – Facelift Image Replacement
An image replacement script alternative for those who want to use fancy fonts.
Welcome to the new version of Devlounge. I have revamped the design to make things easier for the people involved in running this site. The previous version, being a nice piece of work for sure (I doubt Splashpress would’ve bought it otherwise!), had been around for a while, and it’s always good to redefine oneself every now and then.
So here we are, with a new version of Devlounge, for all the right reasons, I hope.
More importantly, it was necessary for us to redesign so that Devlounge would fit better in the Splashpress network (which isn’t fully integrated yet), as well as find its new voice. You have probably noticed that we have experimented a bit with various types of content during the past month or so, and spoken directly to some of you to make sure that we’re reading things right. It’s always hard to butt in as the poor bloke in charge of a recently acquired site, especially when you haven’t bought it yourself.
So here we are, with a new version of Devlounge, for all the right reasons, I hope.
So What’s New?
Besides a visual overhaul, still pretty true to the Devlounge look and feel I’d say, the big news is the way the content is categorized. In the backend, a lot of old things and choices still lingered, which is fairly common for sites in constant evolution actually. The key is to focus it so that you can have actual use of things like categories, tags and so on. It’s only natural that things are piling up, so this week will involve me re-categorizing a lot of content to fit our main categories. These have been described earlier, in the sneak peak post, but here they are again:
- Code focusing on PHP, CSS, XHTML and similar, tutorials and snippets
- Design on trends, web 2.0, inspiration, critique and praise
- Opinion being commentary on the web from the staff, will probably delay this one for focusing reasons
- Publishing blog platforms, forum systems, open source applications as well as paid ones, things you need to publish a website, basically
- Strategy for launch and relaunch, monetization and SEO, things to help you succeed
- Webapps is about online tools, necessities, desktop replacements, cool apps, things like that
The reason is of course to make it easier for the readers to find what they’re looking for. I have chosen to put the menu to the right, in favor of the descriptive type, otherwise I’m a fan of horizontal menus.
So category listings with relevant content will be coming along during the week, as will a dedicated archive page, an author archives at that.
The front page is new as well. It’s not the version I showed in a concept mockup way back, but a more straight forward one, displaying the latest articles straight up, but having space for more visual pushes at the top. I expect to tweak this a bit, to find the way to manage it and use it. It’ll be one of those elements where you have to find your way.
What About the Content, People?!
Yes, I’m getting to that. The whole purpose with a redesign is to elevate the content, and I’ve had the feeling that we needed to do that all along. There’s a lot of cool features planned, including my promised ones on bbPress, and I’ve got some promising writers on the way in as well. The idea is to up the publishing schedule, and offer a solid mix of articles and posts in the topics described above.
The whole purpose with a redesign is to elevate the content
I’m also hoping to be able to look through and update the WordPress themes offered here on Devlounge, with better support. Still working on how to solve that.
And yes, the previous Devlounge design will be released for free! Just don’t expect it right away, there’s probably a lot of hacking and customization to do to get it download-worthy. After all, it was made for Devlounge, and not general use.
We’ll offer more downloadable content as well, as we get back into our groove. Expect cool stuff coming out of the article series planned for this Summer… Tease, tease indeed!
This Week Might Be Rocky
Finally, I’d like to warn you all that this week might be rocky, as I take the time to manage the content as well as clean up a few things. I wanted to get this version out in the open, for feedback (the comments are wide open for you!) and reflection. The idea is to make Devlounge great, and that will take some effort for sure.
Expect a follow-up post on the progress late this week, or (probably) early the next.