For people who take note, Yahoo! has been undergone many changes on their culture, products and more subtle things. Like the recent updated search page UI, which is claimed by Yahoo! to ”puts your results front and center.” If you are a designer like me, these words will appear in your mind when you think of Yahoo!’s past search page design: ‘obsoleted, busy and full of clutter’. That’s why people have some love to themselves usually don’t want to visit Yahoo!, it makes their eyes ‘bleeding’. It makes mine do at least. But, the recent changes on the search page UI did breathe some fresh air into it. Let’s have a closer look:
Image via : The Verge
The change is quite observable, and on the right direction. Overall the layout is cleaner, the information are better organized and navigation is easier. It feels to me that the rather strict discipline mostly found in mobile app are applied here. The designers in Yahoo! are using space as if it’s as scarce as in mobile device, even when they are designing a full webpage. This leads to a ‘mobile app’ grade experience and consistency across all platforms.
I totally understand if you stopped here, but if you are interested in what exactly get improved on the UI design of Yahoo! search page, I’ll explain in more details:
1. Change of search results font color
This might not seem to be a big deal, but it’s a huge relief to the eyes. The old page use pure blue, which is also the default color of URL link on web. When the Internet is born, having a different color to separate URL link with plain text is functional, but many years has past and people demand much more. The default blue color provides too much contrast and not very comfortable to the eyes. Also using default blue will make it easy for people to relate to those ‘crude’ and poor designed website, doesn’t really what Yahoo! want its viewer to relate to. A subtle change to a lighter blue on the new design make things much better.
2. Stronger Application of Grid System
As can be seen from the old design, the alignment is lackluster, especially on the center search results part. The only strong alignment you can find is that all the text are left aligned. Whereas on the new design, we observed that now all the search results are placed in a fixed width container. The search bar on top of the page also shares the same width with the container, creating very strong alignment. The page now are very clearly divided into three columns. Left column is all the different search types user can choose from, middle column is the content (search results, as Yahoo! claimed, front and center), right column is ads area, slightly out-of-the-way (where ads should be). The strong alignment and layout make it much easier for user to find their way around.
Three Columns
3. Less User Interface, More Content
It has become more of a trend in nowadays web design that user interface gets out-of-the-way and make the content front and center. This is the direction Yahoo!’s new search page design is heading. A very observable part on the old page is the ‘search types’ tabs on top of the search results, it has now been moved over to the left column, leaving only the search results in occupying the entire center column.
Search Types Tabs are removed on new design
These changes aren’t rocket science, but it shows that Yahoo! starts to care about user experience. It might be a very small step, but it is welcomed nonetheless.
Related articles
- Yahoo! Search Gets a Refresh (ysearchblog.com)