Before a redesign, read a full year of the device, screen resolution and browser reports in Analytics, page by page. Design and test for the screens your visitors use, not for the office computer.

The computer a redesign is judged on

A redesign usually gets approved on the computer in the office: a wide monitor, a current browser, a fast connection and an owner who knows where everything is.

Customers rarely see the site that way. Some are on a phone in a parking lot, some on a tablet on the couch, some on a work computer whose browser nobody has updated in years.

Analytics has been recording which of those visitors you have, every day, for as long as the tracking code has been on the site.

An hour with those reports before anyone sketches a layout settles questions that otherwise get decided by whoever holds the mouse.

Five views worth the hour

The third is the one most redesigns skip. An iPhone 6 shows pages 375 pixels wide, the Plus models 414 and the iPhone SE 320, and the report counts visits at each width.

A year, not a month

Set the date range to the last twelve months rather than the default. A single month can be bent out of shape by one campaign, one holiday or one busy week.

Then compare the same months a year earlier. The new design has to suit the visitors of the next few years, and the direction of travel says more about them than one year's split.

Turn on the view setting that excludes known bots, if it is off. It cleans the figures only from that day forward, which matters for the comparison after launch.

The split changes from page to page

A site-wide figure hides the decision that matters. Add device category as a secondary dimension on the landing pages report, and each page shows its own mix.

Directions, contact details and anything linked from the Google listing tend to lean towards phones. Detailed service pages and forms that need paperwork to hand often lean towards computers.

If goals are set up, look at completions by device as well. A group that visits a page often and completes little is telling you where the current site fails it.

What the report cannot see

The report describes the visitors the current site kept, not the ones it lost.

If the old site is awkward on a phone, many phone visitors leave within seconds and do not return, so phones look less important than they are.

A much higher bounce rate on phones than on computers is the usual sign.

It also counts visits, not people. A customer who reads on a phone at lunch and sends the form from a desk that evening appears as two visits on two devices.

A worked example

A conference centre in a business park, with six meeting rooms and its own catering, was planning a redesign built around phones first.

Read over a full year and page by page, the devices report showed two audiences. The room, capacity and catering pages were read mostly on computers during office hours, a large share of them in Internet Explorer 11.

Those were event planners and office administrators researching at work, on machines their employers controlled. The directions and parking pages were read mostly on phones, early on event mornings, by the people attending.

The mechanism was plain once seen: the people who book and the people who attend use different devices at different times.

The plan changed. The planner pages were designed for a wide screen and tested first in Internet Explorer 11, where the enquiry form's date picker had never worked.

The directions page became a phone page: the address, a map link and a number to tap.

Why the office computer misleads

The office machine is the least typical device that will ever visit the site.

Its screen is wider than most visitors' screens, its browser is current and its connection fast. It has usually stored the site's files from earlier visits, so pages appear faster than a stranger will see them.

And the person using it already knows where the phone number is, which no customer does.

From the figures to a test list

Write down the screen widths and browsers that together account for most visits. Those get designed for and tested first, on real devices where possible.

Then set a cut-off. Anything below it gets a check that pages load and forms send, not a layout of its own.

Hand the list to whoever designs the site before the first sketch, so the layout is drawn for those widths rather than adjusted for them at the end.

Old browsers on the list

Most reports show a tail of old versions: Internet Explorer 9 and 10, Safari on older iPhones, and Chrome on Windows XP and Vista computers, which stopped receiving updates last week.

Nearly all of them fall below the cut-off, and rightly.

The exception is a group that matters more than its numbers. If the people who book the largest jobs use an old office browser, that browser goes on the main list.

Measure the same way after launch

Note the figures before launch, and add an annotation in Analytics on launch day so the change shows on every chart.

A few months on, read the same reports. If one device group is doing worse, you find out while the build is fresh enough to fix cheaply.

The counter-case

With only a few hundred visits a month, the figures are thin, and a split of forty visits proves little. Read it anyway, and weigh it against what you know of your customers.

A new business has no history, and the habits of its trade are a reasonable start. No report replaces watching a stranger use the site on a real phone.

For any site with a year of data, though, read the devices before the design, and let the figures decide what gets tested first.

Before the first sketch

  1. Set the date range to twelve months.
  2. Note the device split for the whole site.
  3. Add device category to the landing pages report.
  4. List the top screen widths and browsers.
  5. Compare bounce rates on phones and computers.
  6. Give the list to whoever designs the site.
  7. Annotate the launch date in Analytics.

Step three is the one that changes designs. The site-wide split says phones matter; the page-by-page split says which pages they matter on, and which visitors are on something else entirely.

Reading what visitors do around a single page is covered in visitors who look at prices and leave.


Frequently asked questions

Where does Analytics show visitor devices?

Under Audience: the mobile overview splits visits into desktop, mobile and tablet, the devices report names models, and the browser report shows versions and screen resolutions.

Why use a whole year of data?

A single month can be distorted by one campaign, holiday or busy week. Twelve months, compared with the year before, shows the real split and its direction.

Why read the report page by page?

Because the split differs between pages. Directions and contact pages often lean towards phones, while detailed service pages and forms may be read mostly on computers.

Can the report understate phone visitors?

Yes. If the current site is awkward on phones, many phone visitors leave at once and never return, so the report shows only the visitors the old site kept.

Why is the office computer a poor guide?

Its screen is wider, its browser newer and its connection faster than most visitors have, and the person using it already knows where everything on the site is.

Do old browsers need their own design?

Usually not. A version with very few visits needs one check that pages load and forms send, unless the people who book your largest jobs use it.

West Coast Media Solutions Inc. provides web design, web development, hosting, digital marketing, and business consulting to organisations across Canada, drawing on more than twenty-five years in the field.

Redesign being approved on the office monitor?

Share your Analytics with us. We will turn a year of device data into a list of what to design and test first.

Start a Conversation