Why and how you should use SSL on your website

SSL (Secure Sockets Layer) is a technology to encrypt the connection between your server and people visiting your website. You recognize a secured SSL connection by the green padlock icon in your address bar and HTTPS in front of the URL. More and more websites are switching to SSL, and we believe you should too. In this post, we'll explain why, and we tell you how.

Move from http to https

Why should I use HTTPS?

Privacy and security

Without an encrypted connection, it's not so hard to eavesdrop on the information when your visitors are using a public Wifi connection. That makes your website vulnerable to hackers and people trying to steal personal information.

When you're using an HTTPS connection, all the data that is exchanged between your website and your visitor is encrypted. That means others cannot read what is being transferred. This makes your website less vulnerable and keeps your and your visitor's data safe.

SEO

As Google announced in 2014, in their efforts to promote security on the web, HTTPS has become a ranking factor. That means that for two equal websites, the one using an HTTPS connection will rank higher. It's not a huge factor, but it definitely helps!

Provide trust to your visitors, brand

The green padlock that comes with SSL has become a strong signal of trust. Visitors are more likely to enter their information or purchase your products when they know their data is safe.

The padlock icon in the address bar

Google's Chrome browser has recently changed the labels for sites without an SSL certificate. It started with showing a 'Not secure' warning for web pages with credit card information and login forms. Now, it also shows this warning for all forms on a website. Google also announced that it will soon show that warning for all sites without HTTPS.

Google Chrome warnings for non-secure websites

Let's face it: a big 'Not secure' label doesn't exactly increase the trust of your visitors in your site and brand.

Referal data

Website using an HTTPS connection will not send referrer data to sites without HTTPS. That means that if your website is not using HTTPS, there's no telling where the visitor is coming from. As a result, you will have far less information about the source of your traffic in Google Analytics. If you want to know where people are coming from, installing an SSL certificate is a good idea.

Legal matters

In more and more countries, you are required to encrypt the connection if you're using personal information of your visitors on a website. Keep in mind that personal information can also include the IP address of your visitors, but also login forms. With new EU legislation, companies face hefty fines for not securing their visitor's personal information.

So, how do you do it?

As you've seen, there's enough reason to install an SSL certificate on your website. It's not hard, but there are a couple of things to keep in mind.

Step one is to get an SSL certificate. Normal SSL certificates (standard validation for a single domain) are very cheap or even free if you're using Let's Encrypt. In some cases you may need a Wildcard certificate: this allows you to use the certificate on multiple subdomains. These are a bit more expensive. If you're looking for organization validation or extended validation: these provide even more security but are also more expensive.

Once you've obtained the certificate you will need to install it on your server or ask your IT team to do it. We won't go into all the technical details of this part, but Digitcert.com has some excellent guidelines for the different platforms.

Once it's installed, you'll now be able to visit your website on the https:// address. If all is well, you'll see the green padlock telling you your connection is secured. Good job! But this is just the start.

Run a check

SSL Labs has a great tool to check if your SSL certificate is insatlled correctly and meets all the requirements.

Avoid mixed content

It's possible that your website uses images, CSS files, javascript files or embedded content from sites without an SSL connection. In that case, instead of seeing the green padlock, you'll see a warning that your site uses 'Mixed content'. Since not all content is loaded over HTTPS, your website isn't really secure.

Chrome can help you: in the Developer Tools, go to the Security Tab. It will show a link to the network tab showing just mixed content. Make sure to use the HTTPS variant of all the content on your website. For internal CSS or Javascript files, this is easy: your site now has an encrypted version so we'll use that one. Just change the URL from http://www.domain.com/js/javascript.js to //www.domain.com/js/javascript.js. This is a reference without a protocol, so the browser will automatically use HTTPS.

For external services like youtube videos, but also Jquery files, Google Maps scripts and so on, there's normally also a HTTPS version available. Again, just replace http:// with //, and you'll be using a secure connection without mixed content.

Update your links

Ideally, you should replace all internal links with the new https variant. The same holds for other references across your site. THink of canonical tags, OpenGraphg tags, Twitter cards or Schema.org data. These may all include links to your page, so make sure they use https too.

Don't forget to update your sitemap.xml and your robots.txt file: these hold many links to your website and should all use HTTPS.

External tools

Most websites use some or a lot of external tools for various purposes: Google Analytics to track your visitors, screen capture tools, visitors surveys, you name it. Make sure to check if all these external tools still work.

Redirect your traffic

By now you have verified that everything works. The only problem is that your website is still available on the insecure HTTP domain. therefore we need to direct all traffic to that old address to the new, secure URL.

The best way to do this is a serverside 301 (permanently moved) redirection. This tells your visitors' browser and search engines to use the new address instead. Any links to your old URL will also keep working, as they are automatically redirected to the new one.

If you're on an Apache server, you can do this by adding the following lines to your .htaccess file:

RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]

Google Search Console

The final step is to tell Google your site has a new address. Add a new website to Google Search Console using the new HTTPS address. There, you can add a sitemap to help your site getting indexed quickly.

Don't use the Site Move tool: that's only for when you're moving to a completely new domain, which is not what we're doing here.

That's it, you're done! It's good to keep an eye on your website, log files and analytics to make sure everything works as expected. Some sites see a small drop in traffic right after moving, but that's just temporarily.