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
- Get an SSL/TLS certificate. Many hosts give it free, and Let’s Encrypt is a free certificate provider.
- Install the certificate on the server.
- Redirect all http URLs to https with a 301 redirect. See Redirection.
- Update your internal links, canonical tags and sitemap to the https version.
- 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.
| Exercises & Assignments |
|---|
| No Content Found. |
| Interview Questions & Answers |
|---|
| No Content Found. |