29Sep2009
Website Navigation Then and Now
I recently came across a collection of website navigation bars from a few years ago. I couldn't help but wonder how those navbars looked today, and how the impact of site growth, redesigns, branding updates, etc. have affected them.
Here's a comparison of the old versus the new (click on an image to view a larger version).
Old Navy

Old Navy: then

Old Navy: now
Shopping.com

Shopping.com: then

Shopping.com: now
Adobe

Adobe: then

Adobe: now
Weather Channel

Weather Channel: then

Weather Channel: now
REI

REI: then

REI: now
Amazon

Amazon: then

Amazon: now
Apple

Apple: then

Apple: now
Google

Google: then

Google: now
Netflix

Netflix: then

Netflix: now
Expedia

Expedia: then

Expedia: now
Walmart

Walmart: then

Walmart: now
Pogo

Pogo: then

Pogo: now
All Recipes

All Recipes: then

All Recipes: now
Bank of America

Bank of America: then

Bank of America: now (it hasn't changed!)
Buy.com

Buy.com: then

Buy.com: now
Posted on: September 29, 2009 |
Recent Entries in "Web Design"
38 Comments Posted
It's cool to see how different designers have approached the subject of their nav/header redesigns.
Some have moved away from the whole tab/button thing whiles others have gone down that very path.
Cool stuff!
1. Posted by Evan Skuthorpe on September 30, 2009
Nice collection. I wonder how many of the changes were prompted by usability studies (likely affordable by such big companies) and how many were just to create a new look.
I think the Adobe site got it backwards. :)
2. Posted by Jason Garrison on September 30, 2009
I see that Bank of America used to have "Higher Standards" but no longer do.
3. Posted by KrimsonKing on September 30, 2009
I noticed that less design and improvement on the overall readability of new menus, stood out as the most significant changes across the board. Less (design) is more (usable).
4. Posted by James on September 30, 2009
KrimsonKing — I thought that was too funny. No wonder their CEO is leaving. Props to them, though, for having a navigation/IA that has worked for them all these years without needing to change it. I think.
5. Posted by Christian Watson on September 30, 2009
Hi
Thanks for the great tutorial as it certain helped me look at things differently.
Nathan
6. Posted by Nathan on October 01, 2009
For the most part seem less clunky today and fewer and fewer folks are using the rounded corners.
7. Posted by ncjcj on October 01, 2009
I'm now kind of curious about which of these navigation bars are/were marked up in tables and which in css - and curious to know how much that difference influenced the design.
Also - as a BofA customer, I'd hardly say that their navigation bar or their web site works. Every month, I have to learn again how to make a payment on my credit card and how to view my statement. I have to assume those are two really common customer tasks that should be straightforward and simple, yet aren't.
8. Posted by NatalieMac on October 01, 2009
Style-wise its almost a regression, usability has certainly improved though
9. Posted by crooms on October 01, 2009
I agree it is funny how most everyone moved away from the tabs and gone with more of a linear navigation. This will definitely make me think more about usability when designing the navigation for my web design clients, since most of these guys has undoubtedly have focus groups to research their changes before they make them.
10. Posted by Jon on October 01, 2009
Awesome, I love those kind of posts! But it would be even more fun, if you had used even older ones, like from 1998 or something like that. But still, great list :)
A great place to look for cached designs is archive.org, not working every time but for popular websites quite accurate. Just check out Amazon.com from October 99: http://web.archive.org/web/19991013091817/http://amazon.com/
11. Posted by Chris on October 02, 2009
That's a great collection! Personally I feel less is more with design. I am surprised though that websites still try to cram so much info/content onto their site without any regard for helping people find relevant information! Consider Godaddy....UGH. It would be interesting to see their old look...
Thanks for the post!
-Don (Elliott Design)
12. Posted by Don Elliott on October 02, 2009
Well your article helped me to be more observant next time I visit any website, as I never bothered to notice such minor details as you did. Anyways its good to see the improvement that these sites have made and their new look is very good.
13. Posted by Los Angeles web design on October 03, 2009
It's so interesting how so many of the old designs bring about that 'whatever were they thinking' response ... and yet, at the time, they were probably the bee's knees! This move so fast in this business of ours!
14. Posted by Mark Carter on October 05, 2009
For the most part it hasnt changed TOO much.
15. Posted by chris on October 06, 2009
Thanks for this compilation. It really is amazing how things evolve and leads to the question of what we will be seeing in five years and what we will then think about what we are doing now.
16. Posted by The Minneapolis Web Design Guy on October 06, 2009
I think the Walmart navigation same as amazon.
17. Posted by albert ginger on October 11, 2009
Changing times brings evolutions. This is just a part of it... "the new age web usabilities and designs".
18. Posted by Akbar Shah on October 11, 2009
I think it's interesting to see how a lot of the new navigations are actually simpler than they used to be. I think simplicity has become quite a key design trend over the last few years, and I, for one, commend this trend!
I hope things keep getting simpler and bad design habits get knocked out the window!
19. Posted by James Kemp on October 13, 2009
nice collection. thanks.
20. Posted by erkasoft web design on October 13, 2009
If you guys notice most of modern menus are much simple but sleek. Currently we are also building css menus instead of old graphic rollover menus.
Nice collection you have here. Thanks
Eddie Cheng
Quape Solutions
Singapore Web Design Company
21. Posted by Singapore web design on October 14, 2009
Great navigation changes, some were on web 2, nice list
22. Posted by contractor web design on October 15, 2009
I think the new, clean, sleek, simple navigation is nicer and more user friendly. Many sites with the drop down java type menus are frustrating to navigate. If you are trying to keep people on a site, it's best not to frustrate them.
23. Posted by Cindy Callinsky on October 16, 2009
you can see how they all change to a more minimal style
24. Posted by לימודים on October 17, 2009
Well, nice compilation there. And just to add on, if anyone wanna check back a website's old design, you can way waybackmachine @ web.archive.org
25. Posted by Web Design Singapore on October 23, 2009
This is a great bit of info you have put together. Data like this can help us web developers build our sites the best they can be. I would be interested in seeing the actual dates this changes have been made.
26. Posted by Tampa Designs on October 25, 2009
The shopping cart navigator is perfect, I like it very much.
27. Posted by IECSP on October 28, 2009
Very nice collection! It is interesting to see the differences between "old times" and "present times". As Akbar said, "Changing times brings evolutions".
Keep up the great work!
Ovi Dogar
AbsoluteCovers.com
28. Posted by Ovi Dogar on November 02, 2009
Great post. I enjoyed seeing the evolution of the top navs.
I, for one, appreciate the use of 'white space' and simple navs but I don't care for the apple site. Don't know why - but that's the only one that I think was not a good move.
29. Posted by Andy on December 21, 2009
I enjoyed the difference between old and new ones
30. Posted by Plywood india on December 22, 2009
hy nice post.......
great comparison old & new webdesign of all the popular sites....
really wonderful to see the changes....
Thanks..... :)
31. Posted by webdesign on December 24, 2009
really, your are doing fantastic job and thanks to sharing this post.
32. Posted by small business seo company on January 09, 2010
Nice to see so many examples. Designing trends have been changed to more customer centered approach. New navigation bars or more clear and more attactive.
33. Posted by Sherwin Shine on January 16, 2010
Great Examples of importance of web development
34. Posted by Web Development on March 01, 2010
It's great to see the evolution of the tabs in navigation, but I wonder if it's more about a refinement/advancement in design rather than function. Or, possibly with such widespread adoption and internet use, maybe it's simply a case of people not needing such a bold, 3-D navigation menu, as everyone is already familiar. Great review, thanks!
35. Posted by Web Designer Las Vegas on March 03, 2010
Thats a good tutorial and a a good list. thanks a lot regards tom
36. Posted by Tomcat on March 08, 2010
Well, great research. Funny to see the changes. They are very subtle some times. (ok maybe not with buy.com) but they do show well how the companies are changing the way they function in a basic branding scene.
37. Posted by web design Hertfordshire on March 19, 2010
Well, great research. Funny to see the changes. They are very subtle some times. (ok maybe not with buy.com) but they do show well how the companies are changing the way they function in a basic branding scene.
38. Posted by web design Hertfordshire on March 19, 2010