Three Service Packages Side by Side

Three columns and a phone

On a wide monitor the packages page looks orderly: three columns side by side, Basic, Standard and Premium, each with a price and a long list of ticks.

On a phone the columns stack. The visitor scrolls through fourteen lines of Basic, then fourteen lines of Standard, trying to remember which line was missing the first time.

By Premium they have lost track. They phone to ask which package they need, or they leave and look at a competitor whose page answered the question.

A package page exists to make a choice easy. When the differences cannot be seen, it does the opposite.

What makes packages hard to compare

• Names that describe nothing, such as Bronze, Silver and Gold.
• Long tick lists where most lines appear in every package.
• The real difference buried halfway down the list.
• A price on two packages and call us on the third.
• A middle package that exists only to make the top one look good.
• Columns that stack into one long scroll on a phone.

The fifth is the one visitors sense without naming it. A middle option priced just under the top one, with far less in it, reads as a steer, and steered visitors start doubting the page.

Name packages for who they suit

Basic, Standard and Premium tell a visitor the order of the prices and nothing else. They do not say which one fits a small job or a large one.

Better names describe the scope or the situation: Tune-up, Repair and Rebuild, or One visit, Monthly and Seasonal. A visitor recognises their own situation in a name like that before reading a single line.

Under each name, add one sentence saying who it is for. That sentence does more of the choosing than any list of ticks.

Lead with what is different

Most package lists repeat the same eight lines three times and hide the two that matter among them.

Move the shared lines out. One short list below the packages, headed every package includes, covers them once.

What remains in each package is what makes it different, and those lines go at the top in plain words: who does the work, what is included that the others leave out, how long it takes.

Three or four lines per package is usually enough. A package that needs twelve lines to describe may really be two packages.

A worked example

An estate sale company that values, stages and runs sales for families clearing a parent's house offered three packages, named Silver, Gold and Platinum.

Each column listed fourteen services. Gold and Platinum differed by one line, the clear-out after the sale, which sat twelfth in the list. Silver differed from Gold only in who ran the sale on the day.

On a phone, both differences were close to invisible. Most callers opened with the same question, which one do we need, and the answer took ten minutes every time.

The page was rebuilt around three new names: Advice and pricing, Full sale, and Full sale with clear-out.

Each had a sentence saying who it suits, its fee or commission, and its two or three differences at the top.

A single list underneath covered what every package includes: the walk-through, the valuation of significant items and the written agreement.

On a phone the packages became three short blocks, each with its own button to book a walk-through.

Each block can now be read on its own, so a family can choose from the screen in front of them.

Laying them out for a phone

Most visitors to a packages page arrive on a phone, so start the design there rather than squeezing the desktop columns down.

The simplest layout that works is a short block per package: name, who it suits, price, differences, button.

Each block should fit on about one screen, so the next is already in view as the visitor scrolls.

Wide tables of ticks rarely survive a phone. If the detail needs a table, put it below the blocks for those who want it.

Then check the page on an actual phone, held upright, scrolling with a thumb. The test is whether you can tell the packages apart without scrolling back up.

Show the price or its basis

A package without a price leaves the visitor guessing which one they can afford, and guessing tends to end in leaving.

Where the price depends on the job, give a starting figure or the basis: by the hour, by the room, a share of the sale. Then say what moves it up or down.

What does not work is pricing two packages and writing call us on the third. It suggests the third is either very expensive or negotiable, and neither impression helps.

An honest middle

A middle package should be the one most customers actually need, priced for what it contains.

The decoy version, a middle option built to make the top one look like better value, is a familiar pricing trick. For services people buy once or twice in a lifetime, it mostly breeds suspicion.

A most popular label is fine if it is true. And if nobody has bought the bottom package in two years, it is probably not a real option, and the page is clearer without it.

The counter-case

Packages suit work that comes in recognisable sizes. Work that is different every time, such as a custom renovation, packages badly, and forcing it into three boxes misleads.

There, a page explaining how the price is built, with two or three typical examples, does the job better.

And a business with one main service does not need tiers invented to fill a layout. One clear description and one price beat three columns of near-identical ticks.

Where packages do fit: plain names, differences first, shared items once, a price, and a layout that works on a phone.

The order to do it in

1. Write down what actually differs between packages.
2. Rename each package for who it suits.
3. Move shared items into one list below.
4. Put the differences at the top of each.
5. Show a price or how it is worked out.
6. Give each package its own button.
7. Check the page on a phone, scrolling.

Step one usually decides the rest. Writing the real differences in a sentence each often shows that two packages are nearly the same, or that one exists only to fill a column.

Checking how the finished page behaves at every screen width follows the same logic as pages that look finished only on a wide monitor.

Frequently asked questions

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.