– Subscribe on iTunes
– Timeless UX Principles Part 1 of 3
– Free Text Readability Consensus Calculator
–The Flesch Grade Level Readability Formula
– Subject Line Tester
– Send us an email! firstname.lastname@example.org
Michael: Hello and welcome to eCommerce Q&A. This is the show where we address the needs and interests of eCommerce store owners and operators just like you. During the show, we’ll cover such topics as how can you maintain a healthy lifestyle while growing an internet business, how can you optimize your shipping, and everything in between. That’s right, folks, we’re going to address lifestyle, as well as the tactical nuts and bolts of growing an eCommerce business. Now, eCommerce Q&A.
Dillon Holst: Hello ladies and gentlemen, it is Dillon Holst once again with eCommerce Q&A, and I’m joined by Michael, as always. Michael, how are you?
Michael Bower: I’m good.
Dillon Holst: Great. Today, we’re going to be talking about UI/UX. We did one of these podcasts previously, so this is going to be part two in our UI/UX series. Today, we’re going to be talking about how to effectively communicate on your website. More specifically, we’re going to be talking about what should your copy look like. Not only what it should read like, but what it should actually look like on your site, as well.
Michael Bower: Just to clarify, we’re talking about the text on your website.
Dillon Holst: Yeah.
Michael Bower: We often talk about visuals and stuff like that. Today, we’re just talking about text, the copy, the written words.
Dillon Holst: So, Michael, tell me, what is the easiest website out there to understand?
Michael Bower: I don’t know. I was thinking Google, though. It’s so simple. It’s a little search box. You can just plug something in. Honestly, it’s not that easy to understand if you have never used a search engine. Have you ever seen someone that comes to Google for the first time?
Dillon Holst: I haven’t. That would be an interesting thing, though. I don’t even remember the first time that I went to Google.
Michael Bower: I remember when I … Well, I don’t know if it was the first time.
Dillon Holst: All right, tell us about it, then.
Michael Bower: I thought really dumb name. Really silly having a rainbow color scheme. Nobody should ever have a rainbow color scheme. For eCommerce, it’s actually kind of easy to figure out what’s going on, usually, if you’re doing your job right. It’s like you’re selling a product, right?
Dillon Holst: Sure.
Michael Bower: Problem is you’re not the only person selling a product of the type that you’re selling, probably, so you have to be a cut above in your communication style. People have to be able to figure out immediately not only what you’re selling but how it’s going to be better for them. We’re not just doing expository writing when we’re writing a website. We’re trying to persuade someone of something.
Dillon Holst: Right, and Google doesn’t have to do that, right? Google, just, it’s there. You use it. It’s a tool, right? When we’re writing for our eCommerce sites, we have to persuade people. We’re not just trying to inform them, although that’s part of it. Usually, the goal is to persuade them that your product is better than another product, or your product is the product that they need, or any number of different things that it could be considering your target market.
Michael Bower: Yeah. When I’m thinking about website text, first thing I think about is how good does this have to be? Do we need to go and hire a copywriter? That’s a real common question. Do we need to have an editor? Can we just kind of not? Some of our clients don’t even have descriptions on their products, and in those cases, it’s because that particular market doesn’t need the description. They already know exactly everything about the product, and they know exactly which one they want to buy. In that case, you just have to be able to identify the product. Most people don’t find themselves in that category. It’s more of a you need to say something about your product.
Dillon Holst: I think it’s easier to break this down into two different types of communication, really. There’s, on a more broad level, we can call them universal truths of communication. We can talk about those first, maybe. Then, maybe we could go a little bit deeper into communication for the web and eCommerce web specifically. Let’s, first, though, talk about these universal truths. We were just talking about, before we started recording we were talking about, something called the Flesch readability index and basically how we can optimize that to whatever our target market is. You want to talk about that a little bit?
Michael Bower: Yeah, exactly. This is something you may have heard about when you were writing papers in school or something like that. The Flesch-Kincaid readability tests are … There’s actually two tests, the Flesch reading ease and the Flesch-Kincaid grade level. The basic idea is that if you have a really high score on the reading ease test, you should have a lower score on the grade level test. Which makes sense, right? If you use smaller words and it’s easier to read, then that means that it would correlate to a lower grade level score. It’s a little bit disappointing, but the average, according to this website I found, the average user on a website is probably able to read on a seventh to ninth grade level, so 12, 13 years old-ish. The Huffington Post, for example, they have an average grade level readability of about grade seven. If you think about the New York Times, it’s above that.
Dillon Holst: Part of me wonders when you’re reading for school or you’re reading for, I don’t know, your job or your work or whatever, it’s a little bit different. You’re going to have an easier time concentrating, because your mind is just in that place, but when you’re on the web, I wonder if people just automatically … They don’t want to try as hard. They don’t want to think as hard. They just want things to be easier to read, so that’s why when people do tests to find out what grade level should writing be for people on the web, is it just really that’s the reading comprehension level? I kind of don’t think that it is. I think it’s more just we’re lazy when we go on the Internet. We’re just browsing the web. We’re not wanting to be in that head space where we have to concentrate. I wonder how much of that it is.
Michael Bower: I know we don’t want to jump ahead to the web specific stuff yet, but I’m going to anyways.
Dillon Holst: Right, right, yeah.
Michael Bower: It’s like when you’re on the web, it’s a little bit harder to read stuff, typically, because you have so many things on your screen. Displays actually make it a little bit harder to read. In general, your website should be easier to read than, say, a piece of paper that you have somebody’s full attention when they’re reading.
Dillon Holst: Not that I’m trying to make excuses for people and their reading comprehension level, but sometimes you just don’t want to have to focus as hard. That’s why us as store owners or people in eCommerce, it’s good to realize that we should make an effort to make our communication easier to read and understand. That’s why the Flesch readability index is a good way for us to figure out are we making things too difficult for people? Is it too easy for people? Are we projecting the confidence and the idea that we know what we’re talking about? It’s a fine line to walk, I suppose, there, as well.
Michael Bower: It’s cool, because there’s ways you can test your website for your readability, if you just type into your Google search engine “Flesch-Kincaid “, you can find a few different ones. We’ll include a link to one, the where you can just plug in your URL, and it will tell you what your readability scale is. Another thing that concerns universal legibility, if you will, is typography. There’s well-established rules of how to put text together. A lot of this you learned in English class, which you may not remember but you do intuitively like you should use words to emphasize in sentence structure rather than putting things in italics or bold all the time. Exception, perhaps, with calls to action. You can use formatting to call those out. Fonts should work well together. They should feel like they go together. If you don’t have a sense for that, then grab someone who does, and they’ll tell you, “That looks horrible with that font.”
Dillon Holst: How often is it when you’re reading a book that you’ll see a book with a font that looks significantly different from another book? They’re all pretty much the same, right? That’s how it is on the web, as well. You don’t want to differ too much from what people are familiar with, because it can cause confusion. Vice versa, with things that are italicized too much or you’re using too much bold or something like that. It’s good to save those things for when they really matter, aka the calls to action on your site as opposed to just the copy or your product descriptions or whatever it might be.
Michael Bower: I think there’s two types of confusions users experience when they’re reading the copy on your website. The first would be they don’t understand what you’re saying, whether maybe you’re just not writing at a level that would be easy for them to understand, or perhaps they aren’t familiar with the background information that would be requisite for them to really understand. The second is it’s just hard to read physically. Paragraphs are too long. Let’s dive into the website. Aside from the universal truths about written communication that are well-established and have been known for over 100 years, there’s a lot of things about writing for the web specifically that I still find a lot of people slip up over constantly. The truth of the matter is when you’re writing for the web, and this applies for email as well, you don’t write in the same way as a college paper.
Dillon Holst: Because it’s just not as easy to understand at first glance, and you want people to be able to look at it and understand what you mean with minimal effort.
Michael Bower: I think that was really key, what you said, at first glance. The truth here is that people don’t typically read web text; they scan it. A lot of times people have heard of the F-shaped reading pattern. This was back when desktop devices were the predominant form factor, but read across the headline, then you read down the left, then you read somewhere in the middle, and that was kind of a pretty commonly observed pattern using heat mapping. Nowadays, with mobile devices, actually I’m seeing different patterns, but you can’t just assume that you have a captive audience with the web, right?
Dillon Holst: Right, yeah.
Michael Bower: A couple of things that you do-
Dillon Holst: I think for me, when I scan … I totally agree with you. What a great point that is. You shouldn’t assume that people are just going to read from start to finish whenever you’re writing on the site, and you have to think about it in that context, as well. When people are scanning, try looking for something that’s going to capture their interest from a glance. At that point, you may capture them into reading the rest of what you’ve written for your page, but that means that you don’t know at what point their eyes are going to land on something that they find interesting or captivating, right? So the whole thing has to be written in that context.
Michael Bower: I would actually say the inverse is true, as well. I think it’s very common for me, when I’m considering buying something on a website that’s not something that I’ve already shopped at, I’m looking for anything that would falsify, anything that looks like it was poorly written, bad grammar, just like a missing period. The classic one for me is the word “its.” If I find an “its” that has an apostrophe when it shouldn’t or it doesn’t have it when it should, all these things indicate to me either someone didn’t take appropriate care in preparing what they were saying or they’re just going on and on and on for no reason. Maybe they used a third party to write their copy and they didn’t edit it. Basically, you’re asking for trouble when you have copy that’s not very carefully edited. This is really a common problem, because with larger and larger product catalogs, it’s very easy to just lift existing content, perhaps, from the manufacturer and then just tweak it a bit. Those are the things where the discriminating user, which is who you want as a customer, because they’ll be your most valuable ally when you manage to win them over, they’re looking for things that don’t seem quite right.
Dillon Holst: Within that context, Michael, how should copy be laid out on a site? We know that people scan. They’re not going to read the entire thing, most likely. Does that change how we actually lay out the copy on the site?
Michael Bower: Yeah, and I think it depends on the product. Or maybe based not so much on the product but the level of commitment to buying this particular product that your customer is already at. If someone is coming to your site and they just want to buy your product already, all you need is a buy button. If they’re on the far end of that spectrum, and we’ll go into this in another podcast, basically it’s the level of awareness at that point. If somebody doesn’t even know that they need what you have to buy and they just chance upon your website, or maybe they have some kind of vague awareness that, huh, I’ve heard of this thing called aromatherapy, or I’ve heard that riding a bike is good and I kind of want to buy a bike, or something like that and considering it. At that point, you need to educate them before you can expect to convince them to buy what your particular offer is.
Let’s take a middle-of-the-road approach, because most people’s sites are at that point where their product is being considered against some level of another supplier or manufacturer or brand’s product. In terms of the middle of the road, I know I said we weren’t going to talk about this, but you need to have an image that represents the product, and then you need the text that supports that image. The text, usually, you should have your short description. Best practice would be short description on the right. I sometimes will not put the short description on the right and, instead, have it be a summary statement that goes almost the full width of the page underneath the picture and the add to cart section on the right. I’m speaking of desktop. Then, below that, what I like to do is break up the copy into sections. Typically, it’s great to have reviews higher up the page, so you have your reviews there as common ways to do that. People are familiar with how to do reviews. Larger italics on your reviews, left to right with the smiley face, so you can see the person who left the review.
In terms of the description, which is really the body of text where you want to make sure you don’t lose the customer in, this is going to be your more valuable user, the user that’s really interested in actually buying this product or might be interested. I think that you want to adhere to certain things. Like, for example, use short paragraphs. This is a very important thing that a lot of people don’t do, is they go on and on within a paragraph. When you’re writing a paper, you want to have three, four, five sentences in a paragraph. When you’re writing text for web, you want to have one, maybe two, sentences in a paragraph.
Similarly, you don’t want to have huge columns. We don’t need to fill it, we talked about this in the last show, with white space. If you have a lot of text to present to someone to read, your column should actually be fairly narrow. If you look at sites like medium.com, which have long-form articles, you’ll see that the columns of readable text are actually fairly small compared to the available width of the page. Let’s say you have a page that isn’t full width. Let’s take your tablet breakpoint. Your tablet breakpoint, your text should probably be not more than half the width of the page, and that will bring that feeling of ease in reading and not a lot of pressure and heaviness that you don’t want. So, narrower columns.
Another big thing, this is huge, you want to summarize and reiterate, but in a different way. You’re above the fold. Well, there’s multiple folds on a page, right? Nowadays, we have long-form pages where we scroll down and down and down and down, and that’s fine. There’s nothing wrong with that. In fact, I recommend that. Every fold should have the same call to action or summary statement or main point that you have to make or something that is close to that on every fold so that someone can be continually reminded, as they’re scrolling down, they see the same thing presented different ways. Again, try going to scan. They’re going to jump around. They’re going to go the bottom. They’re going to go to the middle. Then they’re going to see another product, and they’re going to come back to the description. Very disorganized is the best I could say about most users that are reading the website.
Then, there’s one other thing that I think is really crucial, which is that we can learn a lot from the info product people, from the content marketing people. One of the main things that you learn in content marketing is to spend 80% of your time crafting headlines. You’ve probably gone through these courses where it’s talking about email marketing, and they’re saying spend 80% of your time working on your headline. There’s tools that will help you. You can just Google this, email subject help or something like that. It’ll tell you how good this headline is, how likely it is to go to spam. Well, on your website, it’s not going to go to spam, but it kind of is, right? People see a dumb headline or a headline that doesn’t mean anything to them. Think about all those magazine ads that you flip past where you see them and you just kind of go, “Groan. I’m never going to buy that product.” What if the magazine ad just had product name, size? That would be even worse. For some reason, we think that on the web, oh, we can just have a product page that says what it is without saying why you should even buy it.
Look at the classic example, top selling product of 2016, the Amazon Echo. Just go to Amazon. I don’t actually recommend following Amazon’s usability principles, in general, because they kind of just do their own thing and not necessarily the best example. Their flagship product pages aren’t so bad in terms of things like readability. They’re obviously making an argument for why you should buy the Amazon Echo. Waiting for this page to load.
Dillon Holst: It is a no-brainer, though, if you think about it. They say spend 80% of your time crafting headlines and call to actions. What are the first things that somebody’s going to see when they go to a page, right? Well, they might look at the product photography if you have that or whatever image you’re using, but they’re going to be looking at the things that are popping on the page, the things that are eye-catching, and those are going to be, hopefully, your call to actions and your titles, your headlines, whatever that’s going to be.
Michael Bower: With the Amazon Echo, you can see the product headline. Amazon Echo Black. Super boring, right? Everywhere else on the page is telling me a bunch of powerful reasons why I should buy this Amazon Echo. Even on the product photo. The product photo says, “Always ready, connected and fast. Just ask.”
Dillon Holst: It makes sense that you would spend 80% of your time on the things that are actually going to get people to end up buying the product, right? You want to spend the time where it counts. People scan. They’re not going to be reading every little thing that you’re writing on the page. Focus on the things that are going to count and the things that are going to matter.
Michael Bower: Yeah. On your home page, you have to convey something that will draw people into your product, which means that you have to know a bit more about your user than on the product page, potentially. Meaning on the home page, you need to make a statement that will draw a particular type of user into your general whatever it is that is the reason for your existence as a company, as a store. What is it that makes you special? Why are you here? Why should they consider buying from you? Not just free shipping or great products at a great price. Those statements are going to be the hardest to craft. On the product page, it’s actually a little bit easier, because any product that you’re selling on your site, I’m sure you have a reason for selling it. Well, say what that reason is. Low-hanging fruit here. Pick one or two or three. We talked about this a lot. Pick your flagship product line, flagship products, and spend an hour crafting some powerful copy for your page. It can just be some headlines and calls to action, and you can have a copywriter or an editor take it from there.
Dillon Holst: We’ve kind of talked about two different areas of communication. Let me ask you this, Michael. Looking down into the future here, how do you think these principles are going to change? We’re at the beginning of 2017, but 2017, 2018, and maybe 2019. How do you think these things are going to change?
Michael Bower: Well, I think people are mainly looking for conversations now, and they’re wanting to be able to engage with and interact with content. I just saw this thing that someone that I follow, Andrew Warner over at Mixergy, he found it. He was getting an 80% response rate with Facebook Messenger. He stopped sending emails, just as a little test, to try Facebook Messenger, and he got 80% response rate.
Dillon Holst: That’s crazy.
Michael Bower: Why would that be? It’s because people, they love the idea of a conversation, of being able to be taken very easily to right where they want to go, and that’s the whole idea of a concierge, like, “Hey, what time is it?” Asking your phone. Or like, “How long will it take to get home?” I ask my phone that all the time. Couldn’t I just look it up on a map or remember it in my head? Of course I could. I could be like I think that … No, no, no. It’s way too hard, right?
Dillon Holst: Yeah. It’s not the same thing.
Michael Bower: Especially on a mobile device, it should just be simple. Basically, it makes it way harder, right? It’s harder to write a three-minute speech than it is a three-hour speech.
Dillon Holst: Very true. Good thoughts.
Michael Bower: Along with our previous show, I would say it’s, again, a big emphasis on making things simpler and better.
Dillon Holst: Conversational eCommerce. That’s a topic unto itself. I think we should do a podcast on that coming up here in the near future, because I agree with you. There’s a lot of companies out there that are experimenting with different ways of selling people via live chat or even people that are using artificial intelligence to start conversations and sell products. Yeah, that’d be a fun thing to talk about. All right, guys, so that is the end of our podcast here today. I’m not sure how you guys are tuning in. We’d love to hear how you guys are finding the show. You can send us any comments or questions to email@example.com or you can give us a call at (866) 8-SELLRY. That number is (866) 873-5579. If you’re not already, we’d like for you to subscribe to us on iTunes or Stitcher. If you enjoyed the podcast, we’d love it if you’d leave us a review on iTunes. Thanks for listening, and have a good week.
Michael Bower: Thanks, everybody. Keep selling.