1

Recently I ran across Time.com's new navigation pattern.

What do we call this? What do you think about it? What is the use case for it?

My first impressions for the large screen are: the site is unattractive. I don't like the scrolling area on the lefthand side and I don't like that the global navigation is hidden.

My first impressions for the small screen: interesting how the scrolling lefthand side can be hidden and then displayed; the content looks better on the small screen.

I've also seen something similar on the new.songza.com site. The navigation is being moved to the left and horizontal navigation is less prominent.

4
  • 1
    IMO, it's 10 steps backwards in keyboard & mouse UX. There's no need for the navigation to be hidden, and it doesn't take advantage of hovering. It took me a while to realize you could scroll down on that left pane because the scrollbar is hidden (why?!) and there's no indication of it scrolling (at least in Firefox). The designers appear to believe all their users are on mobile devices, or prefer mobile-style navigation. Mar 24, 2014 at 19:15
  • IMHO - the whole site seems to harken back to the days when iFrames were in style. Having the navigation hidden like this is very chunky and takes an extra step for the user to access the section they need. Amazon.com does not hide all their navigation in a dropdown the same way. The pro to this is that it does focus more on the editorial content.
    – Pdxd
    Mar 24, 2014 at 20:08
  • Regardless of liking it or not, it doesn't work in my usual browser, Firefox 28 on Linux. It does in Opera and seamonkey.
    – PatomaS
    Mar 25, 2014 at 0:12
  • Looking at the site, I think the iFrame look is offensive... Hiding the navigation is unintuitive. (Sorry it doesn't work in your browser, PatomaS!) I was talking to someone last night about this and she mentioned that sites aren't things you look at, but things you interact with, so the real evaluation comes when you test it with users. If they start touching things and the interaction is learnable, the site might not be as bad as we think...
    – Theresa
    Mar 25, 2014 at 20:24

2 Answers 2

2

The design is a rather eccentric amalgamation of design approaches. The idea that delivery of the content is somewhat similar to how Quartz does it. The site’s navigation is seem to be centered around the ever-present scrolling selection of stories in a left hand site on larger desktop screens or an expandable menu with a tap on smaller mobile screen.

Like Quartz, when you reach the end of an article, you're automatically transitioned to the next article on the list. The idea here is probably to keep visitors engaged in order to reduce bounce rates. Time mentioned before that offering related stories isn’t always the best approach here. Instead, it seems like Time offers to new visitors of a story a selection of articles picked by the Times editors to be (what they think are) the most read/shared articles of the day/moment, top picks by the editor, and more in-depth columns, instead of offering articles of a related topic (e.g., you visit a health articles and see recommendations for other health/lifestyle related articles).

Lets take a moment to break down the homepage. It's main content divided into three columns: - The latest stories on the left (with ads ins the style of newspaper columns) - The most important stories in the middle - The columns, videos, and magazine articles (which are behind a paywall) on the right

At first glance of the big red top navigation bar, you don't see the traditional approach of topical landing pages for each subject/sections, instead what's offer a merely streams of articles grouped by a topical subject that can be accessed by from the hamburger menu button, on the top right corner, which has been adopted in nearly every modern news site thus far.

The idea here is to offer readers 3 "lanes" of content:

  • The left "fast" lane handles the new and popular trending articles
  • The middle lane mores more of the top mainstream articles picked by Time editors as the 12 or so articles you should be reading about
  • The right lane seem to offer the slowest, but deepest experiences for those that like to take their time and get to know the fine details of things.

One seemingly minor change to where the ad placement is a pretty significant change. It placing them in such a way with the articles makes them more prominent to the user. This type of approach isn't new by any means. The NYT had previously rolled out a native ad system previously in a similar way.

The idea Time seem to be after is a more native and responsive system that's easy so read not only social, mobile, and desktop users alike, but also offer visitors an experience tailored to their own reading preferences.

2
  • Krazer, I'm going to look at that Quartz site. Do you know of any usability tests for sites like this? It would be interesting to see what the results are.
    – Theresa
    Mar 25, 2014 at 20:22
  • 1
    I don't believe there is, but here's an article reviewing the design and functionality of it.
    – Krazer
    Mar 25, 2014 at 21:16
0

It's a 'hamburger menu'. It's not new, but not typically done on the desktop. It is a carry-over from the mobile world, where taking up initial screen real estate with a large menu was not desired, hence hiding it behind a menu icon.

It's given that name due to the icon looking like a hamburger. I also like the term as it hearkens back to the concept of 'mystery meat' navigation--which is the one drawback of this type of menu, IMHO. That said, it has become a pattern. We can argue if it's a good pattern or an anti-pattern, but people are becoming accustomed to it.

Does it make sense on a desktop site? I'm not sure. I have the hunch that this was a very much 'mobile first' design project (which is good) that maybe didn't have the time/money/desire to fully flesh out the desktop version.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.