Clicks gone wild!

I wouldn’t profess to be an expert in website usability, but I know enough to be dangerous. Here’s a fairly obvious but often overlooked tip: make it as easy as possible for your returning site visitors to take the actions they will take repeatedly. You can quantify this with a click count, which is, simply put, the number of clicks it takes a user to accomplish a task.

Google Search provides an example of how to do this right, with a click count of one—you type in what you want and click “Google Search” (or just press Enter).

Here’s how to do it wrong. Lightning Source, Inc. (LSI) is a company that prints books on demand. The #1 thing publishers return to their website to do (typically once per day) is to check an online sales report indicating how many books were ordered. In fact, for the vast majority of publishers that print books through LSI, checking this report is the only thing they will come back to do for months at a time. You would expect, then, that there would be an obvious link to run this report, wouldn’t you? Here’s how LSI actually implemented it.

First, you must log in by clicking the Login button at the top of the homepage to bring up the login form, enter your login credentials, and click “Login” to submit your credentials. Pressing the Enter key doesn’t work here (bad design). That’s two clicks.

s2

The next step requires dexterity. You must navigate to the My Account pull-down menu, select the second option (cryptically called “Financial Information (View and Pay),” then select “Publisher Compensation.” One more click.

s3

Next is where the click count tally really adds up. The publisher compensation report users will want in most cases is U.S. sales, for the current month, for all titles, displayed on the screen (not sent via email). This should be the default choice. Instead, there is no default choice. You must select the “LSI period” using two clicks of two drop-down menus, one for the month and one for the year. Then, you must check the box for “United States.” And then scroll down (below the fold on most screens, another bad design issue) and click “Submit” to see your report.

s4

Grand total: seven clicks.

This entire process could be done with two clicks. The home page could include form fields for a login name and password that are always visible, so that a visitor wouldn’t need to click “Login” to see the login form. There’s one click to submit the form information. Then, on the page that appears after logging-in, there should be a prominent button labeled “Run Publisher Compensation Report” or similar. That’s the second click. Done. Either under that button or on the report page, there could be a link to “Customize this Report” so that a user could run a report with parameters different than the default.

So, food for thought. Check your own website to make sure you are not asking visitors to jump through hoops to perform common tasks, such as signing up for your e-newsletter or finding your organization’s phone number. Remember, unnecessary clicks aggravate your website visitors, giving them a reason to abandon your site.

Advertisements

Top 5 best practices in writing Web copy

Writing for the Web is not fundamentally different than writing for something that will appear in print. However, following a few simple best practices can make a dramatic difference.

1) Break it down
Webpages are typically skimmed, not read. Few visitors will read your Web copy carefully, nor will they read it all. It’s therefore important to break down Web copy into easily-digestible “bite-sized chunks” (paragraphs) of no more than five sentences each, each with a meaningful section heading to help readers easily find the information they seek. Keep your writing concise.

2) Get the meat above the fold
Most website visitors won’t scroll down, so make sure the most important information on each webpage is above the fold, and preferably in the first two paragraphs. Keep in mind that different screen sizes and different browser-enabled devices (like the iPhone) preclude any consistent definition of just where the fold is. Still, most people will view your webpage using a desktop computer with at least a 17” diagonal screen at 1024 resolution.

3) Don’t ignore SEO
You want to make sure search engines will pick up your copy in organic search results. To that end, it’s important to use keywords and common phrases or industry-specific jargon in the copy that people might search for. However, loading up the text with meaningful words and phrases should never be done at the expense of writing clean, meaningful and readable copy.

4) Make it action-oriented
One of the great things about the Web is that taking an action—such as downloading a white paper, contacting a salesperson, or signing up for an email newsletter—is always one click away. Actions like these help companies acquire sales leads, and good website copy should encourage readers to do something after reading it.

5) Practice good Web style
I’m amazed how many websites have underlining or colored words or phrases in their copy, because these are easily mistaken for hyperlinks. If you must emphasize something, use bold or italics instead. Also, indents are not good style on webpages—left-justify all text, and leave the right unjustified.

Case study: landing page redesign boosts conversion rate 700 percent

It’s well known that a few simple changes in the design of a landing page for an SEM campaign can result in a significantly higher conversion rate. To wit: after redesigning a landing page, Gresham Storage Solutions saw a 700% increase in conversions. How did Gresham do it? By implementing a few simple best practices in landing page design.

Original Landing Page

The Original Landing Page Design

New Landing Page

The New Landing Page Design

Keep it focused
The biggest issue with the original page was that the first two paragraphs had nothing to do with the call to action. These paragraphs read more like an advertisement and probably deterred visitors from reading further to learn about the white paper. The new page cuts to the chase: download a free white paper.

Make images relevant
The central image is now more relevant. The image was changed from a picture of a hardware component that Gresham sells to an image of the actual white paper that this landing page offers for download. There is now no ambiguity about what the offer is. This helps reinforce that the landing page is not so much an advertisement for Gresham as an offer to obtain something of value.

Make it easy
In general, the less work the visitor has to do, the higher the conversion rate. The original form required four pieces of information. This was reduced to three by combining the first and last name fields. Also, the label for the form “submit” button was changed to a more compelling, action-oriented label: “click here to download your free white paper.”

Words and layout matter
Subtle changes to the text and layout make this page more compelling overall. For example, the first sentence—now placed in a paragraph by itself—makes it crystal clear what the offer is. And the second paragraph now introduces the critical word “free” (in bold), which was missing from the first version.

Together, these straightforward changes made all the difference in boosting Gresham’s conversion rate. If you’d like expert assistance in taking your landing pages to the next level, contact me.

A simple trick to reduce inbound spam

The mailto tag in HTML provides a simple way for a website visitor to contact you by email using a hyperlink. For instance:

<a href="mailto:johndoe@mydomain.com">Email John Doe</a>

Unfortunately, if your website uses this tag — and most do — automated web crawlers will eventually find it and add your email address to their library of spam target lists.

An easy workaround is to use JavaScript. Simply replace the mailto line in the HTML with these lines:

<script type="javascript">
emailname="johndoe"
emailserver="mydomain.com"
document.write("<a href='mailto:" + emailname + "@" + emailserver + "'>");
document.write(emailname + "@" + emailserver);
document.write('Email John Doe');
</script>

This code breaks apart the elements of a typical HTML mailto line of code in a way that spam crawlers can’t re-assemble. Voila, you now have an email hyperlink that spam crawlers won’t find!