Give your website a boost by fixing mixed content

Emily Walker - 30 July 2020

Would you click through to a website after receiving a pop-up message that defines the connection as ‘unsecure’? I’m sure I’m not alone in saying I would feel slightly hesitant…

But how many times can you say you’ve found yourself clicking ‘go’ on a URL and being met with this notification? It’s certainly not uncommon. And yet, it can have a real impact on traffic volumes and hence, is a pretty important aspect to get right when developing a website.

The good news is that it’s actually not as scary and intimidating as it might sound, and can be fairly simple to fix when you know what you are looking for.

The key lies with understanding mixed content.

This blog post aims to help you identify the necessary elements to rectify any issues you might be having and ensure visitors can freely and securely visit your site.

What is HTTPS and an SSL certificate?

Sound a bit like gobbledigook? … Let’s start at the beginning.

What is HTTPS (Hypertext Transfer Protocol Secure) and why do we need it?

HTTPS is the most secure way to serve your website over the internet. Not only is it secure, it also encrypts everything. An SSL certificate ensures a secure connection between an internet server and browser. This means that every time a user enters sensitive information on a website, such as credit card details, usernames and passwords, the SSL makes sure it travels securely between their browser and your server.

Most websites nowadays support HTTPS. However simply serving your website over HTTPS and installing an SSL certificate, doesn’t always stop non-secure HTTP issues occurring.

A website serving HTTPS with a valid SSL certificate will display a little padlock in the browser.

Secure Padlock showing in an internet browser

What is mixed content?

Mixed content occurs when a website loads over a HTTPS secure connection, but content such as images, videos and resource files load over a HTTP insecure connection. Google refers to this as mixed content because both HTTPS and HTTP are being loaded on the same page. In most cases, this happens after a recent website migration.

Why would this cause an issue?

Google can be difficult to please! Its constantly changing and its important to try to keep up as much as possible. But, if there is one way to make Google happy, its with secure content (HTTPS).

The majority of internet users use the Google Chrome browser. During June 2020, Google Chrome dominated 65.47% of the browser market share worldwide.

Source: StatCounter Global Stats – Browser Market Share

Recent Google Chrome browser updates have targeted websites with non-secure (HTTP) or mixed content, causing it to become a significant problem.

Chrome 79 is a version of the browser, which was released in December 2019. It allows for websites with mixed content to load, but issues a warning to the user and in some cases removes the secure padlock icon. Although your website has a valid SSL certificate, a non-secure warning alert is likely to make a user stay clear of your website and explore other options.

Chrome 84 on the other hand, blocks all non-secure HTTP content automatically. If you have mixed content on your site, your content will not load at all. This version of the browser was rolled out this year.

Here are some reasons why non-secure or mixed content can cause a problem:

Security

Mixed content makes your website vulnerable to hackers. Hackers can infiltrate your site through an HTTP resource and from there, potentially access the rest of the webpage.

SEO

It has a negative effect on your website ranking performance, meaning that you could swiftly slip off the rankings for important keywords! Very quickly, your customers won’t be able to find you online leading to a loss of business.

Reliability and Trustworthiness

If a browser detects mixed content, a warning is issued to the user. Your website appears untrustworthy and this is likely to push users away. It has the potential to damage your brand’s reputation online.

How to identify mixed content?

If your website supports HTTPS and has a valid SSL certificate installed….Huzaah! You’re already more than a few steps closer to a fully secure website.

Here are a few ways to identify mixed content on our website:

  • The easiest way to identify mixed content on your website is with an SEO Tech Audit. You will find out if you have mixed content and many other underlying issues on your website too!
  • Visit your website as a user to check whether you receive any non-secure or mixed content warnings and look for the padlock icon in the browser. We don’t tend to visit our own websites, but it is important to explore how it appears to an external user.
  • Inspect your webpage content by right-clicking on a page and chose the tab, labelled ‘Console’. Here you will be able to see ‘behind the scene’ mixed content warnings.

Google Chrome Inspect Tool Screenshot

How to fix mixed content issues?

Once you have found the non-secure elements on your web page, you can start amending the URLs, form HTTP to HTTPS. You do this by adding an ‘s’ to the URL link.

However, before you do this, you must make sure that the non-secure element is available over a secure HTTPS connection. You can do this in a few ways, such as:

  • Use a website crawling tool such as Screaming Frog.
  • Input the URL of the non-secure element, such as the image file URL, into your browser. Change the ‘http://’ to ‘https://’ and see whether you reach a live page.

If the non-secure element has an HTTPS version of the file, simply update your HTTP links to the HTTPS version in your source code.

Having a fully secure website is more important than ever. Google will inform users that your webpages contain non-secure content before they have even visited your site. This will effectively influence users to stay away from your website.

If you haven’t migrated from HTTP to HTTPS already or have a website suffering from mixed content, get in touch a member of the SEO team at Wagada today.