Be “Mobile Friendly” In Google Search Results

In this lesson we learn how to have Google’s new “Mobile-friendly” label appear next to our website in search results. Check out my web design video course:

Sign up for my newsletter to receive periodic webDev tips, tricks, resources and coupons. Join the list at

Follow me on Twitter for lolcats, webDev resources, and updates:

Watch the mobile toggle menu tutorial video:

Demo files from this mobile makeover lesson (look for links under video player):






21 responses to “Be “Mobile Friendly” In Google Search Results”

  1. Vladimir Pérez Avatar

    I will don't sleep tonight! 🙂

  2. Fuquawi Avatar

    Web newbie here (starting to get to grips with html & css but
    struggling a bit with javascript) so this is possibly a stupid question
    but am wondering if it's not possible to hide/unhide the embedded video
    element in the site by just using css – placing it in a div with a
    particular class & then setting display to none below a certain
    screen size for that class meaning that that section of the page simply
    wouldn't show to mobile users. Would that be possible or would one
    definitely have to use javascript (some sort of if/or function?) to
    perform such a task?

  3. Krzysztof P. Avatar

    Well done tutorial. One question. What kind of tools/plug-in was used to measure width-height of element in webpages?

  4. kevin zhang Avatar

    Thank you for such a nice tutorial and mentioned the Google's principle for mobile-friendly web page

  5. andrewford80 Avatar

    Cool video, but so far over my head! I will keep researching

  6. Sfumatostar Avatar

    These are really helpful. Thank you v much for puttin together these tutorials.
    Can i request you to create a tutorual that speaks to adding twitter, fb, n whassap buttons on a website.
    Thanks v much once again.

  7. vlad dragos Avatar

    What about phones with hd screens? F.E my phone has a 1440p screen.

  8. Bart Heimenberg Avatar

    Another great video! Learning so much and so easy.

  9. Kris Maly Avatar

    All four videos are awesome with great guidelines.

    Thanks a lot for educating the community and appreciate all your efforts..

    Please keep publishing some more videos.

    Thanks a bunch

  10. jackendy cherenfant Avatar

    I could not go without subscribing you a web Guru!
    Thank you so much!

  11. Anja Toetenel Avatar

    Thank you so much, this is the very best tutorial on responsive friendly make over webdesign so far and easy to apply, love it! And going to use it for my websites. Great info and i love the way you explain this stuff, very easy to understand!

  12. Toosin Beymen Avatar

    Images are a significant roadblock to making a screen fit in the 320px wide smartphone screen. The best solution, IMO, is to replace the images with thumbnails which can be clicked to view the full sized image and examine detail by zooming in and out.

  13. Husain Ahmmed Avatar

    Thanks for this awesome video waiting for video like this 

  14. Paul Douglas Avatar

    Another timely and useful video. Thanks Brad!!

  15. Mia Anderson Avatar

    This was very helpful. Thanks for taking the time to post all these videos.

  16. S A Bokhari Avatar

    All of your videos are super targeted with specifics and neat precise outstanding demonstration and explanation. Would love to see more about Sass and Jekyll in depth videos. Thank You for sharing. Take Care. Love

  17. Maria Silversken Avatar

    "… so I think we can sleep at night now…" 🙂

  18. Kirkadon Avatar

    Very informative, you've helped me out a lot. Thank you! 🙂

Leave a Reply

Your email address will not be published. Required fields are marked *