Articles about "Responsive design"


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

Bloomberg View, no longer just an opinion vertical at, 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

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 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
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.

On the other hand, the Wire’s solution for what to put above the fold when the site is displayed in large windows like those on desktop computers or 10-inch tablets works pretty well. There’s a lot of news to choose from, presented in the carousel-like fashion that subjects in Poynter’s Eyetrack Tablet study indicated they preferred.

NPR, meanwhile, went in the opposite direction. After its summer redesign, the site doesn’t change all that much from your phone’s browser to your laptop’s browser. That means, depending on your browser width, you might have only one story visible to you before you start scrolling. That makes sense on phones, where there’s really only enough real estate to effectively present one story at a time, but on the desktop it feels cumbersome to immediately start scrolling once the site loads if you want to see more content. Lots and lots of scrolling to find content you want on a computer just isn’t as pleasing as flicking your thumb to find more content on a smartphone.

I emailed the Knight Lab’s Miranda Mulligan, a responsive-design guru behind the Boston Globe website who recently led a NewsU webinar on the subject, to see if I was crazy to wonder whether my less-than-optimal desktop experiences are cause for concern.

Her response, which she later tweeted, too, is that I basically am:


Look, I’m not arguing against mobile-first or future-proof web design. But mobile rhetoric sometimes strikes me as a little — a little! — overzealous. Said Mulligan in an email:

If desktop reading experiences are less than optimal, that might have to do more with the fact that no one wants to read while sitting at a desk with ginormo machine. They read on the train platform, on the train or while waiting in line for coffee. They read on the couch. They read while on the toilet or at the doctor’s office.

And tweeted Damon Kiesow, former Poynter fellow and current senior project manager at the Boston Globe, the same morning I was emailing Mulligan:

Sure, but don’t millions of us still sit at a desk in front of a computer at work all day? And don’t some of us sometimes prefer the larger screen and multiple windows of a computer and the precision of a mouse?

Let’s look at the numbers: In September, for instance, 35 percent of visits to came from phones and tablets. That’s a lot (an increase of 10 percentage points from the year before), but so is the 65 percent that still visit the site on desktop and laptop computers. The folks at NPR told me over the summer that a 50/50 split was on the horizon. ESPN reached that milestone in September. About 40 percent of Wire readers visit on mobile devices. In all these cases, mobile is growing, and will likely continue to grow, but should we assume desktop is going to zero? Should we assume desktop is heading for a small enough reader share that optimizing for desktop should be a lower priority today?

Mulligan cautioned against focusing on current numbers, saying publishers should “try to read the tea leaves and look to make a decision based upon the direction of the trend.” She likened desktop to old bulky cordless phones: “Do we still use the Zack Morris phone?”

I’m not arguing that newly responsive sites are ignoring desktop — certainly not to the extent that previous designs ignored mobile. Too many sites are late to the game and have yet to implement meaningful mobile strategies, so changes to the Wire and NPR that offer better navigation and eliminate irritating pinch-to-zoom are a net positive.

But mobile-first talk that’s altogether dismissive of the desktop experience strikes me as almost too forward-looking. Just as the Orange County Register’s Eric Spitz has counterintuitively argued that some newspapers late to acknowledging the digital revolution ultimately overcorrected and weakened the print product too quickly, I wonder if we’ll see some sites overreach with mobile, prematurely accelerating the decline in desktop readership.

No question news organizations have been too slow to hop on the mobile train, but once on board I hope they don’t speed away from desktop too quickly while readers are still there.

Related: Atlantic Wire rebrands, launches responsive site targeting mobile | NPR’s new redesign aims to create a less overwhelming reading experience Read more


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


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. It’s a simple solution to a big problem — a way to account for different devices without requiring different sites. Instead, responsive design extends a core Web principle — the separation of design from content and structure — to give us a way to make a site appear differently depending on the size of the device it’s accessed on.

The promise of responsive design

Responsive design benefits how a site is built and maintained. Because a responsive site is still just one site (with several faces), only one codebase and one publishing process are needed. Content doesn’t need to be replicated to another system — manually or otherwise — to make it accessible to a second set of users. And design changes can be made sitewide or for a specific device size, providing lots of flexibility in maintaining a site over time. 

Responsive design offers a second advantage. Since it emphasizes reusing visual elements and retaining content and functionality on different versions of a site, it encourages a consistent experience across devices. A reader who starts a story on her phone and finishes it on her tablet will get a fluid experience that feels like browsing the same site, but in ways that cater to the screen being used.

USA Today has implemented responsive techniques to develop desktop and tablet versions of their site, but their phone presence calls on a separate mobile site — with differences not just in design but content.

News organizations and other content publishers are in a particularly good position to use responsive design, at least when it comes to their articles and news stories. Things get a bit trickier with multimedia or interactivity, as we’ll see later.

But the main obstacle to enjoying a news story on a phone is one of design: Is the font size appropriate? Are there margins or padding separating content from the edge of the screen? Has the number of columns in the layout been greatly reduced? Are navigation options easy to see and tap? Responsive design doesn’t address these issues in one fell swoop, but it does give us a chance to make sure we have an answer lined up, while concentrating the bulk of our site-building efforts into one product.

How CSS and media queries factor in

Under the hood, responsive design involves a few different Web technologies working in concert, but the most important is CSS and, specifically, a tool called a media query. 

Remember, CSS — cascading style sheets — is the technology used to design a website. CSS can be used to change typography and color, and is also the tool designers use to change the layout of a site, including the placement and width of elements. So it’s not surprising that it’s at the heart of responsive design.

CSS media queries are clever ways to change the styles that take effect depending on the device used to access the content. In other words, media queries can make CSS conditional on whether a visitor’s using a smartphone, tablet or laptop.

All kinds of properties, such as color depth and aspect ratio, can be “queried.” But the most important feature to consider when implementing a responsive design (indeed, often the only feature considered) is width. Based on this one property, we can decide what version of a design makes the most sense to serve. The interesting thing about the width property is it refers not to the size of the device but rather to the browser. That means the mobile version of a responsive site can be previewed on a laptop or desktop simply by shrinking the browser’s width.

The Toronto Standard spans its navigation across two columns in the phone version of its design and makes the links larger (and easier to tap).

In plain English, a typical media query looks something like this:

If the width of the device accessing this site is less than 480 pixels, load all the styles that follow.

Another media query in the same stylesheet might look like this:

If the width of the device accessing this site is greater than 480 pixels but less than 960 pixels, load all the styles that follow. 

Here’s what the actual code for the first example looks like:

@media screen and (max-width: 480px) {

The key to a media query is to define width boundaries and then load up styles when a device meets the parameters. Boundaries can be defined one way (less than 480 pixels, for example) or two (between 480 and 960 pixels).

A boundary is also known as a breakpoint — a condition under which the styles on a site will change. If a site has one breakpoint, it sports two designs: one on either side of the break.

The power of media queries — and thus responsive design — lies in their flexibility. Once a breakpoint has been defined, any valid CSS can follow. This can result in big changes in how a site appears, even though the markup doesn’t change and a large portion of the CSS stays the same.

The Boston Globe design moves from three columns, then two and finally one as the width decreases.

The simplest way to think about a responsive website is that it gets narrower as the viewport — the width of the Web browser — shrinks. Though it’s true the overall width will vary with a responsive site, other factors might also change:

  • The position of elements. A site with three columns on a laptop may switch to two columns on a tablet. The content in the third column, rather than disappearing, will reposition itself below the remaining two columns.
  • The width of elements. Columns may become narrower, and images and videos may shrink.
  • Font sizes. A headline might appear in smaller font size, or even a different type face.

These differences — and more — are possible because designers can control the full range of properties accounted for in the CSS specification when they employ responsive design.

Making things fluid

In the early days of the Web, fluid designs were prevalent. These layouts would fill the browser window, whether it was full-screen on a huge monitor or narrow on a tiny one. As designs became more sophisticated, fluid layouts fell out of favor: the differences between a fluid layout at its widest and narrowest possible configurations were simply too great to create predictable results.

By limiting just how much the width of a site changes before it “resets” to a new configuration, responsive design has created a renaissance for fluid layouts. It’s now possible to have the best of both worlds: layouts that expand or contract to fill the precise dimensions of the screens they’re viewed on while offering structures fundamentally agreeable with the general screen size.

Best of all, fluid layouts are an option when employing responsive design, but not a requirement. To switch to them, designers define the width of the elements on a page in times of percentages rather than absolute values (such as pixels).

Quartz incorporates a navigation link in the upper-right corner with a dropdown menu, a common design pattern for phone layouts.

Best practices to keep in mind

Responsive design has gained enough traction that we’re starting to see best practices emerge. Here are some points to consider if you’re looking to adopt a responsive design for your publication.

  • Use commonly-accepted breakpoints. There’s no need to guess at what dimensions are best to use. Here’s a commonly-used chart to get you started:
    • 320px and lower – portrait phones
    • 321px to 480px – landscape phones
    • 481px to 768px – portrait tablets
    • 769px to 940px – landscape tablets
    • 941px to 1200px – laptop/small desktop
    • 1200px and higher – large desktop/TV


  • Don’t design everything at once. A responsive design with six breakpoints is quite ambitious. It’s better to start more modestly — you can always design for additional breakpoints later. As a starting point, you might focus on just desktop (940px and higher), tablet (480px to 940px) and phone (480px and lower) layouts.
  • Start big. Designing the largest version of a site or page first is usually best because it’s easiest. Difficult design choices must be made within the constraints of tablet and phone screen sizes.
  • Don’t throw anything out. As you move to narrower designs, it’s tempting to discard some of the elements that don’t fit. Avoid this temptation. One of the goals with responsive design is to keep the mobile Web a first-class experience, not a watered-down version of your “real” site.
  • Focus on a single column for phones. Single-column layouts should dominate designs for phones. Switching to two columns is possible on occasion, but most of your content will need to flow linearly from top to bottom. That makes ordering especially important since browsing on a phone will likely require lots of swiping to get to the bottom of the page. 

For more on these and related best practices, take a look at this terrific post by Tito Bottitta, one of the folks who worked on The Boston Globe’s responsive site.

Downsides to consider

Responsive design is a good way to deal with the increasingly varied devices audiences use to reach content. But it’s not without its costs.

Most notably, responsive design doesn’t automatically tailor a site to different devices — it merely offers the opportunity to do so. That means an investment must be made both in designing and deploying each site version: a site with two breakpoints must be designed three times, for example. Of course, many design elements can — and should — recur from one version to the next. Typography, color, iconography and other design pillars should largely be consistent. But grids, hierarchies and clickable areas will likely change.

Performance is another consideration. Some responsive designs incorporate CSS and JavaScript, a related Web technology. JavaScript can add advanced effects, but it can also slow things down, especially on older devices. Likewise, responsive design won’t fix underlying problems with a site’s markup, If the code’s bloated and slow, responsive design won’t speed it up.

Content isn’t the only consideration when approaching a responsive design. Different layouts mean different ad inventories — the banner that fits perfectly on your widescreen layout will get squished or clipped on a phone.

Site analytics are likely to get more complicated with a responsive design, too.

It’s also important to remember that responsive design is a set of techniques for implementing a mobile-friendly Web strategy. It won’t help answer questions about whether you should also invest in one or more apps or whether those apps should be native or Web-based.

Newsweek makes extensive use of fluid techniques, expanding images to fill even the widest monitors.

Making sure responsive design is right for you

A decision to pursue responsive design means you’re taking your mobile Web presence seriously. That may seem like a no-brainer, but mobile isn’t just about the Web, and you may still have a sizeable audience that’s just interested in getting your content on desktops or laptops.

Since responsive design will require an investment, here are some things to make sure before you get too far into it: 

  • You want to reach an audience across devices with your Web presence. Responsive design is all about the Web. If you’re pursuing a different strategy — one that hinges on native apps, for example — responsive design should take a back seat.
  • You want to deliver the same content across platforms. Responsive design is great for customizing the presentation of your site. But it’s not the right tool if you need to deliver unique content or functionality.
  • You’re starting from scratch, or your existing infrastructure benefits from “clean” markup. It can be challenging to make responsive design work on a big legacy site, especially when there isn’t a clear-cut separation between the structure and design of the site.
  • You’re ready to invest more in design. Responsive design makes design more important, and requires a bigger investment to make that design work. (Though there’s a potentially bigger payoff.)

Taking the next steps

Like all parts of the Web, the technologies undergirding responsive design are in flux. Even as the CSS3 specification gains traction, proposals are under review for its successor, CSS4.

Some of the issues now under review include how complex structures such as tables and forms are handled, and how the resolution of images and video can be adjusted depending on the device.

In the meantime, the techniques needed to bring a polished responsive design to fruition are well developed, especially for article-based content. And one of the best ways to get started with responsive design is by using a framework — a collection of pre-built code that takes a lot of the heavy lifting out the equation, helping you stay focused on your content and how to best present it. Read more


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.

I asked Washington Post Information Designer Wilson Andrews, one of 12 Post staffers credited with contributions to the piece, to give us some background on how it came together.

Poynter: Where did the idea for this kind of presentation come from, and what were you aiming to accomplish by doing it this way?

Wilson Andrews: Because last year was an election year, much of what we did then had very specific focus. After the election, we took a step back and were able to broaden that focus somewhat and look to try new things.

This story presented a great opportunity for a new storytelling model that we had never tried. It was a sports feature that didn’t peg on something we normally do, and we had the fortune of a looser deadline because of that. Rick Maese was a great partner to work with, he had a lot of enthusiasm for and partnership with what we were trying to do, so that helps a lot.

Wilson Andrews

We wanted to try a new form because we want to elevate the experience that our readers have. They come to the Post to read stories from some of the best journalists in the world. We want our presentation, visual storytelling and the overall experience that our readers have to match that level of quality. At the root of it, when you plan and design your visuals specifically for a story, it allows for a much better story. It’s why I pursued a career in journalism.

How much time, resources, people went into building this?

Andrews: We started discussing the project in mid-January, about a week before Rick was to travel to Nice to report on Joe. The sports editor on the project, Mitch Rubin, approached me and representatives from other visual departments with the idea that this story could be elevated to a unique presentation. We were looking for opportunities for this format, and decided this story was a great one.

I worked on the design and front-end development of the project and got major art direction and style from Tim Wong and Sarah Sampsel in digital design. I probably started spending a majority of my time on the story in early February, and really crashed on it after we got the first draft a week and a half ago. Gene Thorp and Bonnie Berkowitz from graphics helped report and produce some of the graphics with me. Rick shot video in France, and videojournalist AJ Chavar shot interviews with Joe in Virginia. The footage from these two sources were edited by AJ to create the 5 videos in the piece. We had a freelance photographer shoot photos with Rick when he was in Nice. Our dedicated copy editor David Larimer spent the past week with all the different elements. And then in the past couple days we spun up a new WordPress instance and Yuri Victor and Amarilis Munoz helped me migrate the story prototype into the beginnings of a template that we plan to reuse in the future.

What plugins or other pieces of technology did you use, and how did they make it easier?

Andrews: The backbone of the project uses Bootstrap, an awesome responsive framework developed by Twitter that made it relatively painless to design for all devices. This was probably one of the biggest complexities of the project, that we wanted one page for all devices. And that one page had to look really good on all devices. This was our guiding standard.

As I mentioned, we deployed the project with WordPress, which is super flexible and easy to add features on the fly, especially in the ways we’ve used it at the Post. Yuri Victor and Greg Franczyk in IT get all the kudos for making WordPress work as a great templating engine for us.

One other way we made the page mobile-friendly was to lazy load almost all of the heavy, bandwidth-hogging visuals. We load videos and photos as you approach them in the story. That way, we don’t have to preload dozens of images and five videos when the user gets to the page. This was the biggest mobile performance improver by far.

Does this build off any previous projects? And do you expect to reuse this template in the future?

Andrews: This project was a ground-up, from-scratch implementation. We have a few in-house modifications to Bootstrap, but overall the project was very custom from the start. Now that we’ve done it, we’ve learned a lot, and we fully intend to re-use a large portion of this project to power other enterprise stories and custom presentations. Keep an eye out for much more visual goodness from the Post. Read more


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


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


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

What is the newly launched 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 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 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. “It responds on a real-time basis, so if you flip your iPad from vertical to landscape, it will change.”

To try it out yourself, open the site in your desktop browser and watch the layout adjust as you gradually resize the window.

There are six possible layouts depending on the device’s screen size: a simple one-column page for phones, more columns and complexity for 5- to 7-inch tablets and 10-inch iPads (adjusting for horizontal or vertical orientation), and a large version for laptop or desktop browsers.

The layout of changes when an iPad user rotates the device from vertical to horizontal view.

The site also detects the capabilities of the device, so a smartphone or tablet user can swipe her way through a photo gallery or a featured content carousel.

Images are available in multiple sizes, and videos are encoded in different sizes and formats so they can be loaded on any device.

The site also uses HTML5 features such as locally stored data, which powers an article-saving feature that enables you to read a story later without Internet access.

“We really wanted to introduce app-like features and focus on readability,” Moriarty said. “This is a Web app in a lot of ways. We are not launching a native app at the same time — we think this accomplishes a lot of the same things we would normally do with a native app.”

This approach also has advantages for future development, Moriarty said. Because the one site serves all types of devices, new features can be developed and rolled out more quickly. Developers don’t have to rebuild the same things for multiple websites and apps.

The Globe developed the site and responsive design technology with Boston-based design and development firms Filament Group and Upstatement.

The idea of offering multiple, tailored page designs is certainly timely as more types and sizes of tablets and smartphones come on the market. Other news organizations will want to emulate this as they develop new products. Read more


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. Previously, there was not a consistent way to do this.

The feature — which Post staffers Greg Linch and Hal Straus created — launched on Feb. 7 but wasn’t displayed on every story until after The Washington Post’s site redesign launched in mid-March.

As of last week, about 540 people had used the feature to submit corrections, suggestions and tips. Those that seem like errors are first sent to section editors, Narisetti said. From there, they enter the Post’s internal database for tracking correction requests. If there’s a backlog, the system generates a message that’s sent to section editors, who respond and make corrections when necessary.

Limitations of traditional corrections

Of the 540 corrections requests submitted using the report-an-error form, 32 pointed out factual errors and 180 pointed out bad links and grammatical errors. Of that 180, about one-third were issues with photo captions. The remaining requests came from readers who were expressing opinions about stories.

“We receive a lot of requests for corrections that are essentially not corrections, but readers’ opinions,” Narisetti said by phone. “Someone will write in saying, ‘You got it all wrong.’ ”

Often, readers are just expressing their opinions on matters that don’t require corrections. But sometimes, they raise valid points, alerting journalists to “big picture errors.” As Kathryn Schulz, author of “Being Wrong,” has pointed out, the accelerated pace of today’s journalism makes it easier to make these types of errors by preventing us from seeing the deeper meaning of stories — or causing us to miss the point of them entirely. And currently, there isn’t an effective way to acknowledge such errors.

In his month on the job, Ombudsman Patrick Pexton said he hasn’t received requests to correct any big picture errors, but he has gotten notified about several factual ones. He’s written about some of them, including one in which a graphic accompanying a story about pension liabilities listed dollar figures in millions instead of billions. The mistake was fixed, Pexton said by phone, but the correction still didn’t feel sufficient.

“We should write corrections without hesitation or shame, but they never fully compensate for the error,” said Pexton, who noted that he receives about five to 10 correction requests from readers per week.

Engaging with users, responding quickly

Throughout the coming weeks, Pexton plans to keep track of how well the report-an-error feature is working and how quickly editors are responding. Two years ago, former ombudsman Andy Alexander criticized the Post for not addressing a backlog of hundreds of reader correction requests, and for moving at a “snail’s pace” when correcting errors. He later praised the paper for responding to the issue.

“My experience so far is that they respond pretty quickly,” said Pexton, who often forwards the requests he gets. “I think they’re a little more responsive when it comes directly from the ombudsman because they’re afraid I’m going to write about it.”

Narisetti said his hope is that by making it easier for readers to submit correction requests, the Post will become more aware of the errors it makes and build trust. The report-an-error feature also fits with the goals of the redesign: to bring more people to the Post’s content and let them engage with it more.

“We have been very successful in growing our audience, but we haven’t been as successful in keeping them engaged,” said Narisetti of the Post’s website. “This increases engagement because we’re being responsive to readers, and there’s significant value in that.”

The problem with quantifying corrections

The number of corrections the Post runs has remained steady throughout the past five years, Narisetti said. “In any given year,” he noted “we end up running between 600 and 800 corrections, which is pretty low given the volume of content we put out.”

In theory, report-an-error features such as the Post’s would help news organizations become more aware of the errors they make and, in turn, make them less likely to repeat the same errors in the future. This, in turn, could reduce the number of corrections they run each year.

The number of corrections isn’t as important, though, as the total number of errors that remain uncorrected.

“Using ‘total number of errors corrected’ as a metric for how well a newsroom is doing is problematic. A low number could mean ‘we get stuff right’ or it could mean ‘we really resist correcting our mistakes,’ ” Scott Rosenberg, creator of MediaBugs, said via email. “The best metric would be the ratio of total number of corrections to the total number of mistakes — if you correct 90 percent of your mistakes that’s better than correcting 25 percent.”

Research has shown that fewer than 2 percent of factual errors identified by news sources are corrected. Ideally, report-an-error features would help increase this percentage, both because they give readers an easier way to request corrections and because they make it harder for news organizations to ignore them.

Getting more thoughtful correction requests, building trust

Matt DeRienzo, publisher of The Register Citizen, said the paper is much more aware of the corrections it needs to make since launching a fact-check form last May.

After seeing the Post’s report-an-error form, The Register Citizen changed its form to mirror the Post’s. Since then, he said, people’s comments have been more thoughtful and of a higher quality. About 80 percent of the time, the comments point out legitimate corrections.

Similar to the Post’s form, The Register Citizen’s form asks readers, “What should we have written?” and “Who else would you suggest we interview to improve this story?” In a phone interview, DeRienzo said he hopes this latter question will help the paper develop new sources. The form also asks for, but doesn’t require, readers’ names and contact information. When given permission, the paper credits readers in its corrections.

The Register Citizen runs three to four corrections a week, very few of them to address big picture errors.

“That’s where we need to change. If you think about all the corrections of poor context or missing context, there’s a ton of that,” said DeRienzo, who hopes the fact-check form will make the paper more aware of big picture errors it might make. “I almost want to phrase the form as the ‘What did I miss? form.’ ”

DeRienzo indicated that almost all of the 17 other Journal Register Company’s dailies now have fact-check boxes on their sites. Other news organizations, such as The Huffington Post and The Toronto Star, also have similar correction forms.

Such forms give news organizations an opportunity to connect with their readers, and perhaps more importantly, show them that they care.

“At the end of the day, I want readers to engage more with us and, in this case, tell us if we’re messing up,” Narisetti said. “What we are trying to say is that like many large newsrooms, we are human. We make mistakes, we correct them quickly, and we apologize and move on.” Read more