Articles about "Responsive design"


bloombergview1

Bloomberg View: latest mobile-first site to embrace the grid, shun visual hierarchy

Bloomberg View, no longer just an opinion vertical at bloomberg.com, has launched a standalone, image-heavy website, which publisher Tim O’Brien told Capital New York is “a departure for Bloomberg.”

But the startling new emphasis on visuals borders on overkill. Here’s how Nieman Lab’s Joshua Benton put it:

Read more
Tools:
2 Comments

NBC News reveals responsive redesign of website in time for Winter Olympics

Give NBC News a medal: Major website redesigns often miss deadlines, but the newly responsive NBCNews.com has launched in time to take advantage of an influx in traffic from the Winter Olympics — especially via second-screen social referrals.

Before today, the mobile website lacked as many amenities as a Sochi hotel room. But now it embraces the strategy of an infinitely scrolling vertical stack of story cards with an emphasis on visuals that we’ve seen adopted recently by NPR and The Wire.

The NBC News website on a smartphone yesterday, left, and after today’s responsive design.
Read more
Tools:
73 Comments
Woman hands with smart phone and computer keyboard

Do mobile-friendly redesigns run the risk of frustrating desktop users?

Pardon my contrarianism, but I don’t do most of my web browsing via mobile on the toilet or in bed yet. I do most of my web browsing on a computer — a machine with a keyboard, mouse and no multi-touch display.

So when prominent news organizations like the Wire and NPR launch responsive websites with mobile foremost in mind, it can become a little more frustrating to visit them on my 13-inch laptop.

Take a look at this screenshot from the Wire’s homepage a few weeks ago. It’s kind of a mess, with dead black space, confusing colors and headlines gone haywire (see my annotations):

Here’s what I’m not arguing about the Wire on desktop: that addressing the needs of mobile users itself caused the desktop experience to suffer. Mobile-friendly doesn’t have to mean desktop-unfriendly. But what I am arguing is that, considering how beautiful the site looks on my mobile phone and the emphasis editor-in-chief Gabriel Snyder put on mobile in his introduction to the new site, desktop seems to have been a lower priority. Read more

Tools:
25 Comments

Atlantic Wire rebrands, launches responsive site targeting mobile

The Wire

News aggregator The Atlantic Wire has dropped the longest word from its name and rebranded itself as The Wire alongside the launch of a new responsive website.

Like a few other recent high-profile redesigns (see NPR), The Wire’s homepage looks perfect on a mobile phone, to the detriment of the desktop experience. Where The Wire’s top stories are bright and inviting with a clear hierarchy on my iPhone, on the desktop they’re tossed into a haphazard grid muddled with black headline boxes and colored stripes that feel more like decoration than navigational tools.

At the story level, too, The Wire’s much more restrained on a phone. On a desktop browser, the reader is bombarded with links to more stories. But with no real estate for that on mobile, the experience is much more pleasant and less in-your-face. (Mobile now accounts for 40 percent of The Wire’s audience, editor-in-chief Gabriel Snyder writes in his introduction to the redesign.)

As for the new name, Capital New York reports it took some work to secure that domain, with Atlantic Media paying “over five and less than seven figures.” The name-shortening of the site, which reaches a younger demographic than other Atlantic properties, is a play for new kinds of advertising — although at launch Cadillac is occupying banner-ad space. Read more

Tools:
0 Comments
responsivedesign

What journalists need to know about responsive design: tips, takeaways & best practices

Phones and tablets have created new ways for audiences to reach our work, but they’ve also made it much harder to design a website that works for all readers. A site that looks great on a laptop might be illegible on a phone, while a sleek design on a tablet might look simplistic on a desktop monitor.

To make sure everyone has a good experience, we might be tempted to build different sites — one for phones, another for tablets, and a third for laptop and desktop users.

That might have been a workable solution when there were just a few mobile-device sizes to account for, but what about the current media landscape with oversized phones, shrunken tablets and everything in between? Creating different sites for each possible configuration is a daunting prospect, especially when new form factors seem to pop up every day.

This is where responsive design comes in. Read more

Tools:
0 Comments
cycling

How The Washington Post created a breakout experience for cycling story

The Washington Post on Thursday became the latest news organization to take the increasingly fashionable step of blowing up its article template to present a feature story in a unique, immersive format.

In December, The New York Times blew some minds with its special multimedia presentation of “Snow Fall” — a six-part narrative about skiers trapped in an avalanche.

The Washington Post invented a similarly innovative presentation for sportswriter Rick Maese’s profile of professional cyclist Joe Dombrowski, a talented 21-year-old from the D.C. area who some hope will redeem the sport in a post-Armstrong era.

One section of the story has an interactive map of a cycling route, matched to audio interview clips and Dombrowski’s physical performance data from the ride.

The article presentation is notable for several reasons. Its full-width photos completely immerse the reader; multimedia elements blended throughout the text reinforce that deep experience; and the responsive design adapts to all screen sizes. Read more

Tools:
2 Comments

Ad Age: ‘Digital dimes are turning into mobile pennies’

PEJ | Ad Age | IAB | Econsultancy
The Pew Project for Excellence in Journalism released the results of a significant study today on the state of mobile news consumption in America. Pew found that some people consume more news after acquiring tablets and that getting news is the second most popular activity on tablets behind emailing. It also sheds light on the difference between people who use apps vs. the Web to get their news.

Poynter’s Rick Edmonds looks at the business implications: While tablet ownership doubled to 22 percent in the past year, those tablet owners don’t want to pay for content and they aren’t crazy about advertising either. That leads Rick to conclude that “bundled subscriptions are looking better than ever.” Read more

Tools:
2 Comments

Quartz takes the latest step in Web apps evolution

Atlantic Media’s new business news website, Quartz, launched today. I wrote earlier about the five things journalists should know about this new project.

The first of those five things was Quartz’s tablet-first focus, which we can now see in action.

Although the site is focused on reaching globetrotting business executives on their smartphones and tablets, you won’t find it in your favorite app store. Read more

Tools:
7 Comments

How the Boston Globe built an all-in-one website, Web app and mobile site

What is the newly launched BostonGlobe.com? Depending on what type of device you use to view it, you might guess it’s a regular desktop website, a tablet Web app, or a mobile phone site.

All of those answers are correct. The site, which launched Monday morning, was built from scratch using cutting-edge techniques in “responsive design.” Basically, that means the design of the site adjusts to the size and capabilities of whatever device it is viewed on.

The layout of BostonGlobe.com varies based on the size of the browser window, and the site offers different functionality depending on the device it’s viewed on.

Many news organizations have built separate, phone-friendly sites or tablet-optimized Web apps to complement their main websites. Responsive design allows BostonGlobe.com to be all of those things at once.

“What we’re doing is detecting the user’s screen size when they enter the site and giving them the right layout,” said Jeff Moriarty, the Globe’s vice president of digital products. Read more

Tools:
0 Comments
errors

At Washington Post and Register Citizen, ‘report-an-error’ forms make it easier to identify, respond to mistakes

When news organizations make mistakes, they can usually count on their audiences to tell them when they’re wrong. But most news sites don’t make it easy for readers to submit correction requests. Readers end up having to point out errors in the comments sections of stories, or they send emails to the wrong people and never hear back.

Hoping to make the process easier and more efficient, The Washington Post recently launched a report-an-error form.

The Washington Post recently added a form to report an error.

The form, which is displayed on every article page, asks readers to identify the type of error they’ve spotted and the section it appeared in. It also asks readers, “How can we fix it?” and “What do we need to know to improve future stories on this topic?”

“I had been wanting to make it easier for our online audience to flag errors or suggest ways for us to improve stories,” said Managing Editor Raju Narisetti. Read more

Tools:
2 Comments