Nbcnews.com Creates the World’s Least Usable (and possibly the ugliest) News Website

Nbcnews.com (formerly msnbc.com) has a history of terrible design choices. One of the worst, which I wrote about back in 2010, involved some ridiculous header that remained invisible when the site loaded unless you chose to scroll the page up. While I had no doubt that they would continue their tradition of making bad design choices, I was shocked to see their newest debacle.

Unfortunately I don’t have any images of the old layout to show you, but here’s a quick capture of their new layout as compared to the old:

Breaking_News_&_Top_Stories_-_World_News,_US_&_Local_NBC_News_-_2014-02-05_12.15 Breaking_News_&_Top_Stories_-_World_News,_US_&_Local_NBC_News_-_2014-02-06_13.24

Seems like whoever is in charge over there is really excited about mobile devices since it’s painfully obvious that the site has been designed to target smaller screens. In fact, it appears as if Nbcnews.com has totally forsaken desktops. Now, they have some Frankenstein hybrid of their old site mashed up with Pinterest. Hope you like images with your news because the site is loaded with them. Loads and loads of large images (which we all know mobile devices love to load quickly because they’re lightweight and don’t eat up data charges). And good luck trying to find anything easily. Categories seem to be randomly ordered, and the search page looks like a typical 404 page not found page, except that it’s not — it’s really their search, just optimized for mobile devices (hooray!).

I’d be curious to know if Nbcnews did any research or used focus groups to hone their new site, or whether this was all created without feedback. Don’t get me wrong though, I’m all for a decent mobile-friendly website, but don’t ignore desktop users in the process of building one.

Time.com Using the Before/After Plugin to Show Typhoon Haiyan Disaster Images

Thanks to Time.com, for choosing to use the Before/After plugin on their article, “Devastating Before and After Images of Typhoon Hiayan“. In addition to this story, time.com has also featured the Before/After plugin on several other stories including:

This is 2013 Right?


Seriously? Hey Cisco, it’s 2013 right? Not 1813 where carrier pigeons and the pony express are the preferred means of communication. You are one of the world’s biggest technology companies, yet you’re telling me that the simple task of unsubscribing from one of your spammy newsletters takes 10 days?!?! 10 DAYS! Are you serious? This basic task should take femtoseconds using today’s technology. What exactly are you doing in those 10 days that it takes so long to kill my name from your list?


Update: Add Warner Brothers to the list of companies that must print out a list of people that unsubscribe and ship it around the globe to some lowly intern that must manually input email addresses to remove.


The Flick Scroller

Sometime last year I came across an image carousel on an Italian website done in Flash that allowed you to scroll a set of images horizontally with the flick of your mouse. What I loved about it was how natural and intuitive it felt. The gallery of images was infinite, meaning that the same X number of images would repeat no matter how often you scrolled it. The obvious downsides were that it was done in Flash and not mobile friendly.

I’ve been working on and off since then to replicate the effect, as well as improve upon it. I finally have a non-Flash solution that uses jQuery to achieve the effect both on desktops and mobile devices that doesn’t require any other libraries and is super slim. I love the infinite scrolling effect in use here which relies on an optical illusion of sorts.

I’m posting the first examples here and would like your feedback to see if I should turn this into a jQuery plugin. I’m also open to some suggestions in terms of a name. I like the “flick” part, but struggle with calling this a carousel, gallery,scroller, or something else.


A caveat: The only downside I’ve discovered so far lies in mobile Safari. I have seen the scroller start off and work fine in this browser, yet cease to respond after a few flicks. Unfortunately I seem to have no way to debug mobile Safari, so if anyone can shed light onto the issue I’d be happy to update the code.

A web developer's journal