3 Tips to Keep Your Browser Lock Icon Happy
With credit card security breach incidents hitting the headlines more often than they should, today’s consumer is more security conscious than ever. As an online merchant, it is important to make sure your site isn’t deterring customers for unavoidable reasons. I can’t tell you how many times I have visited a secure page (https) only to come across a warning icon indicating that the page really isn’t secure. All it takes is one element on a screen being referenced improperly and BAM – that solid lock icon either disappears or has a warning icon over it.
The next step is to check your page again, especially using the Chrome browser. If you have verified that every element on the page is being referenced securely and you still have the yellow warning icon over the lock, the chances are that you have a form on your site which will post data to a non-secure url (form action=”http://yourdomain.com/http-no-good.aspx”). I see this often times with mailing list sign-ups. If you do not control the URL that you are posting data to, as in the case with many email list sign up forms, check with your email provider to see if they have a secure version of the URL (it should start with https) that you can post to. Once you fix that, you should have a solid lock icon and your customer can reward you. At this time, IE and Firefox don’t seem to break the lock on insecure actions, but that might change in the future.
The final thing you can do is start using more modern mark up when referencing elements. In the old days, if you were referencing an image on a different site, you had to start the call with either http or https (ie: img src=http://cdn.nexternal.com/images/mobile-ecommerce-beach.jpg). If you were referencing that image on another site today, you could simply use the // syntax (ie: img src=”//cdn.nexternal.com/images/mobile-ecommerce-beach.jpg”). This syntax assumes you want to use the protocol that the parent page is using. So if the page referencing that image is secure, that image will also be called securely. Of course for this to work, the domain the image resides on must support SSL.
What is the moral of the story? Start the checkout process on your site using multiple browsers and look for the solid lock icon without warning signs. If you see a warning sign, use the tools outlined above to trouble shoot accordingly.
Today I learned of a fourth thing that can cause the yellow warning icon over the lock in Chrome. If your security certificate is using SHA-1 cryptographic hash algorithm and your certificate is valid past January 1, 2017, your site will no longer appear to be fully trustworthy in Chrome’s user interface. This change appears to occur in Chrome’s latest build as of Nov 20th or so. Here’s more information http://blog.chromium.org/2014/09/gradually-sunsetting-sha-1.html. To solve this issue, you may need to have your security certificate provider reissue you a certificate that uses the SHA-256 algorithm.