How does HTTPS keep you safe
The small padlock in front of the address bar means the connection uses HTTPS. In the networking area we followed the order in which that connection is set up. This time we change the question and ask why the padlock is safe. The answer turns out to be familiar: certificates, key exchange, symmetric encryption, fingerprints, and signatures, the pieces we learned one by one in this area, are all inside that padlock.
Not how, but why it is safe
When we met HTTPS in the networking area, we saw the order in which a padlock is put on between a request going out and a response coming back. That is the view of how. Here we look at the same padlock from the view of why: we open it up and ask what blocks what, and why that deserves trust.
A single padlock has three threats to stop: impersonation, where a fake pretends to be the real site; eavesdropping, where someone reads what passes by; and tampering, where someone changes the contents on the way. Three mechanisms, each stopping one of them, fit together in turn.
Tap the two views to compare them. The networking area looks at the flow, the how; this lesson looks at the reason for safety, the why.
The flow tells you the order of the steps, and the reason tells you why you can trust those steps. Both matter, but the reason is the star of this lesson.
That reason comes down to three links. First, confirm that the other side really is that site. Second, safely share a key that only the two of you know. Third, lock the contents with that key and check that they were not changed. Only when all three links close does the padlock do its job.
Confirm it is the real site
The first link is confirmation. Before putting on any padlock, there is something to ask first: am I really talking to that site right now, or to a fake pretending to be it?
When the connection starts, the site sends its certificate. As we saw last lesson, the browser checks that the chain reaches a trusted root, that the signatures are valid, that the certificate's domain matches the address in the address bar, and that it has not expired. Only if everything holds does it move on; if anything fails, it stops there and shows a warning.
Pick a site and check its certificate. When the vouching holds it passes; when it is a fake, it stops and a warning appears.
Only the side whose vouching held passed in green; the other stopped in red. However perfectly a fake copies the look of a site, it cannot imitate a trusted authority's signature, so the first button only fastens for the real one. This is the link that stops impersonation.
Still, confirming the other side is real does not make the conversation safe by itself. The contents still travel along a path anyone can watch. Now it is time to share a key just for the two of you.
Share the key safely
The second link is sharing a key. To lock contents quickly, both sides need to hold the same symmetric key. The problem is how to share it on a path where someone may be watching.
There are two ways. In one, the browser makes a symmetric key and sends it wrapped in the site's public key; this is what the activity below shows. In the other, as we saw in the key exchange lesson, both sides trade public ingredients and build the same secret together. Most connections today use the second way, and the site signs its share of the ingredients with the private key behind its certificate, so nobody in the middle can swap it.
Tap through the steps to share the key. A key sent wrapped in a public key cannot be opened without the private key, so the eavesdropper is left empty-handed.
Following the steps, the two sides ended up with the same symmetric key. The person watching in the middle saw the wrapped package but has no private key to open it, so they come away empty-handed. The secret key was never sent on its own, yet in the end only the two sides hold it.
The build-it-together way goes one step further. A new secret is made for each connection and thrown away after use, so even if the site's private key leaks later, past conversations stay locked. Now it is time to lock the actual conversation with that key.
The three links close
The third link is locking. The contents are encrypted with the symmetric key only the two sides hold, so anyone watching on the path sees only meaningless characters. Symmetric encryption is fast, so it can lock large files and video without trouble.
It does more than lock. Each piece of content is sent with a check value made from the shared key, so if anyone changes even one character on the way, the check value no longer matches and the receiver notices at once. This check is called integrity. Confirmation, key sharing, encryption with integrity: only when these three close together does the padlock lock.
Tap the three links one by one to close them. When all three close, impersonation, eavesdropping, and tampering are all blocked; if even one is open, the padlock does not lock.
With all three links closed, the padlock locked. Certificate checks stop impersonation, encryption stops eavesdropping, and integrity checks stop tampering. Each threat has a link paired against it.
If one is missing, the rest lose their point. Encrypt without confirming and you end up talking very securely to a fake site; confirm without encrypting and the contents lie open on the path. Even so, the padlock does not protect everything. An eavesdropper can still tell which site you connected to and roughly how much data passed, and a scam site can get a perfectly valid certificate for its own domain. The padlock means the other side owns that address, not that the site is honest.
Wrapping up
Put together, it goes like this. HTTPS is the padlock where the pieces of this area come together. In the networking area we saw the flow; here we saw why it is safe. Safety comes from three links closing: a certificate confirms the real site, public-key techniques share a symmetric key just for the two sides, and that key encrypts the contents while check values confirm their integrity.
Each link stops one of impersonation, eavesdropping, and tampering, and the padlock locks only when all three close together. What the padlock protects, though, is the contents in transit, not the site's honesty.
Tap the four key points in order to review: why it is safe, the certificate check, sharing the key safely, and the three links closing.
Now the small padlock in the address bar should look different. It is not just a picture; it is a promise that all three links have closed: the other side was confirmed by a certificate, a key just for the two of you was shared safely, and the contents are being locked with that key.
But what the padlock guards is the contents on a connection that is already open. Who stops, at the door, the connections that should never have come in at all? Next lesson, we look at the firewall, which does that job.