Bookmark and Share

The best way to approach your A/B method is to take the scientific approach or better known as “The Scientific Way”.

Ask a Question

Research the behavior of the users a website is targeted at and understand where they tend to bounce off the path leading to the goal. For example, you observe that a lot of visitors either don’t fill a required form or start filling it and then abandon it somewhere in between.

Do Background Research

A good place to start your research is by analyzing your site analytics. You can determine many things about how your visitors interact with your site. For example “The signup form has too many fields leading to a high abandonment rate.”

Construct a Hypothesis

A hypothesis is an educated guess about how things work. The hypothesis might be very specific or it might be broad. For example “Reducing the number of fields in the signup form will reduce the form abandon rate.”

Test Your Hypothesis by Doing an Experiment

Your experiment tests whether your hypothesis is supported or not. It is important for your experiment to be a fair test. Based on your hypothesis, you create a variation in which you reduce the number of form fields. You split the website traffic 50/50 between the original and the shorter variation, and wait for the experiment to run until it has achieved statistical confidence (95% confidence is the accepted standard and your chosen software should report this). Remember to always test against the original (the “control”) at the same time so you can compare results. This way you’ll know whether a variation is better or worse than the original.

Analyze Your Results

Once your experiment is complete, you collect your measurements and analyze them to see if they support your hypothesis or not. You see whether the variation performed better or worse than the control.

Conclusion

If the variation performs better, you implement it for all users. If it performs worse, you learn that form length is probably not responsible for the high abandonment rate and go back to identifying the problem.

Bookmark and Share

The web is not the tortoise and the hare race, slow and steady definitely doesn’t win the race. Not only will slow websites frustrate and deter your visitors, they can also get dinged in search engine rankings. Here at Elegant Themes we try to code our themes to be speedy and efficient, but there is also a lot that you can do outside of the theme to improve performance. In this post, I will outline the most important steps to ensuring that your WordPress website is running at hare-like speeds.

Bench-marking Your Pageload

We will need a way of measuring the size and speed of the website in question. To do this we will be using the free tools at Pingdom.com. Using the Pingdom Website Speed Test tool, we can do an initial test of our page speed.

Caching Your Pages To Serve Static Content

When your WordPress website is loading, there is a lot going on behind the scenes. PHP functions are being run and MySQL database are being queried to decide exactly what should be output to your visitor for that given page. The less intensive the queries on the page the better, and the only thing better than less queries are none at all! Using a cache plugin, you can create a static version of your website and have it served instantly to your visitors. Not only does this make your website load faster, it also lessens the load on your server’s CPU, Memory and HD. There are a few great Caching Plugins out there, and I would suggest using W3 Total Cache.

Minify & Consolidate CSS and JavaScript Files

Minifying your CSS and JavaScript files removes unnecessary characters within the file, thus lessening the size of the file and reducing the time it takes to download it. Consolidating the files together reduces the number of files that are downloaded, thus lowering the number of requests on the page. Both of these factors contribute to your page load. You can minify your CSS files manually using this online minifier for CSS and JavaScript, or you can let a plugin do the work for you. The same plugin we used to cache our page in the previous step, W3 Total Cache, also has an option to automatically minify and combine your CSS and JS files. This generally works great, though you should always test your website thoroughly to make sure that the compressed files didn’t cause any JavaScript problems.

Using A Content Deliver Network

What a CDN does is distribute your files to various datacenters all around the world, making it much more likely that there is a server closer than your own to each person that visits your website. The visitor is then served your files from the closest server, thus improving your website’s loading speed.

Implementing a CDN can drastically increase your website’s speed, even if you don’t notice the results at home. On a standard website host, your files are being stored on a single server at a single location somewhere in the world. The closer your visitors are to the datacenter in which your files are stored, the faster they can access them and the faster your website will load. For those visitors who are visiting your site from overseas on the other hand, it might be taking a long time for that data to make it across the ocean and into their browser!

Bookmark and Share

So how did you end up here?

Maybe you were browsing Twitter, maybe it was a Google search. But these don’t answer the question.

What led you to landing here, on this single article page? The answer is most likely: the killer headline. That iss what originally caught your attention and made you decide to click and read this article.

That’s what an effective attention grabbing headline does. It catches your attention, connects with you in some way, and compels you to either click into the page, or keep reading further.

A poor headline does the opposite: either you’ll click the back button on your browser, or, in the case of Twitter, a poor headline fails to grab your interest so you will skip right past it.

In other words, it really doesn’t matter how insightful your post is, or how perfect your product landing page is, or how hilarious that video you’ve created is. If your headline fails to do its job, your audience will never get far enough to appreciate all of the work you’ve put into your content.

This article will cover a few tips and techniques for devising a great effective headline. These ideas will help you keep a larger number visitors fascinated as they read through your landing pages and hopefully end up engaging with your products or services. We will also look at a few ways we can design our headlines to stand out and command attention.

First, let’s debunk a few myths about writing headlines.

Common Misunderstandings

“A headline should summarize the page”

Don’t try and re-tell the story of your page in one sentence and call that the headline. First of all, that’s simply not possible. Second, if you take this approach, your headline will either be very bland and boring, or it won’t make sense.

Rather than trying to encapsulate the entire body of work in one sentence, try picking out the single most interesting or surprising idea and use that as the basis for your headline. Here’s an example of a (boring) headline trying to tell the whole story:

Copywriting and typography design techniques for headline writing, and more

This would be better:

Everything You Thought About Headline Writing is Wrong

“As long as it’s attention-grabbing, say whatever you want!”

Also a bad idea. Sure, you might draw lots of eyeballs and clicks if you use a headline like:

Watch This Kitten do a Backflip as Jealous Dog Watches in Awe

But if your page has absolutely nothing to do dogs and cats, then that traffic won’t stick around for long. They certainly won’t make it far enough through your page to buy from you or subscribe (or whatever your end-goal is). Click-bait headlines like these simply don’t produce the results that you’re going for.

The headline must be relevant to the content on the page. It should be intriguing, or surprising, or even shocking in some way, but that should be a lead-in to get the full scoop further down the page.

“Size doesn’t matter. Headlines can be as long or short as we want!”

When it comes to writing that top headline, size actually does matter, to an extent. The only rule of thumb I’d give you here is don’t make the headline too long.

If the top headline on your landing page spans three or more lines, the length will soften the impact of a great headline. A great headline hits you like a ton of bricks and grabs your attention. Three or four lines of really big text takes a few moments for a reader to sift through, which in this fast-paced world of the web, can be an eternity.

Another reason not to go too long would be if your headline might end up in a Tweet or an email subject line (as they often do). Tweets obviously need to be shorter than 140 characters, but you’ll also want to leave room for “@usernames” “RT…” etc. Email subject lines tend to get truncated when they’ve gone past seven words or so. Your headline won’t have the same effect if the audience can’t read most of it.

That being said, I wouldn’t go so far as to say “the shorter, the better.” Your primary goal is to make your headline compelling and attention grabbing, not to endlessly trim down the word count.

Too long:

Why Everybody And Their Grandmother Should Upgrade Their Browser And Stop Using Internet Explorer 6 So They Can Finally Experience The Web The Way it Should Be!

Better:

Have You Upgraded Past IE6 Yet? You Could Be Missing Out.

Tease Your Readers

Knowing your customer and your audience member on a deep, almost personal level, can go a long way to helping you write highly effective headlines. Think about how you interact with your best friend, or your brother or sister. You know them so well that you know exactly how to push their buttons, or tease them.

That’s essentially what you’re aiming to do with your headline — tease your readers, without going overboard.

You want to catch their attention with something surprising or almost shocking. You also want to identify with their specific pain point so that they care about what you have to say. The trick is to not give away what they want until after they’ve moved past your headline and read the article.

Don’t give away the solution or the answer they seek inside your headline. Simply imply that you have the solution by stating the problem. This gives your reader an incentive to read the sub-headline, and then the first paragraph, and so on.

Bookmark and Share

What Was I Looking At Again?

Most people have short-term memory issues.  What does this mean and why is it important to consider when designing? When we encounter something new, online or in the real world, our memory is shortened. Meet a new person or discover a new product: “What was their name again?”  We use some of our mental capacity to understand what we are seeing and this limits our memory. This is one reason why intuitive designs are more engaging. Our mind shifts from understanding something new to remembering something familiar.

Think about that.

Our memory works better with things we have seen before or are familiar to our brain. If we design in a manner that causes users to believe they have seen the application before, they can remember it and can immediately begin to engage with the product.

This phenomenon is based on something called the short-term memory mode. This means that users are more likely to stay engaged with a design that is easy to understand and has clear next steps. Easy enough, right? But, what happens when you have a complex concept or a long process?

Escalating Complexity for Design Stickiness

Escalating Complexity is a fairly common term, particularly in the gaming industry. Almost every single “successful” game uses this process. In the beginning, you provide the user with a very basic set of options. Then, as the user becomes comfortable and is on the verge of becoming bored, you add additional options. When done successfully, you create a user experience that is (almost) addictive.

Angry Birds Might Hold the Solution to Complex Designs
Let’s look at Angry Birds, which may just be the most successful game in smart phone history. If you’ve played this game, you will remember that in the beginning, all you could do is shoot a basic bird at blocks. One small, red bird. One target. In fact, the first several rounds are easy – they allow you to familiarize yourself with the game.

Just about the time that you begin to completely understand the scoring, functionality and strategy of the game, it changes. It increases in complexity in a progressive fashion , and before you know it, you’ve got an arsenal of different birds, with increasingly challenging targets. The brain has to consider how these new attributes will work. This goes on and on as you progress through the game, always forcing you to learn a new functionality and always reengaging your brain.

If Angry Birds started out with all of the different bird types and target options in the first round, you would leave – it would be too much to take in.  So, when designing a website, remember to keep the functionality basic and intuitive in the beginning, combatting short-term memory issues by allowing the mind to understand the process prior to progressively shifting to more complex ideas, designs, and functionality.

Bookmark and Share

Not Enough Preparation

It is imperative that a clean and easy user experience is implemented early on. The longer you wait, the more changes you will have to make and it will cost you a lot more time and possibly money. UX should be one of the highest priorities on your list, as this is normally the most important fulfillment users need. UX should not be added in half-heartedly later on after the product is launched.

Research, test, and be confident in your user experience before you plan on launching it, even in beta. A solid user experience can lead to a better, cleaner design in the long run.

Clear Goals

Whether this is a new blog talking about the latest web technologies, or an amazing startup launching a new product, it is extremely important to show a clear goal. When a user finds your site or product they should be able to know exactly what it is within seconds of seeing your site. This should be the most important and forefront element on the page. A nice simple header explaining your service, maybe a quick paragraph about it, and an image or video is all you need on the landing page.

Keep it simple and explain your product. Get the core description right, and the right users will come.

Too Much Text

Research shows that users are much more engaged with visual or audio cues. When designing keep in mind not to overload on text and to provide some visuals and possibly video or audio to make the website or app interesting. An interaction here and there is always nice and will keep users enthralled in the simple, but interesting features your site has to offer.

Do keep in mind not to over-complicate it though. Features are nice, but not if it is preventing the user from using your actual service. Define the goal of the user, and help them reach it. What do you want the user to do when visiting your site or app, how should they interact with it, what problems might they face? These are just a few of the many questions you could & should ask when designing and developing a new product.

Microcopy

Copy on a website is the text or the words that describe the product and help sort of “sell” the service. As explained by designer Gene Crawford,  it is important to clearly define your product and add helpful text to guide the user through your site. Be a defensive designer. Offer help where it is needed and always be ready to help even more. Users need context, so give it to them. Never use jargon or poorly written copy. Copy could make the difference between a new user, and an upset/confused visitor on your site.

Cluttered Forms

Another mistake that is made on a ton of websites are the forms. Whether it be a contact form or a sign up/sign in form, some have a common problem: Too many fields. When building and developing your forms add only the absolute most important fields that are necessary. It is imperative not to clutter the form and make it so the user must add a bunch of extra details when all that is needed are a few things like a name, email, and message for example.

Information Overload

When starting out, a lot of designers feel the need to cram crazy amounts of information on a single page. Posts, ads, icons, social media links, email lists, and pop-ups can seriously affect the experience of a new user on the site, not to mention it can easily make them turn away and just leave the site.

When designing a new site, consider organizing the information in a way that is easy on the eyes. Clearly define headers and paragraphs, separate information, use white space where it is necessary, and try to organize social links along with ads or other extraneous information in a subtle manner so as to not put a burden on the user.