Copyblogger

by  Rafal Tomal 30 Comments

3 Ways Your Web Design Can Better Connect You to Your Audience

 

How do people recognize good web design?
There is a big difference between good and bad design. Many people can identify a good design, but they don’t know what makes the difference.
Most people are not looking at a website and thinking: That website has well-matched serif and sans-serif fonts and a nice usage of white space!
Nope. Only designers think that.
In most cases people just feel like there is something good about it. Maybe it’s that eye-catching font or maybe that vibrant color, but they never actually know for sure.
There is something more to good design than making it just look right.
Because you can design your website according to all the major design rules with surgical precision … and people may still not like it.

Form, function, and feel

Good design is not just how a website looks; it’s how it works.
Yet a website is also not a machine. There is no simple code base or recipe for a good design. You can’t program it, generate it, or somehow automate the process.
That’s why your design needs something more.
In order to create a web design that connects, we need it to reach new levels of interaction with our audience.

1. Design for humans

Your website’s design creates a first impression with your users, and you want to make their interaction with your site as human-friendly as possible. Nobody wants to be greeted and instructed by a robot.
Making your website human-centered means making it easy to use and not making people guess what they are supposed to do next. It means that you focus your design around people’s actions and how your visitors expect your website to work for them.
You can improve user experience on your site by easily solving common problems that would otherwise take your visitors’ time to figure out.
The most common problems that visitors find on poorly designed websites:

• “Is it clickable?”
  All elements that need interaction with a user should be clearly visible or stand out in some way. Links and buttons should at least be marked in a different color than the rest of the body content.
  
• “Where am I?”
  Visitors will feel lost on your website when your design layout is not consistent. When people don’t know where to go, they’ll always find the exit.
  You can’t move the navigation or change the layout too often between pages. You should use common patterns throughout the entire website so your visitors can learn your website’s interface.
  Consistency is one of the most important aspects of a well-designed website.
• “I can’t read it!”
  Is your content easy to read? If not, your text may be too small or the color contrast between the background and text color may not be clear enough.
  Remember that you design your website typography for the human eye.
  If your targeted audience is a little older, you need to make your typography even bigger and add more contrast. You should focus on your users’ needs; don’t worry if it doesn’t look aesthetic to you anymore.

This is a sample piece of content from Medium.com displayed in two different versions. You can see clear spaces between the lines and high-contrast typography on the right side. On the left side you can see the same content and font type but with incorrect line spacings, small font size, and low contrast. You can clearly see which one is easier to read.

Take some time to get to know your typical visitors and study their behavior on your website. Find their common questions and problems, and try to solve them.
Make sure your website is usable by visitors that matter to you. Forget about making your design flat or using fancy colors if it’s not working for your people.

2. Design for emotions

Emotions have a big influence on most of our decisions. Therefore, we can’t ignore emotions when designing websites.
It all matters when it comes to people’s feelings. By using specific fonts, shapes, icons, photos, or colors we can affect the way people feel about our products, services, or brand.
You can see big brands playing with our emotions all the time. Just look at companies like Apple, Target, or Starbucks.
Product design is definitely one of the main factors in Apple’s success. Apple spends a lot of time and money making sure their products look sleek, sexy, and modern.

It’s also not just the way the product looks, but how it works and feels when you use it. Most Apple products have smooth, nice-to-touch surfaces and consistent rounded corners. It feels good, right?
So, how can you use emotional design?

• Give your brand a soul.
  Choose one emotion you want people to feel about your brand or website, then focus on it and be consistent.
  Do you want your website to be on the light-hearted, humorous side? Then use joyful colors, smooth shapes, funny characters, and combine it with light jokes all over the place.
  But let’s say you’re running a blog about sports cars. You want people to associate with your brand, so you need to make them feel cool about it. You may want to make your design sleek, modern, sexy, and use a strong color like red.
  You wouldn’t want to use bright pastel colors or Comic Sans font because that would mismatch your design with the taste of sports car fans.
  
  

  Mailchimp is one of those websites that has its own unique style and character. A funny cartoon chimp mascot brings humor to the site and evokes a positive mood.
• Surprise your visitors.
  Do you want to get some attention? People remember things better and pay more attention when their feelings are associated with it. Surprise your visitors by making something unexpected but positive.
  For example, show a “Thank you” message on a simple action, make interesting parallax scrolling effects, or employ animations when the cursor hovers over some elements.
  
  

  Dangelicoguitars.com uses parallax scrolling effects and custom designed pages to surprise their visitors and make exploring the website very interesting.
• Give your kids candy when they cry.
  How do people feel when they go to a website and it’s not working or they get a 404 page? They may feel confused, disappointed, or frustrated.
  You definitely don’t want people to feel that way. You can fix it by making a funny 404 page or setting up your own custom page when your website is inactive due to some maintenance work.
  Make people smile when there is a problem, and keep them busy when they have to wait.
  
  

  Your 404 page doesn’t have to be boring. Be creative, write something funny, or suggest another step that should be taken.
• Keep it positive.
  This is a general rule of thumb: evoke only positive feelings. You never want to associate any bad feelings with your brand (unless that’s really your goal and you know what you’re doing).
  Try to use positive icons like check marks, smiley faces, and thumbs-up signs. You may also want to associate positive feelings with desired actions on your website. For example:
  
  • Show a smiley face (reward) after completing a task
  • Use a green “add to cart” button
  • Show check marks for correctly filled out form fields
  • Use a progress bar in multi-page forms
  

  Photojojo’s shopping cart icon turns to green with a smiling face when you click the “add to cart” button. It makes the entire shopping experience more pleasant.

3. Design to tell a story

The age of making home pages look like airplane dashboards is over. We avoid overusing buttons, calls to action, and all the other distractions these days.
The new role of website design is to tell a story.
Imagine a comic book page. You can see various size strips and illustrations to make the story more interesting. It’s designed to get your attention, keep you interested, surprise you, scare you, make you laugh … and this is accomplished with only good narrative and images.
Your website can tell a story too:

• Design a layout that enhances exploring.
  Try to keep your page content in a proper narrative and progressive order. Use a simple vertical design for easy visual eye movement and flow.
  You may want to start with a good eye-catching headline and a simple description above the fold. Then, tell the visitor about your best features, show your clients’ stories, list people who are using your services or products, and finally lead to one — and only one — call to action (and optimize it).
  Divide your content into parts, but make sure there is a clear connection between them. This way your visitors can read it like a real story, with no pause or break.
  Also remember to have a good visual balance, both horizontally and vertically. Let your readers’ eyes smoothly move from left to right. If one section is left-hand heavy, make the the other one right-hand focused, and vice versa.
  
  

  We illustrated all Genesis framework features to make browsing this page more interesting and enhance exploring.
• Use various content elements to keep visitors interested.
  Make sure your story is interesting. You can use different interactive elements like tabs, sliders, and scrolling animations to keep your users engaged in exploring your website.
  Avoid using long and boring paragraphs of text. You can chop them into smaller portions supported with videos, graphics, and illustrations. Or you can introduce some organization and make a bulleted list, which is always easier for the eye to read.
  Don’t be afraid to change background colors between the page sections. This allows you to manipulate the balance and can encourage scrolling if the background colors are in a certain order.
• Encourage action. Every story has an ending. Put your main call to action at the end of your story, so people can take the next step.
  Make sure the vertical flow of the page leads visitors right to the final call to action. You may want to make it more prominent than any other elements, with a headline or button text that looks like a continuation of your story.

So, what is your next step?

There is always so much we can do to improve our website designs. I encourage you to take it one step further. Go deeper behind the scenes.
You can never be wrong by simply taking care of your visitors and improving their experience. Consider their feelings and add more sense to your website content by designing a good story.
What is one simple design change you could make today that would improve your users’ experience on your website?
Flickr Creative Commons cinemagraph by mendhak

About the Author: Rafal Tomal is the Lead Designer for Copyblogger Media. Get more from Rafal on Twitter and at RafalTomal.com.

 

by  Henneke 43 Comments

A 3-Step Formula for Captivating Your Audience With a Few Opening Lines

You’ve worked so hard.
You’ve written an incredibly helpful post.
You know your audience will be delighted, as your tips are easy to implement and you’ve proven they work.
You’ve tweaked and polished until you found the perfect headline. It grabs attention. It arouses curiosity. It’s powerful. You’re happy.
But then a nagging doubt creeps in …
What if your opening is so boring that nobody reads on? What if your opening sucks and everyone clicks away?
The thought can paralyze even the most experienced bloggers.

You can do it

As writers, you and I are battling for attention in a distracted world.
We need to work damn hard to captivate and then keep our readers’ attention. We need to mesmerize them so they ignore the emails popping up. We need to hypnotize them so they don’t hear their phones ringing.
Sometimes it may feel like an impossible task. How can we pull readers into our blog posts so they keep reading?
Well, it might be easier than you think.
In the past two years I’ve studied hundreds of blog post openings and I’ve found a simple 3-step formula that almost guarantees your opening paragraph will be hypnotic.
Sound good?

Lesson from a master seductionist

Let’s look at a quick example first.
It’s from a post by Jon Morrow:

Ever feel like all of the “good” topics in your niche have already been worn out by more popular blogs?
A post about getting more blog traffic or living more frugally may be interesting the first time you read about it. Maybe it’ll even catch your attention the fifth or tenth time you see it.
But what about the 50th time? Or the 100th? Doesn’t it get a little … tired?
Sure, you can go to the content crossroads for new angles and spins, and it works … for a while. If your niche is super crowded, eventually it feels like even the devil couldn’t find you a new angle. And you start to wonder: how are you supposed to stand out, writing about the same old stuff?
You’d think it would be impossible, but it’s not. You just have to be a little sneaky …

Can’t resist the urge to read the remainder of Jon’s post? Just click here. But please do come back to learn how to write an opening paragraph that’s as seductive as Jon’s.
Ready?

Step 1: Empathize with your reader’s struggle

Jon starts with a killer question that addresses you, the reader, directly: Don’t you feel like all the good topics have been taken?
He pulls you into his post because he seems to know exactly what you’re struggling with. And he empathizes with your feelings.
As a reader you find yourself nodding your head in agreement with Jon’s points. Yes, I do feel the good topics have been worn out. And yes, I do get a little tired reading so many posts about the same stuff. And yes, of course, I do wonder how I can stand out in a crowded niche.
When readers start nodding yes, they get into an almost hypnotic state. They can’t help themselves — they have to continue reading, because they feel the post is written especially for them, to solve their problems.
Have you noticed how often Jon uses the words you and your? This is how he makes you feel he’s speaking to you directly.
This type of blog post opening only works if you know exactly what your reader is struggling with. You need to understand the problems he’s facing and you need to offer specific help to solve them. Your opening paragraph will immediately fall flat when a reader thinks I don’t have this problem; this is not for me.
When you start writing your opening paragraph, picture yourself writing to one person only: an imaginary friend, your younger self, or your favorite reader. When you act as a personal coach for one reader, you find it much easier to picture and describe the scene in which your reader is struggling.
You also avoid using a condescending tone, because you’re talking to a friend, a real person. Your writing immediately becomes more conversational, more empathetic, and more seductive. Your writing draws your readers into your post because they feel you understand them and you’re going to help them.

Step 2: Promise your reader a benefit

Why would readers make an effort to read your blog post and follow your advice? Why would they care?
The answer to these big why questions is what Chip and Dan Heath call a destination postcard. A postcard shows your reader where he’s headed: a wonderful holiday with white beaches, sunny weather, and delicious cocktails; or a life where your reader is not struggling anymore with problems like living frugally, finding a good blog topic, or writing an opening paragraph.
In the example above, Jon hints at your destination: you can stand out even if you write about the same old stuff. Jon promises you that he’ll help you. You just need to read his post.
Your opening paragraph opens up a gap between where your reader is now (how to write about the same old stuff) and where he’d like to be (you can stand out even if you write about the same old stuff).
As a blogger, you address your reader’s struggles, empathize with him, and then promise him you’ll help.
Your reader doesn’t want to waste his time reading your post because so much other content is waiting to be read or watched. Your reader wants to be sure that he’ll get something out of your post.
So, you have to tell him his destination: either his problem will go away, or he’ll become smarter or happier once he’s read your post.

Step 3: Provide reassurance

You’ve now learned the two most important steps of writing an opening paragraph.
You know how to empathize with your reader and you know how to promise something good. Now, there’s one more potential issue you need to address.
Quite often as a blogger you touch on issues that seem far too big to solve in just one 1,500-word blog post. Can you really learn how to stand out when writing about the same boring old stuff by reading Jon’s post? Sounds almost too good to be true, doesn’t it?
This doubt may put readers off. But Jon takes it away. He reassures you that it’s not impossible, you just have to be a little sneaky …
We’re all a little lazy. We love solutions that are simple, straightforward, and seemingly effortless. So when your reader starts thinking this sounds too difficult or too much work, you have to reassure him that you’ll offer a simple trick, a secret tip, or an easy formula.
Of course, you can’t just promise it in the opening … you need to deliver it with the rest of your blog post.
Now, let’s have a look at how to apply this formula to your writing.

The 3-step formula in action (plus a bonus tip)

When you next write an opening paragraph, think about your ideal reader. Picture him struggling with the problem you’ll address in your blog post.
Your ideal reader should be so real that you can see him huffing and puffing, and pulling silly faces because he doesn’t know how to solve a problem.
Last year I wrote a guest post about email marketing -— it was the most shared Copyblogger post in 2013. To write the opening paragraph for this post, I imagined one Copyblogger reader sitting behind her desk getting frustrated with email stats:

1. I empathize with her frustration
2. I promise her a destination where she’d be happy with her email stats
3. I reassure her that writing engaging emails doesn’t need to be too hard

I applied the 3-step formula as follows:

We’ve all been there …
You’ve carefully crafted an email. You’ve polished each sentence. You’ve racked your brain for the very best subject line.
You hit publish with a sigh of relief. That’s done.
But when you look at your email stats, you notice that the opens aren’t as good as you’d hoped, and the click-throughs are disappointing. It’s depressing.
Does it feel like a big challenge to get people to open and read your emails? And then to go on to click through?
It doesn’t really need to be so hard. You’re about to learn the most important advice I’ve found for writing emails that get opened, read, and clicked.

This opening paragraph uses one extra trick: it starts with a super-short sentence.
Short sentences are easy to gobble up in one bite. They don’t require any effort from your readers. They only require a glance, then your reader can move on to the next sentence.
By making it so easy to read the first sentence, your opening becomes more seductive. Readers effortlessly glide to your second sentence and then on to the next sentence.
That’s how you seduce readers to keep reading. That’s how you get them to yearn for the tips and tricks you’re promising them.

The art of seducing your readers

You might think you’re a blogger.
You might see yourself as a writer.
But to pull your readers into your posts, you need to become a psychologist.
You need to sneak into the minds of your readers so you know exactly what they’re struggling with. You need to understand their feelings of frustration, worry, and despair.
Writing a good blog post means simply persuading a reader that this post is for him, that you’ll share your best advice to help him, guide him, and comfort him.
And once you’ve given him your best advice, you only need to kick his butt to get him to implement your tips.
So, come on. You can do it. Go write a seductive opening for your next post!

Editor’s Note:

This blog post is based on a chapter of Henneke’s upcoming book Blog to Win Business. Sign up to her list so you don’t miss the book launch.
Flickr Creative Commons Image by doug88888

About the Author: Henneke Duistermaat is an irreverent marketer and copywriter on a mission to weed out boring business blogs. Join her free Enchanting Marketing newsletter to learn how to write fascinating blog posts.

Why Leading Marketers outperform

Why Leading Marketers outperform
Evolving technology and social trends offer many avenues for improving customer engagements. Forward-thinking organizations can now interact with individuals, while using insights from hard data to improve how they invest in marketing resources. Read the free white paper for more information on how to launch a system of engagement that fuels growth and innovation.