Pixel Envy

Written by Nick Heer.

The New York Times’ Redesigned Website

The Times released their almost entirely overhauled website today, and it’s pretty impressive. They updated the home page, section pages, and article pages; Times Topics and some slideshows remain unchanged, however.

As this is one of the websites millions of people — including me — visit many times every day, any design changes need to be executed with elevated care. The design needs to reflect the Times’ status as a newspaper of record, too, so it has to be “right”. A redesign is a tall order, but I think they’ve mostly succeeded.

The home page retains much of former Times design director Khoi Vinh’s grid obsession, but everything gets a little more space. As a result, it scans much easier than the old, cramped page. In addition to the sections in the header, there’s a nice new flyout menu on the left which, during testing, featured a customizable “shortcuts” section. The ability to customize shortcuts has been removed in the version which went live today, though I hope it returns. This menu replaces the previous static column on the left; it hasn’t been universally praised, but I think the additional click required to open the flyout is a small sacrifice to open up the home page’s content area.

Top: existing typography; bottom: my bold-only version.
NY Times comparison
The typography has generally been improved, too. Menus, section titles, and other accent elements are set in Franklin Gothic, while headlines are set in Cheltenham. I’m not keen on the extensive use of the bold italic weight of the latter: bold or italic text should be sufficient, but using both seems like overkill.

The section pages are also new. They look much brighter than the outgoing version (noticing a theme?). The brightness and space makes it much, much easier to read, and the revised typography looks spectacular on the Retina display of my iPad, though the book-weight variant of Cheltenham is a bit hard to read at smaller sizes on my non-Retina Mac. Despite the additional space elsewhere, though, the title in the header feels comparatively cramped.

The new individual article pages are perhaps the most significant beneficiaries of the redesign. Gone are multipage articles and floating images, replaced with a simple, inline column of text and graphics which are either centred, or which sit in the column of white space to the right. I’m very pleased to see that the issues I raised in the preview stage have largely been rectified. Scrollbars have returned, and the strange friction coefficient has been eliminated. I didn’t save a copy of the prototype’s source code, so I’m not sure if they simply eliminated their odd overflow div implementation, or if they massively improved the Javascript used to run it. Also nice: comments are hidden by default.

I’m very impressed with this redesign. It’s comprehensive and contemporary, but it doesn’t feel trendy. I’m looking forward to seeing it every day.