Just when I got done patting Yahoo on the back for taking the design lead with Yahoo Health, they go and one up themselves with their new homepage. The new design offers a rich branded experience while still maintaining focus on the content; and one step ahead of the competition.

You can have your brand cake and eat it too
Yahoo’s new design is a great example of what we have believed for a long time… great visual design and branding aren’t at odds with content, rather it enhances it. Something can work great, be easy to read, and still contain elements that make a strong brand statement. In Yahoo’s past they have typically relied on text only presentations; ugly yet functional. Then, as we noted in the earlier post, they began improving their designs, namely by introducing segmented colors to separate the various areas. Now they’ve shown us they weren’t done yet. This new design uses soft gradients, stronger box elements, and plenty of graphic details all while still maintaining a good visual hierarchy. It’s a leap of faith that proves it can be done.

Space Savers
Yahoo also made a big moves in utilizing DOM and Javascript to keep the page compact yet full of content. They brought the tab motif to the homepage, something most other portals haven’t utilized, and surfaced the most common personalized features through a drop down panel system. I especially enjoyed the new panels. How many of us have gone to Yahoo only to search for that single ‘movie’ link or ‘weather’ which was buried amongst all the other noise? This solution keeps the page clean and clear, yet allows quick access to these often used features. I’m sure some heavy metrics analyzing and user research spawned this idea.

Teach A Man To Fish
One of the best surprises is the training mechanism they used to explain the tabs. Try it for yourself. Refresh the page and watch as the top-level tabs highlight in a timed animation. It’s subtle, yet effective, in communicating that the boxes do something. While tabs may be easily recognized by experienced Internet users, they are still an uncommon motif and can be a point of confusion. For a site with the high traffic level and wide variety of users that Yahoo has, it’s a brilliant, non-intrusive mechanism to aid in teaching functionality. The use of time and animation was well played here.

Wider Than Your Mama’s Blog
Yet another bold move is their use of a wider layout. I’m sure their visitor stats justified the decision, but there’s no surer sign to the rest of us when one of the Internet giants gives it the go. To smooth the road they offer a simple workaround via an options drop-down that allows individuals to opt for an 800 pixel compliant design. This seemed like a good compromise on how to handle the issue for backwards compatibility.
Will We Have A Winner?
So my take is Yahoo is hot, Google is not. In the coming year I think Yahoo will gain a lot of ground against the big ‘G’ with it’s innovation in design and user experience. Other than Google maps, Gmail, and a small boost from the recent Google Finance, Googles recent offerings have fallen short. Yahoo seems to have the ability and passion to create great apps, and is able to tie them together much more seamlessly than it’s competitors. Combine that with the way the brilliant design pattern library is shaping up, and it’s clear they have the design team to beat.
So on that note, does anyone have a way to get me into the new Yahoo Mail Beta?
Update
I just found this screenshot of the new Yahoo Finance. Even more good stuff, and notice it’s a yummy flash app!
Published on May 19, 2006
Resides in User Experience, Design
Comments feed | TrackBack URI
12 Responses to “Yahoo: At it again with stellar design”
1
Marcos Peebles on May 24th, 2006
Hi Ryan, I think you got several points there. Seems like Yahoo is up and running again, like in the good ole days where they ruled the web. We’ll have more comments and analysis in the future about this “relaunch”, no doubt. At least they’re gonna get some respect (again) from designers and coders and the new web ‘trendymakers’
Nice post, thank you.
2
Matthew Anderson on May 24th, 2006
I agree with you. I’m not a fan (user) of portals in general, but the new Yahoo design is rock solid. I really like the new space sacing tabs.
3
Marcos Peebles on May 25th, 2006
And now they team up with ebay, thus skype
The idea of your title (1-0-0) is used by financial analysts also
Plus the Yahoo patterns are as u say BRILLIANT, maybe now that they unveil the recipies (was about time a big company helped us poor little standalone humans) more pple will bake their cakes in a right way
(or even set kinda standards?) wait and see, everything is moving so (too) fast lately, gives me headaches
4
Ryan Nichols on May 26th, 2006
Seems I just keep running into Yahoo lately. A little birdy told me that their team went through around 50 or so versions before settling on what you see today. Now that’s what I call iterating
5
Morten KH on June 16th, 2006
I don’t think you can compare Yahoo Portal vs Google search engine. As I just stated Yahoo is a portal, Google is a search engine.
The website is very neat indeed, thinking about the amount of content it’s able to manage. Google, however, also have a very neat, and extremely simple, website - the simplicity is in it’s extremely small amount of content, a searchfield, and try counting the words, there should be around 50-60.
But this new website sure beats Microsofts live website.
However, there is one website (portal) that beats them all: www.rr.com/flash
You can customize each pods view and content. Every thing is very easily accessible some the menu of expand. And their finance thing even beats Yahoo’s.
I’m not trying to tell you guys that Yahoo’s new website isn’t nice, neat or simple thinking of the amount of content it contains. But you can’t compare it to Google, and rr.com/flash is an even nicer-designed portal, but it does however beat Microsoft. But then again, who doesn’t these days?
6
Ryan Nichols on June 16th, 2006
Morten - I think your absolutely right. One can’t really compare Yahoo to Google’s homepage. They are quite different in purpose. However the comparison I wanted to draw was in their design teams. I feel like Yahoo has a stronger team(s) than Google does. The Google calendar was quite good from an IxD perspective, but I appreciate the Yahoo teams ability to create branded/engaging experiences and still maintain great functionaility…and the guts to do it on their homepage. That’s all.
7
Oscar Alcalá on July 16th, 2006
It´s great to see a giant such as Yahoo trying new things on their homepage. The design looks great.
8
anirudh on July 19th, 2006
Totally agree with your views in this article.
For Yahoo Mail Beta, you can get it if you change your profile locale to UK. Once you get access to Yahoo Mail Beta, you can change the locale back to US and it still works.
9
JoshStevens on October 15th, 2006
Totally disagree with your article. Yahoo has been slacking and now is scared by MSN and AOL. Especially AOL.com, the new yahoo page is a complete ripoff of it. We can finally see that Yahoo has started to wake up because it’s stock lost a lot of value when it last report its flat earnings for the third time in a row. We need companies to stand out, not do the same thing as everyone else. All the big guys, including yahoo, will be humbled when the next Goggle pops up.
10
aka_loshok on March 29th, 2007
11
tfd on June 14th, 2008
dfgsdfdfgd
12
er on June 14th, 2008
rtedfffff