HTTPS — How SSL/TLS works in the browser and why you need it

Photo by Raul Varzar on Unsplash

It is not uncommon nowadays to see websites collecting sensitive information adding ‘256-bit SSL encryption’ as a proof of their website’s security. SSL is an acronym for Secured Sockets Layer, it is the S(Secure) in HTTP(Hyper Text Transfer Protocol)S.

TLS (Transport Layer Security) is a standard based on SSL, most secure connections actually use TLS, not SSL. When people refer to SSL they are most likely talking about TLS because SSL is now deprecated.

An SSL connection ensures that data is being sent and received by who it is intended for thereby preventing a man-in-the-middle attack. This way the information being sent cannot be intercepted during transmission, even if it is intercepted in any way, nothing can be made out of the information without the private key (more on this later).

Basically, HTTP transmits information in plain text while SSL makes use of end-to-end encryption while transmitting information as described above. The easiest way to know if a website makes use of an SSL connection is the lock icon displayed beside the URL and/or the website’s address starting with https and not http.

Any SSL/TLS connection begins with the SSL handshake (communication/exchange of messages between the client and server). During this process:

  • The client sends a message to the server to identify itself. The message contains information about which encryption and compression algorithms the browser supports, and other information that the server needs to communicate with the client using SSL.
  • The server sends its digital certificate and also other information that the client needs to communicate with the server using SSL.
  • The client (browser) verifies the digital certificate authority by checking it against a list of known certificate authorities.
  • To verify the private key, the client will generate a pre-master secret using the servers public key (provided by the certificate authority), the server then uses its private key to decrypt the pre-master secret.
  • At the end of the SSL handshake, a master secret key is generated which is used to encrypt and decrypt information sent across the network.

Browsers have a list of trusted certificate authorities. Your browser has to trust your certificate authority to verify it, that is why there are trusted certificate authorities. There are two major types of Certificate Authorities (CAs), the Root CAs and the Intermediate CAs. You can get the browser to trust you based on the trust of another certificate authority (SSL certificate chain).

When your browser is unable to verify the SSL certificate of a website, a ‘Your connection is not private’ warning or other SSL related warning is displayed. In Chrome, you can get information about a website’s SSL certificate by clicking the lock icon beside the URL on the address bar and then clicking the ‘Certificate’ option. This will work almost similarly in other browsers.

You can also get the certificate information from the Security tab of Chrome DevTools.

Security tab in Chrome DevTools

Even if you do not collect sensitive data on your website, you should add an SSL certificate to your website, it makes your website visitors/users feel safe to use your website. Let’s Encrypt which is a trusted certificate authority and used by millions of websites offers free SSL/TLS certificate.

Next time you are entering your details into any website especially sensitive information such as credit card information and passwords, ensure the website is secure. Apart from the lock icon to verify a secure website, you should also check the website address to ensure the second level and top level domain (the last parts of the website address) is what it should be.

Learning, unlearning, relearning, and finding my path. Interested in user experience, product, and software development.

Learning, unlearning, relearning, and finding my path. Interested in user experience, product, and software development.