The Billion Dollar HTML Tag

Marissa Mayer

Marissa Mayer of Google discusses web site performance Wednesday at the Velocity 2009 conference (photo by James Duncan Davidson via Flickr).

Can a single HTML tag really make a difference on a corporation's financial results? It can at Google, according to Marissa Mayer, who says web page loading speed translates directly to the bottom line.

"It's clear that latency really does matter to users," said Mayer, the VP of Search and User Experience at Google and today's keynote speaker at the O'Reilly Velocity Conference. Google found that delays of fractions of a second consistently caused users to search less. As a result, its engineers consistently refine page code to capture split-second improvements in load time.

This phenomenon is best illustrated by a single design tweak to the Google search results page in 2000 that Mayer calls "The Billion Dollar HTML Tag." Google founders Sergey Brin and Larry Page asked Mayer to assess the impact of adding a column of text ads in the right-hand column of the results page. Could this design, which at the time required an HTML table, be implemented without the slower page load time often associated with tables?

Mayer consulted the W3C HTML specs and found a tag (the "align=right" table attribute) that would allow the right-hand table to load before the search results, adding a revenue stream that has been critical to Google's financial success.

Google tests the relationship between page load times and usage in regular experiments with subsets of users. "Injecting delays consistently produced a drop in searches," said Mayer. An example: the number of search results, which defaults to 10 results. When some users wanted to see more results, Google tested pages offering 20 or 30 results, which added between 0.4 and 0.9 seconds to the load time.

The outcome: users seeing the page with 30 results would up conducting 25 percent fewer searches, a trend which could equate to billions of dollars of lost revenue. Google allows users to customize their search settings, but the default remains set at 10 results.

The oddest HTML hack involved the Google Checkout "shopping cart" icon that appears next to ads for vendors using Checkout. Pages where the icon appeared were loading slower than other pages, "It's such a little image," said Mayer. "It shouldn't make such a big difference. You actually have an image opening another connection, and connections are expensive."

Google engineers found a kludgy but utilitarian solution in HTML table code. "They actually found a way to draw the Google checkout cart using HTML," said Mayer. "It renders faster. It's interesting to think that HTML and images can affect user impressions of speed."