Creating A Mobile Friendly Website Plus SSL Security

Creating A Mobile Friendly Website Plus SSL Security

In episode 8 of Local SEO Tactics we’ll tackle two very important topics that will surely impact your SEO and website rankings.  We’re talking about creating a mobile friendly website – both what that means, and what some best practices are for being mobile friendly.  We’ll also talk about website security and SSL encryption for your website.  These two issues need to be addressed on your site ASAP, or you’ll risk losing position very soon, as warned by Google!

Don’t miss an episode – listen on iTunes, Google Podcasts, SpotifyStitcher, Android Apps, or RSS!

YOU’LL LEARN

  • What it means to have a “mobile friendly” website
  • The difference between mobile friendly, responsive, and mobile first website approaches
  • How to design a website with best practices for mobile usage in mind
  • Why it’s important to design your website for mobile usage
  • What is SSL security for your website
  • Why is SSL security important for your website
  • What will happen if you ignore Google’s SSL security warning

Thanks for Listening!

Here is a preview of the transcription from Episode 8 – Creating A Mobile Friendly Website Plus SSL Security;

Jesse: Google’s told everybody, “There’s some big changes coming that you need to be on top
of,” these two areas particularly, “otherwise you’re just really not gonna be found.”

Jesse: Hey everyone. Jesse Dolan and Bob Brandon here with Local SEO Tactics. Today we’re
gonna be talking about two more topics. One is, mobile friendly, mobile optimization for
your website to make sure you’re playing well on mobile devices. And your SSL or HTTPS
security. Both of these are big topics as it relates to SEO.

So we’re gonna dig into those and again, just like all the other episodes, take notes. This
isn’t gonna be fun, sexy stuff, right?

Bob: It’s important.

Jesse: It’s extremely important, if you’re gonna have a website, you gotta be doing these
things, otherwise it’s really like, “What’s the point in doing it?”

Bob: Right.

Jesse: Especially with these two topics today. So take notes, grab a pencil and some paper, or
bookmark some times on this. You’re gonna wanna take some actions and get this stuff
rocking on your own website.

So the first topic we’re gonna cover today is the mobile side of things. Everybody today,
we use our phones, or iPads and tablets too, but predominately smartphones, to do a
lot more searching than we used to even a couple years ago. That has an impact on SEO
now. You gotta design sites to be found, particularly on mobile devices.

Google’s kind of made it known to everybody that, “If your website is not mobile
friendly, or mobile responsive,” and we’ll break those terms down here in a minute,
they’re gonna penalize you.

Bob: Yeah.

Jesse: All things being equal. We use this example format here all the time, but if Bob and I
have identical websites, if his is optimized for a mobile device and mine is not, Google is
gonna give him preference over mine, and he’s gonna get the traction and the audience
that I’m not gonna get, and gonna get the customers.

Bob: Yeah, and we’re getting more comfortable using our mobile devices for buying anything
from airline tickets to athletic events, the whole nine yards. So that being said, the
searches obviously have to fall in line with that as well.

Jesse: Right, and part of that adoption is, websites do get better, right? Being more mobile
friendly, us as users, are more inclined to use our phones for those kinds of things,
where a year-or-two ago, websites really weren’t designed for mobile devices. You’d
design your website on your desktop or for your laptop, and on your phone you’d have
to pinch and zoom to really get into stuff, and that’s just not convenient. People didn’t
use it. But as websites started to become responsive, you just started adapting.
The responsive website is kind of the first version of the migration over to a mobile-first
platform. A responsive website, for what that term means is, a website that will change
based on the device you’re using. So if you’re on your laptop, or your desktop it’ll look
good, it’ll be big and wide and everything else.

Now, if you see that same website on an iPad, it might rearrange itself a little bit.

Bob: Right.

Jesse: Some of the elements might pull down, or come in a different order. The sizes and the
shapes really aren’t gonna maybe change too much, but the order where they’re at and
the page layout will. And then, if you view that same webpage on a mobile device, like a
smartphone or an iPhone, it’s gonna take that even more extreme. It’s gonna be much
more of a one-column design, so things that might have gone left or right are just gonna
be up and down now, and they’ll rearrange.

A responsive website is one that just kind of changes depending on whatever your
device is. It’s always gonna look good and rearrange itself, no pinching and zooming
needed to navigate the website.

A mobile friendly website, that means the same thing, basically. Not gonna be primarily
designed to be viewed on a mobile device necessarily, but you’re not gonna have any
problems if you’re on a mobile device navigating it. The most recent term that’s relevant in
web world is, “mobile-first design.” There’s a big distinction on that versus mobile
friendly, or responsive is, you design the website primarily as to be viewed on a mobile
device.

Obviously, it’s gonna be viewed on laptops and desktops as well, so you wanna make it
look good for that, but you have to pretend in your mind that the user is on a mobile
phone when they’re visiting your website.

Statistics show that, depending on the industry you’re searching for, or the product
you’re searching for, upwards of 70 or 80% of searches are done on mobile devices.
Now, to break down what I mean by that in the context. Let’s say somebody’s gonna be
ordering toner cartridges for their office. Well, most of the people doing that kind of
search are probably sitting at their cube, or on their desk. So those kinds of searches
aren’t gonna have that high degree of mobile searches, right?

Bob: Right.

Jesse: If you look at the stats on those kinds of search terms, probably primarily desktop or
laptop type users. Maybe the nearest restaurant, or chiropractor, or services like that,
out and about, shoe repair? Mobile.

Bob: Yeah, you’re broken down on the side of the road. You’re a truck driver, you’re broken
down on the side of the road, what are you gonna do? You’re not gonna necessarily pull
out your desktop or whatever.

Jesse: Right.

Bob: You’re gonna pull out your phone. We’ve had clients that repair phones for a living and
they’ve said their customers have come in with their broken cracked screen, with their
website up, right there. So they know it works.

Jesse: Absolutely.

Bob: So yeah, I mean certain services, again, if you’re gonna have architectural drawings
done, or you’re gonna have a house designed, you’re probably gonna sit down at your
desktop, look the site. We’re not sure that really needs to be 100% mobile-first. But
services that, really what this show is catering to, it has to be mobile-first in my opinion.

Jesse: Yeah. Some of the elements that make a website mobile-first, it doesn’t have to mean
its small, or things like that. Every mobile-first “website” is still gonna be responsive. If
you’re looking at it on any size screen, it’s gonna rearrange itself and just look great. Or
at least it should, if you’re doing it properly.

But some of the elements that really makes something mobile-first are buttons instead
of text links. If you want somebody to jump to the next page, “Click here for more
information,” for example. Or, “Click here to schedule an appointment.” You don’t
wanna have that link just be a little bitty text link, right?

Somebody with big old sausage fingers, you’re gonna be clicking the wrong links, or not
able to get there. So one of the elements for mobile-first is, if you’re gonna have a link
to something, have it be a big button. I say, “Big button,” on purpose. Same thing, you
don’t want a little tiny button, a little bullet point or something, for somebody to click
on, or a little image. It should be taking up a good chunk of the screen. A great design
for a button is actually a full width button. On your smartphone, it would go left to right,
the full width of the screen.

It makes it super easy for a user to click that, and they don’t even have to think about it.
It’s just kind of instinctively, you know what it is. So there’s that, “Don’t make me think,”
convention that we talked about before. And then there’s the actually physical act of
clicking on it, that is easier when it’s a large size button. That’s probably one of the most
critical parts as far as the mobile-first goes.

A second part would be clear and concise points. We talked in the previous episode of,
how to use your H1, H2, H3 tags for your headlines for your website. Same thing here on
mobile-first, make sure those are really called out and really identified. People are
scrolling through that page. So on a desktop or on a laptop, you’re presented with a lot
more of the text to view at any given time.

On our smartphones, we’re scrolling to the part that needs to be relevant. So part of
mobile-first on that is to make sure its organized, make sure you have plenty of
headlines. Again, don’t overuse your H1. You can always use your H2 and H3 type
headlines to identify areas of the page that are relevant.

But you’re gonna wanna call those out and make those easy to navigate. Don’t mash a
ton of pictures on there and things like that, and really clutter it up. Really, at the end of
the day, how do you know if you’re doing it right? Test it on your phone. Like we talked
before, a cool part about the webpage is you can update it, check it out, update it again.
Nothing’s set in stone once you hit save or once you hit publish. Definitely test it out on
your mobile device.

If you’re using Google Chrome, a favorite tool of mine is a plugin called WebRes. W-E-BR-E-S.

With that, you can actually set up, within the plugin, screen sizes to test. So, if I’m
doing a webpage on my laptop and I wanna see what it would look like on my phone, I
can just click that, switch over to the iPhone view and it’s gonna show me exactly what
it’ll look like. It’s gonna render it right there on the page, so I don’t have to wonder what
it would look like on my phone or even pull out my phone to pull up the page and test it
out.

Sometimes, if you’re developing a page, you haven’t published it. The real world can’t
see it yet, so how do you test it out for yourself to see if it’s gonna look good? You can
use a tool like that. Lots of other tools, that’s just a personal favorite of mine, and I’ll put
a link to that on the show notes too, for everybody else, to make it easy.

Bob: So basically, you wanna design, again, you wanna design for conversion.

Jesse: Absolutely.

Bob: So, it’s about designing in such a way on a mobile that if you came across your website,
would you use you? There’s nuances like, again being able to tap the phone number and
it dials the phone. So that’s huge. People, I think, way overlook that. There’s some poor
designs out there, but again, you want them to have the ability to take action. If it’s
confusing where the phone number is, they’re simply not gonna convert.

Jesse: Right.

Bob: But if you have that phone number front-and-center, bright color, can’t miss it, and
“Click here to call” even. A “Click here to call” button, or some other type of symbol that
gets them to take action, that’s huge. I can’t believe how many websites where people
just hide the phone number.

Jesse: Right. Yeah, like Bob said, it’s really about the conversions and when we say, “mobilefirst,”

the big part of that is that user experience, that user interface when we say that.
It doesn’t mean the architecture in the background or that some of the coding is better
for mobile, although there is some of that, that can be true. But the big thing Google
talks about when they say that, “Mobile-first importance,” is the user experience. And
obviously the Google algorithm and how they look at the pages now, they can take all
that into account.

Bob: Yeah.

Jesse: They can model it on different sizes and they see how that works. I wanna circle back
though. Bob made a great point, the “click to call.” Most browsers or operating systems,
like iPhone. If you’re doing a search for something on Safari, and you visit a website, if
they have a phone number on there, it’ll automatically be a hyperlink to call.

So if you see a phone number, you should be able to touch it and just call right on your
phone. That’s not always the case though. It doesn’t always work like that out of the
box. It depends on what kind of software you’re using, or how you’re designing your
website. Or, sometimes things are kind of quirky if you’re using the Google app on the
iPhone. Sometimes it doesn’t work for some reason. If you’re on Android, maybe there
can be some browser that you’re using.

That would absolutely be something to test, because as we talked, this show is about
SEO, with the end result being that you get customers. You don’t wanna just show up
high on Google and that’s not how you win. You win by getting those new customers. To
get those new customers, we have to rank high on Google. So there’s always a lot of
conversion elements that we talk about here and that “click to call,” or having your
website be a clickable link to generate that phone call is absolutely huge.

And the same vein for them contacting you. If you have a contact form to fill out on your
website, again, make sure the fields are big, make sure they’re big enough to click on so
somebody with big fat sausage fingers can actually fill out that form. If there’s a submit
button, or a “Send this” button, make those big too. You just don’t want it to be difficult
to do and have any barrier for the person not follow through and ultimately contact
you.

So just like the “click to call” for your phone number on your website, something that
can get overlooked real easy with people is your address. A lot of us, again, we’re
searching on our mobile phone, we’re probably wanting to navigate to the place as well.
So make sure, on your website, first of all, it’s always gotta be the header address,
physical address listed on there anyways.

Bob: Right.

Jesse: You know, unless you don’t want people coming. There are businesses where that won’t
apply, you don’t want people coming to you. But if you are a business where customers
do visit your location, and that’s important, make sure its on your website, and make
sure you test it out. That, on a mobile device, you can touch or click on your address,
and it’ll pull up the navigation native on your phone or mobile device. That should be
kind of built in, again, just like your phone number is. But in case it’s not, there may be
some manual action, manual coding that you have to do to pull that off, which is not
tough to do.

Bob: Right.

Jesse: You can Google how to do some of that, or as always, you can reach out to us if we got a
resource we can shoot your way, or if we can help you out, we’re here to do that. But
definitely make sure your phone number and your address, that you can click on those
and get what you need to pull up.

Another important part of the mobile-first concept is the speed. We talked on that last
week for image sizes and download speeds. Same thing is gonna apply here in the
mobile-first strategy. Images are gonna be your biggest hurdle. You know, for getting
over on that, the size of the image is a huge part of how long it takes for the webpage to
download. But again, test it out.

There’s some really great tools out there to test your website, and just see how fast it
loads. My favorite is put out by Google. It’s developers.google.com/speed. You just plug
in your website on there, Google will run a quick test on it, and it’ll give you a grade and
some notes about how fast it loads, how good the speed is on mobile and on desktop.
Important to note there, those are two different scores. How your webpage loads on a
mobile, versus a desktop. Google’s got some information there on how it makes that
decision, what it assumes for maybe if you’re on wifi, or if you’re on cell service. So,
check both of those out. But again, it’s developers.google.com/speed. We’ll put a link to
that on the show notes as well for everybody. It’s free, so just put your website in there
and test it out.

Like we always say with these tools, you can also do that on your competition. If you got
somebody you’re chasing in the search rankings and you wanna just see how good they
are, “Why are they outranking me?” Well, plug them into this and see. Maybe if the
score super high on the mobile and you’re not, that can point out a weakness that you
have in an area that you definitely wanna shore up. So check that out.

Another great test that Google puts out that’s free for everybody, is their mobile
friendly test. And for that one, this is kind of a long link, so again, we’ll put a link to this
in the show notes, you don’t have to worry about remembering this. I gotta read it here,
so pardon me, but it’s search.google.com/test/mobile-friendly.

Bob: Wow.

Jesse: Did you get that?

Bob: I’ll wait for the movie.

Jesse: Right. But that’s super good and that’ll tell you a lot of the things we’re talking earlier. Is
it set up in a mobile-first, in a mobile friendly environment? How are your buttons, how
are all the other elements? This isn’t primarily a speed test on this one, that’s the other
one, developers.google.com/speed.

But this one is kind of a more overall, how are you doing on a mobile device here? Super
useful. And again, check your website, check your competition as well, if you wanna gain
some insights there, but definitely recommend it if you haven’t tested your website out
through a tool like this. Check that one out. Again, both of these, they’re put out by
Google, right?

Bob: Right.

Jesse: So you can go to some third-party apps if you want and try some other websites out, but
this is Google, and they’re gonna be telling you what you need to do to your website to
rank high in their search engine, which is the number one search engine that we’re
trying to get in. So use some other ones if you want, but don’t skip these two they’re
extremely important.

So those are some really important things to take into consideration with your website.
How to optimize them for mobile. Again, at the end of the day, like we always say, put
yourself on the other end of the keyboard. Don’t just design your website for what you
want to push out there. Test it out, get in the mindset of the customer that’s gonna be
visiting your website on a mobile device, make sure they’re not getting frustrated, make
sure it’s easy to do. Have friends, family, strangers test it out. You don’t wanna be
burdened by the curse of knowledge, knowing how your website is to navigate and just
saying, “Oh, it looks great. Click here. I’m fine.”

Bob: Right.

Jesse: Hand it to somebody and say, “How would you order from here?” Or, “How would you
make a reservation?” Or whatever your product or service is, have them test it out.
Watch them. Don’t guide them. Don’t cheat, don’t tell them the answer. Just see where
they stumble and if they’re at all pausing or stumbling, make note of that, it’s something
you wanna correct.

Bob: Yeah, I think just asking questions. Don’t ask them open-ended questions about the
website and say, “Hey, how’s my website?” They’re gonna tell you, “It’s great.” Ask more
direct questions like, “I need you to find a phone number on our website. Go.” And time
them.

Just do that with a couple people, just to get an idea. If they’re responding within a few
seconds, I think you’ve done well. But if they’re searching and they can’t find it, for
whatever reason, and don’t take it personal, it’s just insight that you need to change the
number, or change the color on the number, or again redesign it accordingly.

Jesse: Absolutely.

Bob: But, doing stuff like that will ultimately benefit you in the long run.

Jesse: So that’s about it for the mobile friendly, mobile responsive part of what we’re talking
about today. We’re gonna move into the security aspect of your website. This is a new
thing right now, we’re recording this right at the end of February. It’s gonna come out
first part of March, and this spring/summer, Google’s making a huge change in the web
results for if you do, or if you don’t have a secure website.

They’re taking this very serious. They’re gonna penalize websites that are not secure.
They’re going to put big disclaimers that this website is not secure, which is effectively
gonna scare the crap out of people, if I’m clicking on your website and going any further.
So it’s a big deal.

What the SSL means and how we can visualize that for ourselves is two things. One, if
you pull up a website in your browser, you’re gonna get that little green bar at the top,
and usually there’s a little lock that’ll show as locked versus unlocked, when you’re on a
secure website.

Another thing that you can see is the actual address of the webpage. A standard format,
at least to date right now would be, “http://” and your website. “HTTP” is Hypertext
Transfer Protocol. With the “S” that adds that security to it. So, on a website that’s
gonna have the green bar at the top and the little lock for security, it’s gonna say,
“HTTPS://” and then your website.

If you see that on a website, you know that’s secure. Even if it doesn’t have the green
bar, or that lock, depending on your browser and things like that. If you’re going to the
website and it’s HTTPS, it’s gonna be secure. Good news for all of us is, it’s not that hard
to get your website converted over to be what’s called a, “SSL,” Secure Socket Layer
security.

Most website hosting providers out there like GoDaddy, Bluehost and any of the big
ones and the small ones, are probably gonna let you do this for free. If you’re using a
web host that utilizes cPanel, which is a particular administrative portal within the web
host, very, very common. Most likely, that’s what your web host is using. Most hosting
providers that use cPanel are also gonna use Let’s Encrypt. That’s super easy. For free,
you can generate your own security certificate, which is what you need to be installed
on your website to get this SSL security.

Let’s Encrypt makes it super easy, it’s free, it’s included with your host, usually. If it’s not,
you might pay 20-bucks, maybe ten bucks to have that done. Again, this is usually
something your hosting provider is gonna be able to provide to you. It’s kind of within
their realm and it’s what they do, and it’s not gonna be foreign to them. So you’re not
gonna have to worry about researching this yourself.

If you login to your hosting provider, GoDaddy, or whatnot and they don’t make it very
evident on how to do this, call them up, start a support ticket. Or again, you can reach
out to us for some kind of advice and help, and we can help guide you on that. But right
now, this is probably the biggest thing in the hosting and in the web world, is converting
your site to be secure.

They should have a big button somewhere, or a big headline somewhere, or some kind
of a banner that’s leading you to get yourself converted. If you have a website that’s
existing already, you’ve probably received emails, if not phone calls from them about
converting yourself over to. So this isn’t gonna be a foreign topic, they’ll know what
you’re talking about. It’s probably the thing that they talk about in their monthly
meetings internally, to get everybody converted over. So it’s very topical. You’re not
gonna have a hard time doing it.

Sometimes, all you have to do after you installed that security, is go back into your
website and on your page, if you have any links that reference with HTTP, you’re gonna
have to manually change those links to be HTTPS and then the rest of your link. That “S”
again, is what triggers it to be secure.

So hopefully that helps to demystify it a little bit. Again, feel free to reach out to us on
the show page, Intrycks.com/show. Drop us some feedback. We’re here to help.

Bob: Yeah, we’d love to hear from you.

Jesse: Absolutely. So reach out to us if you’re at all confused. But hopefully that breaks it
down, helps it make … makes it a little easier for you. So if you like what we’re doing,
we’d love for you to just take a minute Intrycks.com/iTunes it’s gonna bring you right to
our iTunes show page. Leave us a review and a rating, it’s really gonna help it out.
If you wanna watch us on video, go to our show page Intrycks.com/show click the
orange button to watch it in video. You can also grab a transcription of the show, if you
want to read it back, or share with one of your friends or family.

Alright everybody, thanks for tuning in. We’ll see you next week.

Bob: Have a good night.

Jesse: Hey everyone, Jesse Dolan here. Catching you on the back side. Wanted to share with
you another review this week. The last couple of weeks we’ve been fortunate enough to
have some reviews to share and we’re getting some more rolling in, so we’re gonna
keep sharing them as long as we keep getting them. I absolutely love this you guys.
We’re amazed that people are listening, that people are caring and writing us these
great reviews.

So I wanted to share this one for this week. It’s from Miss Latren. Hopefully said your
last name right? It says, “So much goodness. I’m always looking for ways to gain visibility
for my business, and this podcast is so helpful. I’ve only listened to two episodes so far
and I’m excited to implement what I’ve learned. Thank you.”

That’s perfect. That’s what we hope happens. You can take these episodes, nice little
bite sized chunks for you to take action on and make a difference with your business. So,
I absolutely love it you guys. Thank you so much. If you’d like to leave us a review, go to
Intrycks.com/iTunes. Again, don’t forget to check out all the show notes and all the
content from this episode: transcription, the video at Intrycks.com/episode eight.
And as always, I wanted to mention real quick, if you wanna do our free SEO report, just
go to Intrycks.com click on the Free SEO button, and you can run any of your webpages
through that. Takes about 15-seconds, the results are on-screen, right when you’re
done, and it’ll instantly email you a PDF with that, that you can check out later.
Scores your website front-to-back, lists all the important SEO areas and gives you a
grade on each one, tells you what you’re doing good, tells you what you need to
improve and it acts as a checklist for you to make improvements that you need.
So check that out, use it as many times as you want on your pages, or on any of your
competitor pages as well to see what they’re doing. And that’s about it. We’ll catch you
next week.

Check out the show notes below for resource links, guides, and a link to watch the episode in video format!

To share your thoughts:

  • Send us a comment or question in the section below.
  • Share this show on Facebook.

To help out the show:

  • Leave an honest review on iTunes. Your ratings and reviews really help and we read each one.
  • Subscribe on iTunes.
  • Subscribe on Google Play.
  • Subscribe on Stitcher.

LINKS

MP3 Audio DOWNLOAD THE MP3 AUDIO FILE

Listen to the episode however you like with the audio file.

Video WATCH VIDEO OF THE SHOW

RESOURCES

Note: some of the resources below may be affiliate links, meaning we get paid a commission (at no extra cost to you) if you use that link to make a purchase.


SHOW FEEDBACK

We're here to help! Share your thoughts on what you'd like us to focus on, or what challenges you are facing right now.