Words Work When They’re Readable

10 years ago the web was slow as a snail so websites were simple: black font with a white background. Today, because CSS is a thing and slow internet isn’t we’ve started designing the crap out of pages.

I can’t tell you how many sites I encounter that use a charcoal gray font color. It looks pretty but causes so much eye strain. And because CCS allows for it we also have pages with fancy shiny buttons, an incredible array of color shades, gradient backgrounds, shadow effects, parallax effect (example: a background image is moved at a different speed than the foreground content while scrolling), etc.

If your objective is to have visitors read your page content (and I hope it is) then just get out of way and follow the universal comfort reading formula: black text, nice big font size, eggshell white background.

Books and newspapers have used this formula for centuries.

This is ESPECIALLY important when talking about mobile pages.

Basecamp.com has some of the best graphic designers on staff. They could easily design the most beautiful pages in the world. But they don’t do it. Here is a snippet of the page they created to promote their latest book “Calm” (https://basecamp.com/books/calm):

Basecamp_Book_Calm.PNG

 

[My screenshot doesn’t do justice. Check https://basecamp.com/books/calm on your phone for full effect.]

We think visitors will not read long text. They will not read long text if your site is over-designed (design can cause distraction fatigue). They will also not read if your text isn’t in the right size proportion. And finally, they will not read if your content is boring. But if you don’t commit those sins your shoppers will read.

And you can take this to the bank: of all the things one could A/B test, words have the biggest influence on converting browsers.

Know Why Your Customers Like You?

My wife surprised me with a trip to a camping site with a Yurt. If, like me, you have no idea what a Yurt is here is a picture:

24-Pacific-Yurt-With-Picnic-Table.jpg

Was a fun experience. But what I liked best wasn’t the Yurt, it was the camp washroom facility. Really appreciated how clean it was. But the camp management will never know this because they didn’t ask. They will just assume that since the most unique aspect of their property are the Yurt that’s what their advertising needs to market.

We make this really bad assumption of thinking people love our products because of the physical attributes of the actual product. What people ACTUALLY love is the experience around using products and services.

We assume people who bought and loved the Travel Pro 3-Wheel mobility scooter must love it because of one of these listed features:

Top Speed: 4.00 mph
Turning Radius: 32.75″
Drive Range: 6.30 miles
Weight Capacity: 275 lbs
Heaviest Piece: 27.5 lbs.
Disassembles: Yes
Seat Width: 17″
Max Seat to Ground Height: 21″
Height Adjustable Seat: Yes
Flip-Back Armrests: Yes
Wheel Type: Three Wheeled
Front Wheel Size: 8″
Rear Wheel Size: 8″
Air-Filled (Pneumatic) Tires: No
Overall Width: 19.5″
Overall Length: 37″
Batteries Included: Yes
Basket Included: Yes
Weight Without Batteries: 73.50 lbs.
Battery Pack Weight: 18.50 lbs.
Charging Port Location: Battery Box

But that’s just one dimension of how shoppers think, and it’s a limiting one. Here are some of the customer comments I picked from their customer reviews. Bolded snippets are sections that stood out:

“Very quiet when you ride it – and I love the cup holder.”

“Strengths: Comes assembled.

“This was the most well packed product I’ve ever received along with clear directions and easy assembly topped off with very fast delivery.”

“Like that it has solid tires so they won’t go flat.”

“Gives me the ability to get around the house, It fits through the doorways, but my wheelchair won’t.”

“As a single woman with arthritis I am able to load and unload this scooter into my vehicle by myself (takes about 5 – 10 min. due to my mobility issues). I was able to take it to a wedding on the grass and it did fairly well. It’s very compact and convenient. This product has enabled me to keep my job and transport to my required locations independently.”

“I have spinal stenosis and cannot stand for any length of time without pain. I went to the mall for the first time in 4 years. Even I can disassemble this machine. So I am not dependent on my husband.”

“I like the swivel seat

“It has nice curb appeal. I use the scooter to travel back and forth to our club house for activities.”

“The price & that it’s Made in USA

Stops immediately when you let off the hand lever. Climbs ramps easily.”

“I was glad I got the 3-wheel model as it is SO maneuverable; not at all tippy.”

“The instructions that came with the product are very easy to understand

“… reassuring year’s worth of in-home support/insurance.”

“Easy to travel with both in the car and other forms of travel (boats & planes).”

“Before I bought it I read reviews that said it tipped easily on uneven surfaces. I went to a convention and had to park in the unpaved area, NO Problem with dirt, grass very uneven surface.”

“It turns on a dime. Even in an elevator you can go in straight and clear the door.”

“Ability to break down into 5 pieces for easy to transport … if need to pick up to fit into small space like on a bus.”

“The best is I can bring the battery’s inside to charge and leave the scooter in the car”

“The ease of transporting this scooter – fits into the trunk of a Nissan Altima!”

“I love the way it CAN fit into a trunk of a small car.”

“The ease of taking it apart and the fact that I can fit it in the trunk of my Toyota Camry is amazing.”

“Light weight easy to load in my explorer.”

“Can fit in the trunk of our little car to take it with us as we travel.”

Note: The 5 reviews listed above all talk about being fit into trunks of different car brands. Buyers seem relieved to know their scooter can fit into their car. The retailer could add a little widget on the product page to ask “What vehicle do you plan to transport this scooter on?” and next to that show a dropdown (or autofill) with most car models (such pre built car model menus can be easily found online. Your developer doesn’t have to manually build one). Once the shopper enters their model they will see a confirmation message. Mockup of our idea:

1: User first enters car make on product page:

Spin life Selection.png

2: They then hit SUBMIT button and see this (notice confirmation text in green):

Spin life Activated.png

If I was the retailer I would use these feedback snippets to rewrite my product description. Additionally, I would make a product video and talk about these features.

But this is the tip of the iceberg because it’s what we picked from the published reviews. As a rule of thumb 1,200 purchases generate one (1) organic product review. This product page has 473 reviews, which means spinlife.com may have sold over 500,000 units of this scooter. So I would literally call the thousands of people who bought the scooter (and didn’t return it) to ask them one simple question, “what feature did you like best about your scooter?” That one question will give us a wealth of knowledge. Knowledge we could use this improve this page conversions rates by over 13%.

Are you looking to unlock a 13% conversion lift on your best selling product page? Good, then apply this approach to your site. Or, better still, set a time to chat with me: meetme.so/RishiRawat

Don’t Stack Vertical, Bro

Companies typically show pricing plans to desktop users as a table. This helps with Cognitive Ease.

Wait, what’s Cognitive Ease? It’s the measure of how easy it is for our brains to process information.

Anyway, back to the post. This is how sites typically show pricing plans to desktop users:

Getresponse.com_Pricing_Plan.png

The challenge is, how do we show that pricing plan on the mobile page? Here is how it looks:

Getresponse.com_Mobile_Pricing_Plan.PNG

On my phone, I can only see the first 2 plans. I need to scroll down to see the 3rd plan, which means it’s impossible to compare the Max plan with the Beginner plan.

Todoist.com seems to have solved this.

This is their desktop pricing plan:

Todoist_Desktop_Plan.png

This is their mobile plan. You will see plans are stacked side by site, thus minimizing cognitive load:

Todoist_Mobile_Plan.PNG

They display plan attributes in rows so it’s easier for the mobile users to compare their 3 plans side by side.

Here is another approach from Amazon’s mobile site:

But Things Have Always Been Done This Way

Coming up with new ideas is hard and the brain is lazy. So when we think of new ideas the brain shouts, “But things have always been done this way”. I’m sure Nikki Sylianteng had those same thoughts when she got thinking about parking signs, which, by the way, are confusing as heck. But Nikki didn’t let the norm hold herself back.

Parking_Image1.png

Parking_Image2.png

Learn more @ http://nikkisylianteng.com/project/parking-sign-redesign/

If You Want Feedback Remove All Friction

Received this great email from Lyft asking why I hadn’t used the service in a while. See screenshot and notes below screenshot:

Lyft_Survey.png

Love this email for 4 critically important reasons:

1: It’s personalized to my actual behavior (“why have you not used Lyft since 6/14.”)

2: Headline makes it clear this is a quick email (“One-Minute Feedback”).

3: I just have to click one link to submit my response.

4: Lyft doesn’t send a ton of emails so I noticed this message.