Wrangling Rendering

By By Mary WagnerInternet Retailer

IE is no longer the only browser in town. So how do e-retailers ensure every consumer sees a site properly?

An online shopper calls up a digital camera product page on his favorite consumer electronics site and it looks exactly as it’s intended to look. Across the street, his neighbor calls up the same page to find a block of text overlaying the product image. What gives? It could be that they are using different browsers.

E-retailers today are finding that consumers are accessing the web through a growing variety of browsers that may render elements on a web page differently. That wasn’t a problem back in October 2004, when 92.2% of web users viewed web pages with Microsoft Corp.’s Internet Explorer.

But Internet Explorer has steadily lost market share since then-to 67.4% in February, according to web analytics vendor Net Applications. Mozilla Corp.’s Firefox has gained dramatically, from 2.8% market share in October 2004 to 21.8% in February. And Apple Inc.’s Safari, Google Inc.’s Chrome and Opera Software ASA’s Opera also are starting to register with consumers.

Related Articles

International standards organization the World Wide Web Consortium has issued best practice development standards for the makers of browsers, which are basically software applications. But every browser in use by consumers doesn’t reflect every standard. While newcomers like Firefox say they make every effort to support standards, discrepancies at variance with the standards may slip through the development process.

“Firefox developers take standards support very seriously, but it would be difficult to claim perfection in any endeavor,” says Arun Ranganathan, tech evangelist at Mozilla.

Different generations of the same browser also may render web content differently because earlier versions did not comply as fully with industry standards. “We made a massive architectural shift from IE 6 to IE7 to support standards,” says a Microsoft spokesperson.

As a result, though there is much overlap in how different browsers interpret code that displays the text, images and features of a web site, the same page may look different to users of different browsers, or different versions of the same browser. And as consumers latch on to their increasing browser options, that leaves e-commerce sites wrestling with a growing question: How can they be sure the features they design so carefully into the pages of their sites look the same to every shopper in every browser?

Prioritizing populations

Retailers tackle these issues in various ways, including deciding which browsers they design their pages to support and how they design pages. They can also test the performance of pages and applications in different browser environments before pages go live, and monitor how the site renders in different browsers once it’s out on the web. They also look for the functionalities provided to their sites by third parties to arrive already tested by the vendor.

With the web and how consumers access it an ever-expanding universe, “you’re never going to satisfy 100% of the population,” says Doug McIver, senior director of product management at rich media technology vendor Allurent. “So we do what I’d advise any e-commerce site to do: Look at the population they serve, prioritize which browsers are particularly important, and test across them. We test across 15 to 20 different browser and operating system combinations.” McIver estimates that covers what’s used by about 95% of Internet users.

Different operating systems, such as Microsoft Windows, the Mac operating system and Linux, also may affect how a web page looks to consumers. But testing how the site looks on every possible browser and operating system combination would place heavy demand on I.T. resources, so many e-retailers make a strategic decision about how far they’ll go.

Before going live, some simply test pages against the current version of market leader Internet Explorer, perhaps adding the current Firefox. Others may elevate the importance of a browser above its market share because of its connection to a particular audience; for instance, a digital music-buying audience that gravitates toward Apple’s Safari because they love The Apple iPod music player.

At online jeweler Goldspeed.com, chief executive officer Neil Kugelman says before any new page goes live, it has been tested at a minimum in the two most recent versions of Internet Explorer, Firefox, Safari and Chrome, as well as with the two most recent versions of Windows and the Mac OS. The tests review whether the page renders properly, and whether the images on it are in the correct position and are readable and aesthetically pleasing, Kugelman explains.

Problems show up often enough, Kugelman says, to justify the developer time it takes to carry out the tests. “If we don’t test across browsers we’ll miss something,” he says. One recent example: A group of product thumbnails that was supposed to be displayed two by two showed up as a single column of four in one browser.

Going virtual

Retailers have many options for catching cross-browser glitches before pages go live. The just-released new version of Internet Explorer, IE8, for example, offers access to a developer toolkit that helps web developers identify where they might need to update applications for correct rendering in the new browser.

Adobe’s latest Dreamweaver software has a Live View feature that shows what draft page designs would look like in an actual browser. The software simulates page views in different browsers in combination with any operating system supported by that browser, the company says.

A web-based test service from Gomez Inc. lets e-commerce site developers submit draft pages, choosing the browsers and operating systems they want to see the pages rendered in. Reality View XF supports more than 500 possible browser/operating system combinations, Gomez says. It also provides preliminary performance data on the speed at which individual elements load up on the page. That can help to make sure that key branding elements-like the Staples “easy button,” for instance-load up first as the page displays in any browser.

E-retailer eBags.com has been using Reality View XF since last August to test more than 50 browser and operating system combinations, according to Mike Frazzini, vice president of technology. He estimates that in terms of I.T. staff time, the outsourced, automated tool accounts for a greater than 50% cost savings. It also permits eBags to test more browser/operating system combinations than before, with those it now tests covering about 98% of Internet users, Frazzini says.