Hacker News new | past | comments | ask | show | jobs | submit login
Jakob Nielsen's site has been redesigned (nngroup.com)
72 points by joshuacc on April 1, 2013 | hide | past | favorite | 43 comments



I know it's 1 April, but I'm now quite convinced that Nielsen is just having a glorious laugh at our expense, constructing possibly the most elaborate troll in Internet history...

His early work was very interesting, drawing attention to the fact that sometimes what "looks good" or "works well" according to someone's intuition doesn't actually produce the best measured results. He was a pioneer, at least in Web terms, of promoting the kind of data-based decision making that many successful Internet businesses take for granted today. Anyone who designs web sites but hasn't read early Nielsen is missing out, IMHO.

However, as time passed, his articles became increasingly self-referential and self-promotional, and seemed to include less and less substantial, original content. By his own arguments his material was becoming worse.

His old site famously wasn't a shining beacon of graphic design, and he always seemed rather proud of that -- ironically, really, with the body of research we now have that shows how much influence a good visual design can have on readability. With the redesign used since the move to the NN Group site, he seems to have completely jumped the shark. Even famous Nielsen material on the F-shaped reading pattern and the use of underlining for hyperlinks seems to have been discarded. The text is set in a small size and with a font stack that will render unpleasantly on a significant number of visitors' computers (because Helvetica is often installed on Windows PCs, but only as a cheap and nasty screen version of a printer font). And what happened to not making real content look like an advert?!

It really is a shame, because every now and then he does still write a great article. I wonder what the Nielsen of 15 years ago would make of his site today.


From a casual glance:

- Not all links have a title attribute

- Large lists of links do not have a skip link.

- Searchform is a javascript submit, with no fallback or warning (doesnt work without javascript support)

- Mailto: adresses have subject preset.

- Links are not underlined.

- Popular topics links are black instead of blue, and the hovercolor doesn't register for the colorblind.

- Larger images often lack an alt-attribute.

- Inline CSS hampers custom user stylesheets.

- Submenu is somewhat confusing, visually disjointed from the main menu.

- The contact form is a table without a table summary, and doesn't work without javascript enabled, without a warning.

- Missing a breadcrumb

- Low contrast for blue links on white background.

- Trouble finding the contact form. Submenu is initially hidden and you have to select "Contact information" from a list of links inside the "People" page.

- After submitting form: <h1>&nbsp;</h1><h1><strong>Message Sent</strong></h1><p>&nbsp;</p>

- Font-stack of Helvetica renders ugly on Windows machines

- Form labels are not bold, above the form input, or of reasonable font-size.

- Content pages don't start with the content, but with a huge sidebar of links, not conform reading pattern.

- Both HTML and CSS are not valid.

- http://www.nngroup.com/articles/ is somewhat paralizing with information/link overload.

I do like the design a lot, it being vanilla Foundation.


Downvoted you by mistake :/

I absolutely agree. The new design is an even worse offender against his own recommendations.


It looks like one of those websites that squat popular domains with ads and a "fake" search engine.



Thanks for reminding people about this change. For the readers who are wondering if this change happened on 1 April 2013, it actually happened earlier. This has been previously announced on HN

https://news.ycombinator.com/item?id=5019049

(two months ago, no comments)

https://news.ycombinator.com/item?id=5267093

(one month ago, four comments)

and anyone who has followed any of the useit.com links in the last two months would have discovered this change. EDIT: The second HN submission shown links to the site's discussion

http://www.nngroup.com/news/item/useitcom-moves-to-nngroupco...

of this change in location of Alertbox columns.

I agree with the several questions posted here in comments that I'm puzzled by the rationale for some of the changes, which are not always easily explained by what's on the page

http://www.nngroup.com/news/item/useitcom-moves-to-nngroupco...

about the domain change, which has the paragraphs below about the new design:

"Legacy design is rarely a good rationale in the long run, but there was a second reason to maintain useit.com for many years: while nngroup.com needs a corporate look-and-feel to attract consulting clients, it was possible to retain a more emotionally forceful design for useit.com. The site admittedly didn't look very good, but it was a strong rallying point for rebellion against the bloated design style that dominated during the dot-com bubble.

"Even after the dot-com bubble burst, there was a long period where the barebones useit.com design stood out and elevated the site above many latecomer UX websites. Cutting through the clutter is an important value on the web, which has so much more information than anybody needs.

"However, eventually it makes less sense to rebel against the excesses of the past. Also, with almost 500 Alertbox columns published, it became clear that more navigational apparatus was needed. One solution could have been to redesign useit.com to make it more like other sites. But why bother? If a big change was needed anyway, it was better to use the opportunity to integrate the articles with the company information and host all the material on the same website with a single navigation structure and a single search. So that's what we did: no more microsite for the Alertbox."


Underlining and links:

http://www.nngroup.com/articles/guidelines-for-visualizing-l...

He has a massive get out of jail card - he says "Assuming the link text is colored, it's not always absolutely necessary to underline it". But then he says that for accessibility you must do so.

However, he says:

"There is no need to use special colors or other visualizations when the cursor hovers over a link. Doing so only makes the page appear more cluttered as the user moves the mouse across the screen."

How... awkward... for him.

I should note that he has entirely rewritten his guidelines from his old "alertbox":

http://web.archive.org/web/20040605085708/http://www.useit.c...

I see he has removed this nugget of advise:

---

The color for unvisited links should be more vivid, bright, and saturated than the color for visited links, which should look "used" (dull and washed out).

The two colors should be variants or shades of the same color, so that they're clearly related. Using drastically different colors (say, orange and green) makes it hard for users to understand the relationship between the two types of links and to identify which color is the "used" version of the other.

* Shades of blue provide the strongest signal for links, but other colors work almost as well.

* As always, when using color to signal information, you should provide redundant cues for color-blind users. Making unvisited links brighter and more luminous than visited links will usually accomplish this goal.

---

Let's see:

* Dull washed out colour for unvisited links - check!

* Different colour entirely for visited and unvisited links - check!

* "There is no need to use special colors or other visualizations when the cursor hovers over a link. Doing so only makes the page appear more cluttered as the user moves the mouse across the screen." - check!

* "Users typically understand a left-hand navigation rail with a list of links on a colored background, assuming it resembles the navigation areas on most other sites." - same background colour for left hand navigation rail... check!

Use common sense and the W3C for accessibility, for everything else there's Nielsen.


From a usability standpoint, I have trouble scanning blue text - especially the light blue used on nngroup.com. I've read elsewhere that this is a common problem, but i can't find a source.


Before you say "April Fools", that's how that site appeared to look a few months ago already: http://web.archive.org/web/20130116085341/http://www.nngroup... .. am I missing something?


So, where is the evidence-based decision to switch to colored, non-underlined links explained? I'm very curious to see it, since I've been stubbornly supporting underlined links all these years ...


My problem with Nielsen, despite his huge and valuable impact, is his approach of more or less declaring the Commandments of web UI. UI is always a custom solution to a specific problem, a way of responding to user intent through web functionality. There may be expectations that people become accustomed to (such as the way links appear), but the technology underlying the web is constantly changing (see: HTML 5, touch interfaces, etc.) and so expectations need to evolve as well.

Focusing so much on the UI elements rather than overall goal always seemed like a lost opportunity to educate people, and ultimately feels like "oh, this is much too hard to understand, just follow these rules and you'll be OK." It's an easy solution for people to get behind, but not very effective for improving UI on the web.


Yawn. That's a pretty non impressive redesign, especially for a company that deals in user experience. Did they forget that aesthetic factors into experience?


If you saw the site before you would agree that Jakob Nielsen is very much in the camp that aesthetics get in the way usability.


aesthetics gets in the way of usability? that sounds too wrong for anyone to believe. i mean, i'm the first to call out the current ridiculous 'design for the sake of design' trend. abuse of "pretty" interfaces abound, but clearly there can't be anything wrong with taking the same interaction design with good typography, good use of whitespace, good use of color. done right, aesthetics increases usability.


The argument is more about how to define "good".


It's not that impressive. Then again, Nielsen has rarely given importance to aesthetics in UIs.


Possibly because aethetics are, relatively, not very important compared to usability, functionality and speed.

None of the world's most successful websites pays overmuch attention to aesthetics, including Amazon, eBay, Craigslist, Wikipedia, Facebook, Yahoo, MailOnline, The New York Times, the old Hotmail, Slashdot, Reddit and Hacker News.


All of those sites have something that sets them apart in a way Nielsen himself has mentioned many times: most of their visitors probably do spend a significant amount of time there on a regular basis, so they don't need to follow the same rules as everyone else. Of course, whether those sites are successful because of their questionable aesthetics or despite them is a different question, and whether they might be more successful by some interesting measure if they tried a major change in their design is another question again.

In any case, details that are purely aesthetic -- subjective matters of beauty and personal taste -- don't make a difference to ease of use. That's a tautology, because not mattering to other factors is almost the definition of a detail being merely aesthetic. However, more generally, things like visual design and typography do matter and can make a measurable difference.


It redirected me to a parked domain. Oh wait.



The more memorable version that most of us probably remember as Nielsen's site: http://web.archive.org/web/20120530170411/http://www.useit.c... (The same design was used for ~13 years and often evoked strong responses from web designers.)


(...) evoked strong responses from web designers.

Once there was a Wordpress theme available in official theme repository with a footnote "Jakobian theme created by Ozan Onay, based on the prophetic work of Jakob Nielsen." Based on tables - like the real thing.

Some things should never change.


9 years ago some designers/developers even tried a nice update on it: http://www.designbyfire.com/?p=4


Since what exactly Jakob Nielsen declared underlined links harmful to the user experience?


Would have expected it to be responsive?


Also, the links are clearly breaking WCAG AA: http://webaim.org/blog/wcag-2-0-and-link-colors/


I wonder why the site was built with Zurb Foundation, but stripped of its ever-useful responsive grid?


The site renders perfectly fine and looks quite nice on my phone. I don't know that a site needs to be "responsive" if you first design it to look good on mobile.


Fonts in general and especially in the sidebar are to tiny for me to comfortably read it on my phone.


zoom in


If you have to zoom, your mobile site is broken.


If you have a "mobile site" you're doing it wrong.


Not necessarily. But it's funny, Nielsen believes in different pages for different devices. Guess he doesn't want to follow his own advise, as per normal it seems!


Why? He's taken almost every chance he's had to either bash responsive as bad for UX or completely misrepresent what responsive actually is (see here: http://www.netmagazine.com/interviews/nielsen-responds-mobil...)


It's not very good, the text hierarchy is pretty bad, so much text and not enough white space


I see they have given up on following many of their own UX findings. I can hardly read the light-colored not-underlined links, but on mouseover, they light up, yikes. I never thought I'd say this, but I liked the old useit better.


it looks like they used the foundation css framework.


That's correct. You can tell if you look around in their CSS files.


April Fool's?


My eyes/mind doesn't know where to focus on that page to start reading, it's a very strange sensation.


That's how I feel, I couldn't put it into words before reading your comment.


Guess they really like Helvetica:

    font-family: "Helvetica", Helvetica, Arial, sans-serif;


Oh god, it's awful. Please tell me this is an April Fools joke like the cat usability test.




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: