This happened again this morning. So I’m not logged in, but I can still see my news feed. Here’s the annoying thing, when you click “Okay” it doesn’t redirect you to the login screen. In fact, it doesn’t do anything, it just leaves me on this page. As you can see from the screen capture, there’s no direct and obvious path to login from here (I, like a lot of other people am still learning where stuff is on the new interface). This is a giant usability fail.

I’m going to refer way back to one of Jakob Nielsen’s 10 website usability heuristics.

“Help users recognize, diagnose, and recover from errors.

Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution”

Constructively suggest a solution… Why not just put the login on this modal error? Or at least redirect me to the login screen when I click “Okay”. This is really reminiscent of those old Windows errors.

Um, OK? Multiple paths to failure are always good. Here’s what it could look like, with probably a very small amount of work.

Maybe I’m missing some important security criteria or something, but even as an expert user I was struggling with this the day after the new launch and continue to. What do you say, Facebook?

Via UX Magazine

General Observations:

1. The design is light and on first glance, airy. The branding is placed where you’d expect, so there’s nothing shocking there.
2. The search bar is big and pretty well differentiated, but it’s surrounded with clutter, namely 2 of the 3 navigation bars on this page.
3. Just on this page I count 4 different ways to contact customer service (if you don’t count store locator). A good home page has 1 or 2 very obvious ways to contact customer service so that the user doesn’t confuse them as being different or numbers or the wrong one for them.
4. There are 3 different paths to log in to your account just in this view (yes, there are more). Again, one obvious login path that is consistent on every page is ample and lets the user more easily draw a mental map of the site.
5. There are 4 promos on the page accounting for a significant portion of the screen real estate. That’s without counting the banner in the navigation (which is coming up next).
6. The “Customers Likes These Best Sellers” widget is really helpful, but there’s a ton of wasted space in here. They could have put some very helpful information in all that white space, price perhaps?

The Navigation:

Now I’m a huge fan of jumbo menus, but these menus need to be done a certain way to make them usable.

1. There’s a limited amount of hierarchy being shown in these menus. The paper and pads section has some hierarchy, but they could have done a lot with the fonts and weights of the elements to make scanning this menu mindless.

Jumbo menus are fun, but only when you can read them.

1. The hover states are don’t have very good timing on mouse-in and mouse-out. Adding a very slight delay on mouse-in and a slight delay on mouse-out make it easier for the user to correct their errors.
2. The banner at the bottom of the menu is really interesting, but as you can see from the first picture, you can also get this blinding yellow banner on top of another blinding yellow banner. Bright objects and things with movement distract the user momentarily (because humans are fight or flight animals). So I would be reticent to place my brightest ad in my navigation or to animate it if I did.
3. As I mentioned there are at least 3 different navigation bars on this page. Now, having a lot of navigation options isn’t necessarily a bad thing when you have a lot of different user types trying to accomplish a lot of different tasks. However, when you have such different users the navigation should be clumped into related segments. The sidebar nav is great, but “My Account”, “Customer Service” and the top of the header nav probably could have been clumped together and some redundancy eliminated.

Page Content:

I like the thinking around this page content. I’m assuming that at some point the system remembers what you’ve been looking at a lot and surfaces content relevant to your behavior. However, I wonder if an ad unit and 8 total products (on screen at any given time) represent enough of a starting place for most users?

1. Just touching on that white space comment, there’s a ton of macro white space (space between major page elements) and a ton of micro white space (space between smaller related elements). Sometimes this alienates information from the product it describes, like the reviews and details button in the top widget. It definitely sucks when things look uneven in a design, but it sucks more for the user where there’s no obvious path to follow.
2. Speaking of obvious paths, the names of the products don’t look like links until you hover on them. I’m not trying to support any argument Nelly (Neilsen) would make, but links should look like helpful pathways, so why not style them as such?
3. The yellow banner. I know this thing was created by a marketing department to be “attention grabbing”, but it’s so distracting and painful that I can’t look at it for more than a few seconds. This is less ad blindness and more ad repulsion.

The yellow banner of doom.

1. I like the “Expand to See All” links. UXmatters recently published an article about this type of behavior. The catch is, what if the user doesn’t see what they were looking for when they click that link? You’ve effectively created a cul-de-sac on, a well known conversion killer.

The Footer:

Now, jumbo footers are awesome and don’t ever let anyone tell you otherwise. But there’s a helpful jumbo footer, and there’s a jumbo footer designed around SEO and two logos. This feels like the latter.

1. There’s 3 more promos here (you could count them with the page content, but that would bring the home page promo count to a staggering 8.
2. One of the things I find interesting in this footer is that “Ways to Save” is given top billing, while “Products” and “Help” are relegated to row two. If I’m in the footer looking for the next place to click, is “Ways to Save” the first thing I’m going to look for? There’s an opportunity to save some customers that are scrambling in the footer to find something that will help them. This might have been a better place to promote “Contact Us” or some redundant navigation.
3. The “Easy” button. Man, that was really funny there for a while, but did it create such a strong emotional connection to the brand that it needed to get thrown in there in a random place?
4. Finally, the SEO copy block is just lame. Not only does Google ding you for that in your ranking, it accomplishes virtually nothing. Good SEO and good usability are best served as one course. They compliment each other by helping the customer find what they are looking for and then helping them buy it once they’ve found it.

Overall, I’d give the redesign a C+

There’s clearly been a lot of effort invested in this design, and this is no slight to the design and development team that worked on it. However, it seems like marketing and other business stakeholders might have derailed much of what could have been great design with business needs instead of user needs. I’m also not sure that best selling products are an effective sales tool for office supplies and I was surprised that after I looked for inkjet paper, the “Recommended for You” widget was showing me HP printer ink. It seems like the logic driving this feature is marketing based rather than behavioral. With a few simple tweaks, the home page experience could be massively improved.

San Worthington?

Post “Almost 20 years after the first…” edits.

Now, admittedly this is all pretty nit-picky. But five fairly large errors in one article (possibly more that I didn’t catch) speaks volumes about CNN’s editorial review process. It makes you wonder how rigorous their research is on more important topics and bigger headlines. Do they only bother to read the first few sentences of a Wikipedia entry when they’re reporting on world events as well?

I was pleasantly surprised to see that several of the mistakes observed in the comments had been edited this morning. However, the ones that hadn’t been pointed out were still sitting there clear as day, meaning no one at CNN actually bothered to go re-research the article and do some basic editing and fact-checking. That’s just poor journalism, even if it’s a fluff article.

The last thing, and this is probably an article unto itself, CNN’s profile management is completely broken. I struggled through trying to get my chosen screen name and profile image to show up in my profile last night, but sadly after 8 attempts I decided it was a fruitless endeavor and gave up. That’s a big usability fail, CNN.