SEO – Mobile Friendly Website and HTTPS

Most people search on their phones, so Google looks at the mobile version of a website first. This is called mobile first indexing. If your mobile page has less content than the desktop page, the less content is what Google will use.

How to make a site mobile friendly

  • Use responsive design. One page which adjusts to every screen with CSS, with the same content on mobile and desktop. This is the way Google recommends.
  • Add the viewport meta tag:
<meta name="viewport" content="width=device-width, initial-scale=1">
  • Use text which is readable without zooming.
  • Make buttons and links big enough, with some space between them, so they are easy to tap.
  • Do not use popups which cover the page. Avoid horizontal scrolling.
  • Do not block CSS, JavaScript or images for the mobile bot.
  • Show the same main content, headings, links and structured data on mobile and desktop.

How to test

  • Open the page in Chrome DevTools and use the device toolbar.
  • Use the URL Inspection tool in Google Search Console to see how Googlebot Smartphone sees the page.
  • Test on a real phone, with a slow network if you can.

HTTPS

HTTPS means that the connection between the browser and your server is encrypted. The address starts with https:// and the browser shows a lock sign. Google uses HTTPS as a small ranking signal, but the more important reason is trust and safety: browsers show a “Not secure” warning for http pages, and visitors leave.

How to move to HTTPS

  1. Get an SSL/TLS certificate. Many hosts give it free, and Let’s Encrypt is a free certificate provider.
  2. Install the certificate on the server.
  3. Redirect all http URLs to https with a 301 redirect. See Redirection.
  4. Update your internal links, canonical tags and sitemap to the https version.
  5. Add the https version of the site in Google Search Console.

Mixed content

If an https page loads images, scripts or styles from http links, it is mixed content. Browsers can block these, and show warnings. Change all the resource links to https, or use relative links.

HSTS (optional)

The Strict-Transport-Security header tells browsers to always use https for your site. Use it when you are sure that your whole site works on https.

Note: Your site is the most mobile friendly when you build it for the phone first, and then add things for the big screen. Next: Custom 404 Page.

Congratulations! Chapter Finished. Learn more about the similar topics:
Exercises & Assignments
No Content Found.
Interview Questions & Answers
No Content Found.