The Importance of Good Mobile Websites – Digital Marketing Madness



John Maher McDougall InteractiveJohn Maher:  Hi. I’m John Maher, and this is Digital Marketing Madness. This podcast is brought to you by McDougall Interactive. We’re a digital marketing agency in Massachusetts.

Today, my guest is Rick Floyd, senior web marketing strategist. Our topic is the importance of good mobile websites. Welcome, Rick.



Rick Floyd McDougall InteractiveRick Floyd:  Hi, John. You’re quite mad, you know?


Why Are Good Mobile Websites Important?



John Maher McDougall InteractiveJohn:  [laughs] Thanks, I guess. Rick, why are good mobile websites important?



Rick Floyd McDougall InteractiveRick:  Number one, if you just look around you, you can probably see why. Look at the proliferation of these devices we have now, how often people are on them. Obviously, more and more people are using them.



John Maher McDougall InteractiveJohn:  We’re at the point now, I think Google just announced recently that we just hit the point where 50 percent of search is happening on mobile devices or something like that, right?



Rick Floyd McDougall InteractiveRick:  Overall, yeah. Of course, it varies by industry. In response to this, Google realizes how important it is to provide good search results. They want to provide search results if someone’s searching on mobile that are good websites that display well on mobile. They put into place a new search algorithm back around April 24th that some people are referring to as “Mobilegeddon.” It basically is rewarding your website in the search results, moving you up higher on a mobile search if your website is mobile ready…



John Maher McDougall InteractiveJohn:  Mobile friendly.



Rick Floyd McDougall InteractiveRick:  …mobile compliant, mobile friendly. There are a number of tools to test that. There are a number of ways to achieve that. That in itself, when Google says, “Hey, we’re going to rank you based on whether your site is mobile friendly,” of course, that’s the main reason that your mobile website is now important.

We mentioned that it’s 50/50. In some industries, I have some of my clients that are up as high as 60 percent of their visits are mobile.



John Maher McDougall InteractiveJohn:  It depends on what type of industry and what type of business it is?



Rick Floyd McDougall InteractiveRick:  Generally, across all my clients right now, I would say 30 to 60 percent. Even if you’re on the low end, close to a third of your visitors are on mobile. There’s just no denying that it’s important now.


Types of Mobile Websites



John Maher McDougall InteractiveJohn:  What are the types of mobile websites that you can build?



Rick Floyd McDougall InteractiveRick:  Basically, there are three main types. One is, not really deprecated, but it’s just not used as much anymore. That’s to have a separate mobile website. Usually, that’s with a mobile sub‑domain. Instead of website.com, your mobile domain is m.website.com. That’s a completely separate site from your website, meant and designed for mobile.

That was really popular probably about 5 to 10 years ago.



John Maher McDougall InteractiveJohn:  There was a way to code that so that if you were visiting that website and you typed in “www.website.com” from your desktop, you’d see the www site, and if you typed in “www.website.com” from a mobile device, it would forward you to that m-dot, that separate website for the mobile device. The website could tell what type of device you were searching from.



Rick Floyd McDougall InteractiveRick:  Correct. It’s sometimes referred to as “sniffing” what device you’re on and then serving you the content based on that. The downside of a separate mobile website is every time you update information on your regular website, you have to update it on your mobile website. Now, you’re having to update two websites, keep them in sync.

For big companies that had entire departments devoted to that, that wasn’t so big a deal. For the little guy, it was a little tougher. Basically, even big companies are getting away from that. What we have now is something called responsive design.


Responsive Design



John Maher McDougall InteractiveJohn:  What’s that?



Rick Floyd McDougall InteractiveRick:  WordPress is a content management system that’s probably the most popular one in the world. It is the most popular one in the world. A lot of the current WordPress designs are responsive. What that means is your website design responds to the device and the resolution that it’s appearing on.

Let’s say you have three images left to right, across a row of your home page. If I view that page on a mobile phone in portrait orientation, vertical orientation, a mobile website is not going to shrink the page or make you scroll back and forth. It’s going to take those three images, and respond to the device you’re using, and stack them.

Instead of one, two, three across, it’s going to say, “This is on a mobile device. I’m going to respond to that by, instead of displaying these three across, one on top of another.” Basically, it allows your content to stack in a long, vertical format when someone’s in portrait orientation on a mobile phone.



John Maher McDougall InteractiveJohn:  On a mobile device, it’s OK to keep having to scroll down to find the content, but you generally don’t want to have to scroll left and right on a mobile device to find the content across a page. Nobody likes to have to push the screen back and forth to read text that’s on a page, right?



Rick Floyd McDougall InteractiveRick:  Correct. Unfortunately, if you just have a regular, old, static website someone built for you in 2003, you can’t just make it responsive. You really need to redesign your site. Quite often, we find ourselves strongly encouraging people to get a responsive design because of the importance of mobile, particularly if it’s important in your industry.

The other way to do it is far easier and far cheaper. That’s to put what are called meta tags in the HTML code of your website that control what’s called the viewport.

That controls how much of your page is viewable at what zoom level when it’s first presented on a mobile device and whether the person can pinch and zoom out with their fingers to control the size of the page.

Generally, you set your page to a hundred percent so someone can see the whole page when they load it. Then, they can zoom in/out if they need to fill in a form or zoom back in if they need to navigate around the page. That’s called a meta viewport tag.


The Best Mobile Solution for Your Website



John Maher McDougall InteractiveJohn:  How can I determine the best mobile solution for my website?



Rick Floyd McDougall InteractiveRick:  It depends somewhat on what your current platform is. Like I said, if you’ve got an older, straight HTML coded website, the easiest solution is going to be to have somebody who knows what they’re doing put in those meta viewport tags.



John Maher McDougall InteractiveJohn:  Just allow people to pinch and zoom, things like that?



Rick Floyd McDougall InteractiveRick:  Any website these days, if you’re not doing that, you’re losing out. That is a pretty simple solution to at least make it friendlier. Google may not see that as a total mobile friendly website, but Google’s not the only thing you want to consider. You want to consider the user interface and the usability of your website with the people that are visiting it.

Certainly, getting a responsive design later on and optimizing it for mobile is helpful, but if you can’t do that or the expense is too big, you certainly can pop in some meta viewport tags.

It’s somewhat dependent on how much traffic you get. If your site’s really popular and you think you’re in an industry where you’re going to get a lot of mobile hits — for instance, a restaurant — people looking for reservations, menus. It’s probably pretty important, and you might want to consider it, if your budget allows it, to go with that responsive design.



John Maher McDougall InteractiveJohn:  Are there certain businesses where mobile maybe isn’t as critical as other businesses?



Rick Floyd McDougall InteractiveRick:  Yeah, and I’m not really the one to say what those are. There certainly are. Like I said, even on the low end of things, I’m seeing 30 percent of visits to my clients’ sites as mobile. The way things are going, I can’t see that people are going to use their phones less and less.



John Maher McDougall InteractiveJohn:  Right, it’s only increasing.



Rick Floyd McDougall InteractiveRick:  It’s pretty critical, and that’s why I think we’re here talking about this.


Mobile Websites – Budget Concerns



John Maher McDougall InteractiveJohn:  Is budget a consideration in that? As, of course, with any business, budget is always a concern, but is it expensive to build a mobile‑responsive site?



Rick Floyd McDougall InteractiveRick:  It can be. That’s a loaded question, of course, depending on how big your current site is. Are you a huge e‑commerce retailer, or are you just a little restaurant with a couple menu items? It really depends on the site.

In general, I would say you’re going to spend at least $10,000 for a small website to redesign with a good designer, with someone who knows what they’re doing, who’s not going to hurt your search marketing, either. $10,000 to $15,000 range — more if you’ve got a big site.


Mobile Layout and User Interface



John Maher McDougall InteractiveJohn:  What is different about websites when you use them on a mobile device in terms of the layout of the site and the user interface?



Rick Floyd McDougall InteractiveRick:  Anyone who’s tried to use them on a phone — although, our phones are getting bigger, in some cases the line between a phone and a tablet is being blurred; I have friends carrying around huge devices with them — anyone who’s used them knows, a bigger button helps. Trying to get your finger on a little button or links that are too close together so your finger’s bigger than the line.



John Maher McDougall InteractiveJohn:  Or you have to zoom in in order to be able to select one thing versus the other. That’s a pain.



Rick Floyd McDougall InteractiveRick:  Exactly. When Google rates your site on whether they’re going to rank you on a mobile search for a mobile site, those are the types of things they take into consideration.



John Maher McDougall InteractiveJohn:  How close the links are to each other?



Rick Floyd McDougall InteractiveRick:  Are touch elements too close? Are the buttons too small? You can have a responsive design site that’s made for mobile that the designer made the touch elements too close together, too small, et cetera, and still be downgraded by Google. There’s quite a lot to it. Of course, phone numbers need to be clickable, every phone number in your website.

There’s some simple HTML coding to make a phone number clickable on a mobile phone. That’s also a no‑brainer, too. If someone gets to see your number on a phone, you don’t want to have to make them find the keypad, if they even can, and have to punch it in. Just tap it.



John Maher McDougall InteractiveJohn:  They have to go back and forth between the browser and the phone, because you can’t remember seven numbers all at once. Memorize three numbers, switch apps, put in those three numbers, switch apps again. That’s a mess. That’s just asking people not to call you.



Rick Floyd McDougall InteractiveRick:  Let’s say you have a low budget, but you know your business is mobile. You can’t do a responsive site right now. The things you can do are get those meta viewport tags on every page on your site and make all the phone numbers, everywhere they appear on your site, clickable. You’re going to have a huge leg up on where you would have been, had you not done that.


Mobile Website Forms



John Maher McDougall InteractiveJohn:  What about things like forms?



Rick Floyd McDougall InteractiveRick:  Forms, you want to keep them shorter, obviously. The less you have to fill out in a form on a regular desktop site, that’s always been something you want to do, not overwhelm somebody with too much information in a form.

Certainly, on mobile — even more important. People are pressed for time, they have short attention spans, it’s a pain in the neck to type things into phones, in some cases.



John Maher McDougall InteractiveJohn:  If I have to fill out 10 fields, I might just say, “You know what? I’ll just forget about this, and I’ll do this at home when I get back to my desktop.” Maybe you don’t remember to do it, so you never get around to it. Keeping those forms short so people don’t have to type a lot, it would be better.



Rick Floyd McDougall InteractiveRick:  That’s a good overall strategy with your forms anyway. That’s always something you have to decide. How short can I make my form to increase the chance someone’s going to submit it, and do I still get all the information I need to close the deal?


Mobile Website Navigation



John Maher McDougall InteractiveJohn:  One of the things that I always find difficult on mobile devices is the navigation, when the navigation is overly complex. Maybe I can’t even find the navigation, or the dropdown menus sometimes don’t work right on websites.

You’ll touch it with your finger, it’ll drop down a menu, and then as soon as you take your finger off to go select one of the things on the dropdown, the dropdown disappears. It could just be a mess.



Rick Floyd McDougall InteractiveRick:  I was on a site like that, actually, over the weekend. The dropdown, when the new choices would slide out to the right, they would slide out off the page, and I couldn’t scroll the page horizontally to see them. Navigation — always important in websites. Certainly on mobile, more so. The simpler the better, in general.

I find websites where I have to drop down one list, keep my mouse on the list as I scroll down, wait for the next one to pop out, and then scroll down to be tedious anyway.



John Maher McDougall InteractiveJohn:  Tiered navigation.

Rick:  On a mobile phone, you want to stick sticks in your eyes, basically. [laughs]



John Maher McDougall InteractiveJohn:  That’s almost impossible to do, right.



Rick Floyd McDougall InteractiveRick:  It’s horrible.



John Maher McDougall InteractiveJohn:  Are more mobile websites using that little menu button that you sometimes see at the top? It’s sometimes graphically like a few lines, one on top of another. That means if you click that, it’ll show you the menu, it’ll expand a little menu at the top. Is that more common these days? Do people know what that means?



Rick Floyd McDougall InteractiveRick:  Yes. If your site’s responsive, not only does the page respond, the page elements respond to the device they’re being shown in, and move around, and restack, and resize, but the navigation should go from your regular navigation to maybe a totally different navigation where your regular navigation bar disappears.

This is pre‑coded into a lot of WordPress responsive designs. The mobile navigation button that you just referenced, with the bars on it, appears. Even if you do have a lot of drop down choices, you’re then using the correct coding to show your top‑level choices. Anything with a second level will have a little arrow next to it.

If you click that, you won’t get a JavaScript slide‑out menu like you would on a desktop site. You’ll actually get the next level down of the mobile menu.



John Maher McDougall InteractiveJohn:  It’ll expand another little sub‑menu.



Rick Floyd McDougall InteractiveRick:  There’s certainly correct ways to do this. I’m finding every day that not all developers who say they’re WordPress developers or website developers, if they have not studied mobile, they might not be able to help you. They may say that they can’t.

I’ve said this before in these podcasts, the best thing is to ask whoever you’re going to have do this work to give you some references and examples.



John Maher McDougall InteractiveJohn:  Great advice. Rick, thanks again for speaking with me today.



Rick Floyd McDougall InteractiveRick:  Thank you, John.



John Maher McDougall InteractiveJohn:  For more information about digital marketing, visit mcdougallinteractive.com, and make sure you subscribe to this podcast on iTunes. Thanks for listening. I’m John Maher, and see you next time on Digital Marketing Madness.


Leave a Reply

  • (will not be published)

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>