By the e-book: $7
Buy Online: $19.95
If you know your audience, you can wear the right clothes to the party. Ever go to a beach party wearing a three-piece suit? Or end up at a black-tie dinner in jeans? Makes you uncomfortable just thinking about it, doesn’t it?
In any conversation, first impressions matter — at a party and in internet marketing. In a social environment, folks are more likely to talk to you if you it their expectations of a good conversationalist. When people arrive at your site they’re going to make a near-instant decision as to whether you have what they need. Most site visitors will process elements of the site’s design in this order:
Conversation Marketing can only start once a visitor has unconsciously moved through this checklist.
How do you make sure your web site is dressed appropriately? For starters, let’s break down the phrase Dress Appropriately:
I’ll warn you now that this chapter is as much about what not to do as it is about what you should do. For me, at least, design is as much an exercise in avoiding pitfalls as it is a creative act.
This chapter is not a course in web site design. Nor is it an attempt to set broad boundaries for what’s “good” or “bad” web design. It’s designed to make you an educated judge of “good” versus “bad” design in the context of an individual internet marketing campaign: “good” being a design that quickly connects with your intended audience and ushers them into a deeper conversation; “bad” being a design that either fails to make that connection or actually breaks it. I can’t give you a great checklist. But if there’s one thing you should do, it’s this: Always practice audience-focused design. Real-life conversations are painful when one person ignores the other’s likes and dislikes, and Conversation Marketing is no different.
Designs created to please the business owner are what I call ego driven, rather than audience focused. Don’t get me started….
You put a lot of time into knowing the room, right? Pondered your audiences, considered calls to action, mapped out workflows, and generally tied yourself up in knots trying to anticipate the who, how, and why of your internet marketing campaign.
Now you put that all to work, by creating a “look” that will appeal to the personas created in rule 1, and make it easy for them to use your site. By doing that, you’ll make sure that the conversation gets started.
Remember, a conversation isn’t just about what you like. It’s about the other person, too. Conversation Marketing works the same way. Your web site’s look and feel isn’t about what you like. You already like your business, most likely. You’re probably already excited about the product or service or message you’re delivering. You don’t have to persuade yourself.
The first goal of your web site is to get a first-time visitor to stay just long enough to start reading or viewing your message — to start the conversation. No more, no less. That means that the first thing they see has to evoke the right response.
Now, I said I can’t give you a “good design” checklist. But there are a few basic aspects of a web site’s look that I’ve found can be conversation starters, and stoppers.
Nothing starts, or stops, a conversation faster than a bright green shirt, right? Same goes for your web site. People react certain ways to certain colors. Here are some examples:
These are all value judgments — different cultures may interpret colors in very different ways. But in my middle-class North American experience, these responses hold true on sites that present everything from politics to dresses.
When someone arrives at your web site, color will typically be the first thing that evokes a response. Whether they see a splash of red in a photograph, or the background color used in the overall layout, that first bit of color will drive their experience. So you need to select colors carefully.
One other note about color: Think about usability. A measurable percentage of the male population has a form of shade blindness that makes it very difficult for them to see, for example, blue text on a red background — don’t laugh, I’ve seen a lot of sites with this color scheme.
If you want to play it safe with color, make sure your web site follows these basic guidelines:
Do you like beveled buttons? Drop shadows? Metallic, shiny shapes on your computer screen? C’mon, don’t be embarrassed.
Texturing and effects have their place even if many designers and marketers turn their noses up at the idea of a drop shadow. Used correctly they can help emphasize a point, isolate a message, or make a web site more usable.
But you have to have a reason for applying effects. And “Because I like them” doesn’t count. If you sell a high-tech product, then a shiny, three-dimensional web site may make sense. If you sell socks, though, you’d best reconsider.
Here are some examples of effects, and the responses they evoke:
Used in combination with different colors, effects can elicit very subtle or very strong responses. If your web site incorporates any kind of effect, have a good reason. Again, “This is cool” is not enough. Effects should help the visitor get your point. They shouldn’t be the point.
Let me put it another way: Nothing should be on your web page without a good reason. If a button or effect isn’t helping to keep the conversation going, get rid of it. Ever know anyone who used one particular word they liked over and over again, whether it was relevant or not? Did it make you want to scream? Well, having every inch of a web page covered with beveling can be just as unpleasant.
One more thing: Expertise is everything, here. Only someone who truly understands design principles can apply effects to a web site’s look without risking grating, painful results.
Type and typesetting are a critical part of dressing appropriately. Your visitor has now arrived at your site — in the first fractions of a second he’s processed the colors and textures you used. Now he’s going to see if there’s anything to read. He’s not going to read it, yet, but his eyes are already tracking the page, looking for cues and calls to action. Choosing fonts is like deciding whether to speak loudly or softly, quickly or slowly, or to use big words or small ones. This choice is fundamental to Conversation Marketing. Fonts aren’t just for reading. They’re shapes and lines that can generate as strong a response as splotches of color. And how they’re applied to a page can have equally strong implications for your site.
First, there’s the difference between serif and sans serif fonts. Times Roman is a serif font — basically, serifs are the little feet you see at the bottom and top of each letter. They create an ornate, artistic look. Serif fonts are the norm in print — if you buy a paperback book, chances are it uses one serif family or another. So do most newspapers.
Serif fonts are harder to read on a computer screen, but they definitely have a place, and some serif families out there are more subtle and easier to read in a digital environment. Use serif typefaces if you’re trying to create a literary, artistic, or classic feel. Try to avoid them if you’re aiming for a techy feel. Arial is sans serif font. It’s all clean lines, and doesn’t have any of the extra adornments. Sans serif fonts create a crisp, direct look. They’re easier to read on a computer screen, and provide a more technical, unpretentious feel. While the average reader doesn’t run into sans serif fonts on the printed page, he or she is generally more comfortable with them online. Use sans serif fonts to appeal to the broadest possible audience. If your Conversation Marketing campaign is dealing with a wide audience who needs to get in, get their question answered, and get out, use sans serif fonts.
How you treat type on the page matters, too. I can’t begin to offer a complete primer on typesetting — see your local bookstore for some great books on the subject — but here are a few pointers.
By default, web browsers display lines of text with very tight spacing (also called leading). That’s harder to read.
Here’s some text with tight leading. It’s like talking really fast:
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi commodo, ipsum sed pharetra gravida, orci magna rhoncus neque, id pulvinar odio lorem non turpis. Nullam sit amet enim.
Here’s some text with looser leading. Notice the difference. It feels like the page is talking more slowly.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi commodo, ipsum sed pharetra gravida, orci magna rhoncus neque, id pulvinar odio lorem non turpis. Nullam sit amet enim.
Applying additional space between letters in a phrase will create emphasis for navigation cues, headings, and such. Don’t do this too much though or it looks like you’re yelling:
this text has looser letter spacing
Go very, very sparingly with boldface, italics, and underscoring.
Typography is an art form. I know just enough to keep you from putting your virtual foot in your mouth. If you want to read some great articles on the subject, visit A List Apart: http://www.alistapart.com/.
Here’s a quick reference for typographical principles and faux pas:
In any conversation, the way you present your words is important. In Conversation Marketing it’s crucial, because it sets the tone for the entire conversational chain of events. Use the wrong font or overuse a text effect and it’s like showing up at a beach party in a tuxedo. You will not be dressed appropriately.
The number of columns, shapes, text blocks, images, and other widgets you include on a page all pertain to complexity. So does any use of motion graphics, such as Flash.
Not much to say here — the more complex your page is, the more you can communicate. A simpler layout will do more to emphasize a single message or theme. A more complex layout, on the other hand, lets you say a lot more in the same space.
If your audience is looking for convenience — if they’re looking to you to make something easier for them — you need to keep things simple. The same holds true if your audience is less experienced with the internet.
If, on the other hand, your audience is looking for lots of information, is made up of experienced internet users, or is generally techier, you can create a more complex layout and let them explore.
The Occidental eye takes in a page of information in a Z shape or some derivative.
Items at the corners of the page are emphasized. Items at the top left and bottom right will be the first and last things visitors see when they first scan the page. The top left corner is by far the most viewed, most studied part of any page.
Does that mean the most important stuff needs to be at the top left and bottom right? No. It does mean, though, that you need to consider what you put there. If you put a bright graphic, boldface type, or something that’s otherwise an attention-grabber in either of those locations, it’s going to dominate the page. In conversational terms, think of it as standing on a podium with a microphone.
Dozens of books have been written about graphic design. And a few designers have made their way in the world based purely on their ability to create a striking online aesthetic. But in my experience, the visual design of your site matters for about 15 to 20 seconds. In that time, a visitor decides whether they’re going to stay or leave.
In the marketing context, web design is about that first 20 seconds. A great-looking design is like dressing appropriately — it gets folks to accept you long enough to hear what you have to say.
So the Golden Rule of web design is: Design for your audience. In Conversation Marketing, that will let you talk to your audience, instead of at them.
Morgan is a pretty creative sort. She decides to design the Morgan’s Custom Bikes home page on her own. Her first design features a huge, high-resolution image of a local team racing around a curve, all on shiny new Road Specials. It’s a beautiful, striking image, and she follows it up with internal site pages that are dominated by additional original photos.
Morgan passes the pages off to a web developer, who converts them to HTML web pages. Then she tries viewing them.
While the pages look great, they download very, very slowly. Even worse, on an average computer, the navigation buttons and calls to action are lost off screen.
What happened? Morgan forgot about rule 1 — she ignored what she already knew about her audiences, and designed at them. Luckily, she hasn’t gotten too far into the process, and she can make changes without much trouble. So she revisits her personas. Here’s a refresher:
Consumers want to learn more about the bike, get specifications, contact Morgan and maybe find out how to order. They’ll likely learn about the bike either through word of mouth or on the internet.
Shop owners also want to learn about the bike and get specifications, and then they want to learn more about selling the Road Special.
While both audiences may want to see pictures, they’ll consider text specifications and store locations as very important. Her slow-loading home page is a major obstacle, as is the fact that, on a computer with an average video card and monitor, the navigation is actually off the screen. Morgan tries to create a better design, but she’s too close to her own product. She’s stumped. So she decides to bring in some outside help; she hires a web designer. They sit down and talk over the personas and goals she mapped out. The designer gets to work, and produces a new look. This site still features the Road Special, and the photo is more than adequate to bring out the details of the bike.
But now the navigation is where folks will expect it. There’s some relevant text on the home page, as well. That text is important once folks decide to learn more, and it provides an entry point for search engines, too. (More about that in the chapter on bragging modestly.) Most importantly, the page loads far, far faster — if you only have 15 to 20 seconds to grab someone’s attention, the last thing you want is a home page that takes 30 seconds to load. The new design is clearly for Morgan’s two distinct audiences. She’s talking to them, not at them, and she’s dressed appropriately.
How your web site looks is important. In those crucial first seconds after visitors arrive at your home page, they’ll want to see something that appeals to them.
Once you’ve generated that appeal and dressed appropriately, though, you have to sound smart. So on to the next step.
