The Web is becoming ever more security conscious.

If you are serving your pages over an http connection then it will impact against you.

Here are some tips.

Regardless of wether you are accepting sensitive data like emails or passwords or have any input forms on your site at all. Browsers are starting to report your site as insecure if you are delivering content using HTTP instead of HTTPS.

Most users will not understand the different warnings. The easiest way to tackle this is to move over to HTTPS.

i.e. if you site is http://mydomainname.com then it needs to be https://mydomainname.com

Warnings

The least invasive warning reported by Chrome at the moment is the (i) information icon.

If you don’t have any forms which are marked as password or email then you’ll probably have this next to any of your http sites in Chrome.

Next step is the following, when you do have forms on your site. Insecure is shown in the browser URL bar, users will find it harder to ignore this and general trust in your content will be questioned.

The worst that can happen is the following:

This happens if the user tries to access your site via HTTPS and the certificate that you are serving is not associated with your domain. You might find this happens on your hosting server if they send back their own certificate, but one which has not been issued to your domain.

What to do?

CMS Hosting

If you are hosting on a CMS like Wordpress or Blogger, and using their servers then you probably have HTTPS already.

Add Free Certificate

Otherwise you need to get a bit technical and add an SSL certificate to your site.

There are free options from services like Let’s Encrypt. They will provide a free SSL certificate that you load on to your site.

On my hosting platform I’m lucky that in the web hosting control panel I have a “Let’s Encrypt” option.

These free certificates are only valid for 3 months. If your lucky then your hosting service will renew these for you. But since Let’s Encrypt is a free service, there is always the possiblity that something goes wrong.

Talotics.com is currently using Let’s Encrypt as its SSL Certificate provider.

I have a reminder in my calender every 3 months to check if the certificate is renewed properly.

Paid Service

For my main company website I pay the hosting provider every year to issue a certificate, this currently costs me an extra £48 a year. I suspect this will come down in price over time, but it means I don’t have to check if the certificate is renewed and I don’t suffer any downtime. And I have someone to shout at if something goes wrong.

Documentation?

You will need to check with your hosting provider how to add SSL to your site, as this will vary from platform to platform.

.htaccess

I have a contingency plan in place, just in case the Let’s Encrypt renewal fails.

It isn’t a good contingency plan. It involves dropping back to HTTP until the certificate is valid.

I do this by amending the .htaccess file in the root of my web folder. Again this is technical, but if you are avoiding a hosted CMS system then you will need to understand the technical details of how your website works.

# force http

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

# Force www on http
RewriteEngine On
RewriteCond %{HTTP_HOST} ^talotics\.com [NC]
RewriteRule ^(.*)$ http://www.talotics.com/$1 [L,R=301,NC]

The above basically says if someone accesses the site with HTTPS then redirect them to http.

When the SSL certificate is running, I actually have the reverse in place, to force anyone accessing over HTTP to use HTTPS:

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

RewriteEngine On
RewriteCond %{HTTP_HOST} ^talotics\.com [NC]
RewriteRule ^(.*)$ https://www.talotics.com/$1 [L,R=301,NC]

Other Safety Nets

For any of your JavaScript or CSS file includes, make sure that you use a ‘protocol relative url’ i.e. instead of http://mycssfile.css use //mycssfile.css

A ‘protocol relative URL’ means that the browser uses whatever the current protocol is, to load the CSS or JavaScript file.

This is important because browsers will report mixed security protocols as an error and mark your site as insecure. And you might need to jump between HTTP and HTTPS quickly to keep your site running if the certificate fails.

As a quick check

Search for http:// and https:// in your site source code and replace with // when possible.