Insecure content and how to fix it

It’s a pain to go through the process of installing an SSL certificate only to find that your site has “insecure content” and now won’t load on certain web browsers. When you try to access it, browsers may give you a message along the lines of “this page contains both secure and non-secure data”. Perhaps understandably, people tend to automatically go blame the SSL certificate itself for causing the problem. After all, wasn’t the SSL supposed to make their site more secure than ever?  However, the issue of insecure content points to a problem with a website’s coding rather than an SSL.

But what exactly is “insecure content”? No, it isn’t content with low self-esteem — it’s a lot more boring than that. This article will explain what exactly insecure content is, why it can occur after you install an SSL, why it’s bad, and ways you can fix it.

Insecure content: the what and they why

When you install an SSL certificate on your site, this allows users to connect to your site via a  Hypertext Transfer Protocol Secure (HTTPS) connection. This means that requests sent and received by a browser are encrypted, so that no third-party can intercept any data sent between it and the server where a website is hosted. 

On a webpage loaded through a HTTPS connection, all content should be secure. However, sometimes certain content on a page might load through a HTTP connection instead. Anything loaded through HTTP is not secure. Another possible scenario is when content is linked from another site via HTTPS, but it has an invalid (an expired, or not trusted) SSL certificate. This kind of content is also not secure. 

When a webpage features both secure and insecure content, this is known as “mixed content”. Mixed content isn’t good, because it can compromise the security of your site. To explain why this is, we need to talk about what happens when you load a webpage on your browser and what exactly we mean by “content”.

In this context, “content” is the resources that make up every facet of your website, from HTML, and stylesheets to images, videos, CSS, and Javascript. When you try to visit a webpage on your browser, the browser makes a request to the server where the site is hosted for HTML resources, and the site is downloaded and displayed in the browser. Very often other resources will be needed to display the page too, such as one or more of the aforementioned content. This content is downloaded using separate requests.

So, mixed content occurs when the HTML of a site is loaded via HTTPS but some of the other page elements — such as images or scripts — are loaded over a connection which is not secured. This can happen because there are files featured on your site that are actually hosted on another website. This is the reason why a webpage can feature both secure and insecure data.

Why is this a bad thing?

Mixed content makes your connection less secure 

In an ideal world, the SSL certificate would just override anything dodgy featured on your site and make it all equally secure. However, an SSL certificate can only control the connection of content hosted on your server and not content hosted elsewhere. As a result, any content loaded using the less secure HTTP protocol will make your connection susceptible to things like man-in-the-middle attacks. This is when a malicious third-party can intercept and modify the connection between the website and the browser. Sometimes this can even result in the hacker taking over an entire web page. 

This is why many browsers alert users to web pages with mixed content. It might not sound like a big deal, but it could potentially compromise their connection to your site. Some browsers have even started blocking insecure content entirely. For instance, Google Chrome blocks the loading of insecure scripts, while insecure video and audio is auto-upgraded to HTTPS. If this isn’t possible, the video and audio content is also blocked. In the future, images will be treated the same way. As you can see, ignoring mixed content is risky business when it comes to both security and having a site that actually works. 

How to find and fix insecure content

How exactly do you know if your site has mixed content and how can you go about fixing it? There are myriad ways you can go about this. We’ll talk about some of the more simple solutions here. If you feel comfortable with coding, this resource from Google gives very helpful instructions about how to find and fix mixed content in your source code. 

If this is beyond your wheelhouse, Why no padlock? is a simple tool that will scan your webpage and tell you which items are insecure. Simply enter the webpage URL in the box and it will give you a report about your webpage’s content. Take a look at HTTPS Checker for another alternative.

Once you have pinpointed your site’s insecure content, you have a number of options on how to proceed depending on what the culprit is. You can:

• Upload the file directly to your site, rather than linking from elsewhere (if legally possible)
• Link the content from a more secure host
• Delete the file from your site completely

If you have a WordPress site, another option is the SSL Insecure Content Fixer plugin. This plugin will do most of the heavy lifting when it comes to finding and fixing simple mixed content issues. The settings can be changed to deal with more comprehensive fixes. 

Wrap up

Insecure content can be an unexpected problem, but it’s not impossible to fix it. If the steps we outlined above are too complicated, or the problem is too big for you to handle alone, we recommend that you reach out to a web developer. As this is an issue with code debugging and not related to hosting or SSLs, the guidance our customer support team can give you on this subject is limited.