Lessons

Lesson Info

Building a Mobile Friendly Site 1

So the key thing here when it comes to having a mobile friendly website is understand that mobile users have different tools to navigate your site, you know, on the laptop or a desktop, you have a mouse, you know? And you have like, that really intricate pointer, but now we have different tools, bigger tools. In some cases, this is a photo of my hand, um, and I did some research and the average finger size in the united states the tip sixteen to twenty two millimeters for the thumb and twenty five millimeters it's, probably backwards, actually, but you get the point backwards anyway, so you get the point, so we're using different tools, right? So we're using our are pointing fingers and our thumbs were swiping through content. We're trying to click buns. How many of you guys I have visited a website where you've had to like pinch and then like, zoom around and then, like you're using like your finger now to try to click the lanky like this's so painful, right? It happens, and google ac...

tually has shared that if people come to a website and have a poor experience, forty six percent chance they will never return to your side again from the phone so again, like we talked about now more than ever with all of this this mobile usage your first impression is happening from the mobile device the first chance you have to get them to listen to that call to action subscribed your email is subscribed your webinars all that stuff is having on mobile device, so I really need to focus on what we can do to make this a tapa ble friendly experience, right? So there's really kind of three ways to build a mobile friendly site now I've stopped most of you and your web sites ah little intel and I'm happy to say that most of you, I'm not going to pick on anyone today has been most of you are already using the first one of the first options, which is using a website themes to, say wordpress that uses responsive design. So anyone not familiar with it's on design and if any hands go up, you're actually using it because most of you are on the the audience on the internet response to design is a is a practice that allows your website to adapt to the screen sizes trying to access it. So I'll show you an example here in just a few minutes, but right now is kind of the best way to make your website your content future friendly, right? We see more and more devices every single day hit the market that are different screen sizes, we just had the the iwatch apple watch the iphone six plus just came out, which is basically is bigas this laptop? So, like you need to figure out, are not figure how you just need to understand that, like, as more more devices at the market, it could be anybody that's trying to access a site. So right now, the best future friendly practice is to use response to design, and you could do that a few ways, which we'll talk about a secondary way, if kind of a quick hit. If you don't have maybe a designer or you don't want to invest in the theme, you can use wordpress plug ins, there's a few that are really, really good, and I'll recommend one here in just second, and you'll even see an example of a site that is using this, a very popular site that also has a podcast. Lastly, you can find someone to custom design your site, and we'll give you some options there s o first the response of theme again, a lot of you guys in the audience have it, but I can guarantee you a lot of you listening and watching on the web. Look at your website on your phone, please look at it, can you take the actions that you want your audience take you want your customers to take so there's a few places to go theme forest dot com is a great place to buy themes anywhere from fifteen to seventy five dollars it could be as that little as an investment and it is an investment would seems another great one happened deputy is a new one that's kind of hit the market and they actually have themes for podcasters so like they really focus on the podcast or so if you want a podcast related theme definitely check check out happened deputy studio press is another great one and thesis themes is another option so again all of these depending on which route you go khun start from free anywhere toe you know a couple hundred dollars so at this stage in the game with all of these people connecting to you via mobile there's really no one hundred dollars should not be something that you block out is something that is going to be a long term investment for you secondary is wordpress plug in the best hands down is called w p touch and there's a pro addition w p touches actually free if used the pro version you get all these nice templates that they have that will make your site a little bit more customizable, which we'll see here in just a few and lastly oh desk if you want to have a custom designer maybe you guys know what designer maybe locally oh deskee lance I actually designed my own site mobile mixed in photo shocks that basic photo shop skills and I found someone on oh, desk and he coded the entire thing responsibly for only fourteen hundred dollars so like it can be done if you have the creative side you don't know how to code, you know, leverage those skills and find someone just to coat it and you can find them very easily on sites like this. So we're going to hop onto the computer real fast and I'm going to show you uh, kind of how you can tell if your site is responsive. All right, so here is our good friend pat flynn and, um, you know, obviously we're on on a laptop about thirteen inches now if you take your mouse and you go to the bottom right corner of your website and you click and you drag and make the window a little bit more narrow, we're going to start to see content shifting, right? You're going to see his little monthly earnings, which were awesome disappear his navigation just got truncated into this little what they call a hamburger menu his photo of his face is now gone we're probably at about a little bit smaller than like a new ipad mini for resolution you see the button remains full with right now if I stroll down you'll see that all the content has kind of adjusted everything's nice big tap herbal obviously this is with a mouse pointer but imagine there with your thumb I highly recommend you to visit smart passive income dot com from your phone which will do here in just a second as well just to show you but this is the response of sight I can get around the buttons become full with and you know navigation is all here everything's still there but he removes the things that might distract that earnings calculator goes away you know his photo goes away you know this whole high on pat goes away and all of these things which are now kind of five across our two up and they shift around sort of like different boxes right that's essentially what response to design is doing a popular creative live instructor ra meets a t he just redid his site not too long ago here's another great example of responsive so we'll take a quick look kind of that this resolution you see his his three ways to kind of earn more money get your dream job save more money all those logo's is in his feature box he's got the email subscribe you can see that that's a key focus and then this very limited navigation now if I grab this corner again I start dragging in you're going to see even the lines of text or shifting the image adjusts, it gets cropped, things get centered and as you scroll down now that's nice and easy to enter your email address this button is nice, nice and big full with these things that were three across or now vertical all giving you the best possible experience that you can have as the device the vice resolution gets smaller and more narrow right now another great example of the plug in version is social media examiner have you guys been a socially examiner so again based on wordpress, you can see uh, you know, they have a custom design theme, but when I go and I grabbed the corner, you can see that nothing shifts right? Right now we're going to go hop over to the phone if we can do that, get the phone going so here's pats, I'll jump tio suchman examiner first so this is using the w t p touch pro theme it allows them to customize the header, but you'll see it really focuses on mobilizing the blog's specifically. So if you have like a a static html pays is trying to capture e mails and things like that, you might lose that capability when you use something like w p touch pro, but again, if you're not mobile at all yet and you're looking for a quick it while you go have someone design a responsive theme for the free version get after it's super easy to install it'll take you probably five to ten minutes and the paid version I think is only forty nine dollars one time so if you prefer to have this this route you can definitely do this as well and you can kind of see that you know it's very easy to navigate around his sight when I click into a specific post all of the images you know go full with the texas optimized w p touch pro uses this responsive some instances of responsive throughout their plug in but now just to kind of go back really quickly to show you like pat site this is actually what it looks like on a mobile phone on again I really if you are using response of design, I still encourage you to actually test on different like physical devices don't rely on just this drag you know, on your desktop because you'll see some things whether again if you're using wordpress and you're using a bunch of third party plug ins, sometimes these other plug ins like break your stuff and like maybe they get started here wouldn't be a button it was it would just be a text links so you want to just always kind of make sure that you know the devices that the top devices if you test on iphone android, you know those those popular devices you'll cover most of the majority of iran and you can look at your analytics to see, you know, who's coming in my sight on iphone versus android what phones that anna samsung galaxy or an h t c whatever they're called so tester site again, some friendly buttons, you can see that they get started here and you can't see my thumb, but against full with we talked about was it sixteen to twenty two millimeters right here like everything's, easy to navigate, all right, and that's what you're going for because if you listen to pat show and at the end, he says, you know, we talked about this there's a link to this this exclusive opportunity, it's smart passive income dot com slash episode ten and you go there and I can't, and I'm like, oh, this is the first time I've ever listen to pat. This is amazing! I want to learn more about pat and I can't get to his about paige easily I'm going to get bored and I'm going to leave. You're going get frustrated like I'm not the pension zoom to find it, so focus on navigation to getting people to do and take the tasks that you really want them to take one getting to your site, so moving on hot back to the presentation here quick checklist, so leverage, responsive theme to give you the best possible experience, make sure the key conversion areas are tabal again filling out forms I'm sure you've tried to check out as anyone tried to check out on a web site from a mobile phone and they had like two other pinches zooming had to enter there credit card information on my gosh so painful right? Well so there are tools out there that can help you optimize payment forms and things like that so test all of those key conversion areas of the opt in and payment areas make sure your navigation is mobile friendly common practice now is that hamburger menu because the three lines looks like a little bun and most responsive temples are actually using that today another option is making sure that your podcast media player is mobile optimized this is a big obstacle that I see I was originally using the power press and through blueberry I believe it is and when it tied with word press and some other plug ins, the play button is not like the most optimal when displayed on the mobile device. So again, if a lot of people are listening to your show from the mobile website which you'd be surprised how many people actually click play and listen to your whole podcast from mobile web versus an apple itunes you want to make sure that it's easy to tap that button right? So ah couple things that you could do to make clicking play a lot easier there's to plug ins or two approaches that I recommend smart podcast player, which is a product by pat flynn andan using a soundcloud player because they use an html five player that will respond along with your site so these some tools that aren't built responsibly but your theme is the theme will respond and maybe the play buttons like over here off the screen somewhere so two key tools you could be using smart podcast player which I highly recommend and the sound kalb soundcloud player so this is just an example of the smart podcast player on my desktop actually I was just took the screen shot the other day but it's built responsibly so on a mobile site you can see three generations of it ask al too sure you know customizable two different colors and you could see the show notes nice big buttons you can choose to have a download button you see all the other episodes so this whole player responds with your site here it is on pat site and you could even go as far as having each and every single episode have its own players. So here on my personal site greg hickman dot me you can download it from right there and this player got it goes from being this this narrow kind of tool player across your you were press site toe on mobile to taking up some nice big real estate right atop your post, making it really easy to click play so the sound the sound cloud player this is an example of using it on the same essentially the same site when I first interviewed john lee do miss for one of my old podcast and you could see it's just a nice big graphic and you play button super easy to click. Nice untapable so some things to pay attention to make sure your players controls are tabal and thumb friendly on dh placing your player at the top of your show notes I actually see a lot of people put the player at the very, very bottom of their show notes super kind of easy thing that you can gloss over, but again thinking about that mobile user if they got your email it's like this is the best episode of this show that you will ever listen to click this link to listen to it and they get there and maybe there's big show notes and you're scrolling and you're scrolling and scrolling and you can never find this player like more reason for them to leave, right? You want them to get to it as fast as possible, especially if you're called to action is hey, click this now because you have to listen to this episode so some of the players have a default that it can always be at the top of the post, like right below the featured image or with smart podcast player is really wherever you in bed, the little short code, so definitely recommend doing that and then check the player every time you see a wordpress plug in. Update anyone, press plug an update if you have a lot, check it because I know with with blueberry I've had many instances where I've updated not only there plugging but another plug in, and the players just disappears. Okay, so make sure you stand top of that. I know some of us don't like to always pay attention to the updates, but if you are trying to build the most, no large audience is possible and engage them. You don't want to miss an opportunity when someone could be going there and looking to hit play, and there is no play button, so I want to talk about email unless there's any questions, yet you have any questions. Questions from the internet. Well we've had a couple that have been coming up through different things in your presentation here now some people were curious this question comes from kevin greece or they want to know about the technology used for that sms activity that you just did when you told us the text that number are you gonna tell us maybe a little bit more just okay sure so well up on that question kevin we have a few more questions here about about looking at your numbers and some of the numbers that come in through it toons now paula follow says what are good starting numbers and what should be your goal for your first year as you go to the mobile podcasting any numbers that you can give out for people to look at is good benchmark well so I think this kind of comes back teo the goal of your podcast we're actually talking outside the room about this depending on what you're but what the goal is veer podcasts you might be measuring different things ok? What was the person's paul so like for example, john, do you care to share your biggest goal with your podcast? Sure. So the biggest goal that I have with my podcast on from you're on fire is to first of all inspire millions of people and with that goal of of launch when your fire is to share the different products and services that we have to allow people to take that leap to take that next step through podcasting or webinars and such awesome anybody else kind of have a goal set outside of just had this podcast on this topic we get the mic rodney, right? Yes well my my primary thing and why I was very interested in your topic was the growing the list factor and you're making me think a lot about is the world press platform with show knows all of that thing really even viable that much anymore if you really have likely pages which I do and people were listening to everything through itunes, the stitcher and I'm giving them a mobile option to them opt in to get my I mean I was thinking I could even take the show knows and just make them a pdf and then they opt in to get that as opposed to so with all the things with where press and all of this action is it really even necessary to even have a blogger anymore? Do you really think that still loan report? Well, I definitely think it's that sort of a blogging and you're driving people back to home base but to answer paul's question really it's like, you know if your goal is leads then you want to focus on ok well how many downloads that I have and then how many opt ins that I get from that particular episode, that particular show notes that particular lead page that I promoted. If you listen to conversion cast by tim page, you'll notice every single episode has a unique piece of content that's downloadable, well, it's a reason always come back to the site? They went out, they made the checklist that you should go through based on the conversation they had right, or hear the screen shots of their entire marketing funnel. That's you don't get through audio, right? So they're always saying, visit this or text this to get this unique thing that's on lee for this episode. So if you do something like that, which I definitely recommend paul, then you could start tracking leads or conversions based on those episodes. But now, if your goal is just have the largest possible audience, then you're going to be looking for things like, you know, most amount of unique downloads and all that stuff now as to, you know, what's average, I believe there's a stat out there, somewhere from lips, and it says, like most podcasters get on average, I think it's three hundred, two hundred, two hundred downloads per episode and I believe john khun pregnant, I'm wrong if that's over the course of the first six weeks. Of that episode okay, so that's like a lips in metric you know coming from the people that host all of our podcasts s o I hope that answers your question paul it is kind of a difficult one have to be honest as kind of what your goal is for conversion but let's keep going we got a little bit a little bit more to go through something get to that text messaging stuff quickly we're going to cover email right? We talked about sixty five percent of all email is read first from a mobile phone s oh this is going to be a little bit harder for some of you guys here in the audience to see but this is a screen shot of my in box all right and I want you to look at a knee mail from ryan, dice a popular online marketer and notice in mobile when you're consuming email there's a few things different than when you're viewing your email on desktop won the sender's name always takes priority always on desktop you notice like in gmail it's like sender's name subject line is off to the side right? So if you're sending email from something like service at or support at or news at your domain it might be one of those things that people just naturally gloss over as their you know sitting there wake up they got their phone alarm they start swiping through e mails the leading all of the ones that are going to waste their time, you know, that might just be something that people can gloss over and think is not important, right? So if you have a popular brand name, or if you always email from your personal name, if you have a personal brand it's really important to make sure that you have a clear sender's name, ok, you also notice that on mobile, you only see so much of the subject line right before you see the dot dot dot where it gets truncated. In some instances, people use the dot dot dot on purpose to create a little bit of intrigue, like ryan dice does right here, he says, my personal traffic blueprint dot dot dot like that gets me really excited. I know who he is, I know he does really, really well in his business, I want to know his traffic blueprint that excites me, ok, but then you have someone like so it's a good example, then you have someone like mashable where they had an article about texting on days like new york creates texting zones, too, and I don't really know what the rest of that thing is now, for someone who is interested in texting, that might not have done enough for me to open it. Right, you might have just glossed right past that and again, you have the service that papal so some things to pay attention to sender's name, but the second thing is, I want you all to adopt what I call the five nine technique and basically that is on the most narrow device, which I believe right now is the iphone five anywhere between five and nine words depending the words that you're using you have in your subject line before it gets truncated on a mobile device, so when you send out e mails promoting your podcast episodes, make sure that the key kind of incentive that's going to get someone to click and open your email is communicated within five to nine words right on iphone plus you probably like a thousand words because it's super veil but really on most devices still today five, nine words unless you're using some some really long words so again, when you test sending your email, which you guys should all be doing anyway, look at it on your mobile device would your reader was your avatar? Click on that subject line knowing that maybe some of it's cut off, you know, can you convince me as a reader? Ok that's just to get it open right now, we're now we're talking now we're now we're engaging, we're looking at are open rates and you can use responsive design for your email template as well if you're using male champ a weber constant contact name any of your other popular email marking software's most of them now have adopted responsive email templates you might be using it without even knowing it but not all of their temple it's in most cases are responsive so make sure that you have that that set up copy blogger is a really great example they always use the same kind of tactic when promoting a new block post this could be the same for promoting a new podcast episode right they have a nice big headline they have their graphic as you scroll down a little bit of teaser text a nice big capable button and they actually have a secondary called to action that's apparently more important than them reading what she probably is to get into their their online community which actually leads into a paid program so really simple if you're using mel champ or any one of those guys you probably have a mobile temple already now james clear anyone subscribe to james clears newsletter few of you so highly recommend you check out james clear dot com he is one of the best writers that I follow right now and he is a great example of creating snack herbal content whether this is on your block your show notes or your email promoting your latest podcast you want to create content that snack herbal. So what I mean by that you'll notice as we go through this email, nice big headline, super big fun he's going to start using bold subheds bullets with the key points in bold you're going to see next step complete these three steps numbers one, two, three why should I do this? One, two, three, four all these reasons, and at the end you'll even see oh here's, a summary, because I know you probably skimmed through all of this year the three things that you need to know and to huge buttons to tap and share this so he gets more email subscribers so snackwell content using headlines, subheds bullets lists to break up that content into chunks because that's, how we consume not every single one of your listeners when it comes your show notes, is going to want to read the whole show notes or read your whole blogged for that matter if you're also blogging. But if they can get the gist through skimming these snack a ball the snap snap kable areas, we have a much better chance of kind of creating that engagement. S o one thing that lead pages are not lead pages caught, the blogger also does they have a podcast called the lead in their email same style email, they're actually attaching the podcast file s o as an mp three is an attachment, they use a company called feed blitz that processes this automatically, I believe, but when you click on it, it launches your mobile web browser and the podcast just starts. So another thing you could be doing is just every time you sent an email about the show are saying, hey, instead of linking to it, I've also attached that you can just listen to it right here. I'm sure that impact your your download numbers, but if it's included in here that might get tracked, I actually don't have the answer to that, unfortunately, but another way to distribute this podcast in a way that might be more relevant for some of your audience. So some quick hits here use mobile response of temple it's the five nine rule on subject lines. Make sure your sender's name is super clear you've a clear call to action using tatp a ble buttons on dh, you could even attach the podcast file toe distribute that content.