Everyone Redesigns

Hoarding WindowWhen surfing the web I often get frustrated with how much clutter is on most websites these days.  When I worked on The Wall Street Journal site we struggled with what things we could remove. Somebody clicks on everything and as a news site it’s an industry standard to have a “read this next”, or a “Most Popular on Facebook”, or a “Trending on Twitter” so you just keep adding more and more. It’s starting to get a little silly though. You just can’t keep everything, it’s like living in your own filth.  So a new trend is emerging: clean and simple. Less is more. Great websites like Quartz and Mashable have already drastically simplified the notion of how to build an awesome news site.  Here are a few of the modules that are cluttering up websites these days:

The Newsreel

NYTimes.com Newsreel

This guy has the best placement of any recommendations on a website.  It sits above everything – even the content itself and when I worked at WSJ.com it was always the best performing module mainly because of it’s prime location.  Some websites will put it below the navigation, others place it right in the header next to the logo but in general it’s usually a horizontal list of a few headlines. It’s purpose is to target the people visiting from search engines or social media who don’t want to actually read that article they landed on.  Instead of leaving the site, the hope is they will see something better and stay within your site.  That’s why it’s at the top of an article – it’s trying to get people to click before they have even read what they came there for.

End of Post

Economist End of Post ModuleThe ying to the newsreel’s yang.  End of post modules are typically identical to the newsreel in design but sit immediately after the content before the comments section.  This is one of the best performing units in terms of click through rates (CTR) and product-wise it just makes sense.  Someone has just read your amazing piece of content and they like it so much they are starving for more so you hit them right where their eyeballs are with your best content and they keep eating pages.


WSJ.com Most Popular Rail ModuleAlmost all websites have some sort of left or right hand rail which is the narrower column of ads and other modules that sits alongside the content.  This usually turns in to a dumping ground for every module you can imagine – Like us on Facebook! Look at all our Tweets! Most Popular! Most Social! Ads! Related Headlines! More Ads! Rails are one of the worst cluttered areas on a website and putting headlines in it is usually an attempt to get people to click to another article if they abandon the current article they are reading.  Basically it’s the place good ideas go to die.

The Toaster

Forbes ToasterThese are nifty little animated pop-ups that only come up when you’ve scrolled towards the bottom of the article.  They are neat in that they don’t take up any additional space on the page until they are needed and since they are small they typically only have 1 story in it so it’s a very clear signal on what to read next.  The problem is they are usually used in conjunction with other modules.  My favorite is when it covers up another another recommendation module in the rail – like there isn’t enough places for me to click.


All of these modules have to be powered by something and just like there are lots of places to make recommendations, there are even more ways on how to make those recommendations:

  1. Latest – Just a raw feed of news sorted newest to oldest.  Blogs are notorious for organizing their whole site around this (Gravity Blog included).
  2. Most Popular – Whatever the metric is: most page views, most emailed this is meant to be the stories that have been the most popular across all the readers in the last few days.
  3. Most Social – Kind of like most popular but measured by social interactions like Facebook Likes or Twitter mentions.
  4. Editor’s Picks – Yes, editor’s are algorithms too.  And sometimes they can be a very good algorithm identifying stuff before it has become popular or finding the hidden gems in a site.  Editor’s can also give a stronger editorial voice to a site which may include showing stories that are important and not just popular.

Personalization – Both a Design and an Algorithm

Looking at the algorithms above you’d think that personalization is just another way to sort a list of headlines and power a newsreel, end of post, or any other module. And most companies doing recommendations have created easy copy-and-paste widgets that do just that (Gravity included). The problem is that no matter how great the personalization is, if you put up yet-another-module on a page that has 40 other headlines for someone to click it’s not going to do that much better.  You need to simplify.

Simple is Scary

It can be really hard to figure out what to remove.  Every module, if measured (you are measuring every module right?), has a direct contribution to page views and taking it away might mean less pages overall.  But in reality it’s not that black and white.  People won’t just stop clicking if a module is taken away – they will look somewhere else.  It just means the stakes are higher if there are less places for them to look.  And that’s where personalization shines.

Recommendations, both from a design and algorithm have always been one size fits all.  But now for the first time with personalization, you can have millions of versions of that same module.  The occasional visitor can see most popular, the social networkers can see what does well on Facebook or Twitter, the sideways Google users can see things related to their search term and there long-time engaged readers can see things based on all of the content they’ve already consumed (their interest graph).  Personalization is the best of all signals: editors, social, popularity and ultimately, interests.  The stakes might be higher when showing less recommendations but if the quality of those recommendations are better there is nothing to fear.  Redesign away.

Write a comment...

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s