Categories: Web

UI Lessons from Revamped Yahoo Homepage Design

The article represents the UI lessons that one could learn from newly launched Yahoo homepage. Please share your opinion and help me add more points. Take a look at screenshot of the new, revamped homepage below:

fig: revamped yahoo homepage for indian users

The objective behind the revamped homepage design is to offer users more smooth and adaptable experience and makes it easier for the users to discover content.

Following are some key characteristics of revamped homepage with focus on enhanced usability:

  • Simpler navigation with the ability of one doing following in easy manner:
    • Browse top stories
    • Checking email
    • Access stocks, photos, or weather.
  • Cleaner design that’s easy to navigate
  • Ease of use with the familiar search box, quick links
  • Fresh stream of content offering most popular stories across news, sports, celebrity stories, entertainment and lifestyle, personalized view of your content stream and utility apps.

Lets look at how it used to look like last month around January, this year. Following is the screenshot:

fig: yahoo old homepage in January 2014

Following are some of the striking differences that could be found between old and the new homepage:

  1. Usage of horizontal navigation menu at the top of the page in the new page: Check for yourself in the above page, the links such as Home, Mail, News, Cricket, Finance etc. This is same as you would see on Google sites.
  2. Left navigation menu consisting of less elements thus looking neat, and readable than the old homepage.
  3. Mega-navigation menus, one at the top, one at the left and one right below the search text field once the user starts scrolling. This is also an interesting pattern.
  4. Usage of middle space for streaming content, and larger images in new homepage in alignment with current Web UI trends.
  5. Brighter colors used on homepage for making it more attractive. The older homepage looked to be very dull, in my opinion.
  6. Fixed menu bar at the top of the page. This is in line with current UI trends.
  7. Infinite scrolling displaying the news items, although left and right navigation remain constant. This is something I found new although infinite scrolling has been there for sometime.

 

Nidhi Rai

Nidhi has been been actively blogging in different technologies such as AI / machine learning and internet technologies. Her field of interest includes AI / ML, Java, mobile technologies, UI programming such as HTML, CSS, Javascript (Angular/ReactJS etc), open-source and other related technologies.

Share
Published by
Nidhi Rai
Tags: web design

Recent Posts

Coefficient of Variation in Regression Modelling: Example

When building a regression model or performing regression analysis to predict a target variable, understanding…

3 weeks ago

Chunking Strategies for RAG with Examples

If you've built a "Naive" RAG pipeline, you've probably hit a wall. You've indexed your…

4 weeks ago

RAG Pipeline: 6 Steps for Creating Naive RAG App

If you're starting with large language models, you must have heard of RAG (Retrieval-Augmented Generation).…

4 weeks ago

Python: List Comprehension Explained with Examples

If you've spent any time with Python, you've likely heard the term "Pythonic." It refers…

4 weeks ago

Large Language Models (LLMs): Four Critical Modeling Stages

Large language models (LLMs) have fundamentally transformed our digital landscape, powering everything from chatbots and…

4 months ago

Agentic Workflow Design Patterns Explained with Examples

As Large Language Models (LLMs) evolve into autonomous agents, understanding agentic workflow design patterns has…

4 months ago