NavSproutNavSprout / A home for good tools✳
Submit

INTERACTIVE LEARNING TOOL

Protocol Explorer · TLS / SSL

Explore internet protocols with animated messages, real arrival order and packet inspection.

Read the learning guides ↓
PROTOCOL EXPLORERLearn how the internet works
Now learningTLS / SSL · Encrypted transportOverview · 5 steps
Learning progress0%
0 / 14 complete · 0 in progress
Client192.168.1.10Router192.168.1.1InternetWeb Server203.0.113.10

Protocol overview

TLS / SSL

Active

Transport Layer Security

Understand the TLS 1.3 handshake: key agreement, server authentication, transcript verification and encrypted records. SSL is a legacy name, not the protocol used in this lesson.

Layer
Security over transport
Default port
Application dependent
Transport
Usually TCP; TLS 1.3 shown
Data format
Handshake messages + protected records
Defined in
RFC 8446
Read the complete guide ↗

Packet flow

DNSTCPRequestResponse
No.TimeSourceDestinationProtocolInfoSize
10.000s192.168.1.10203.0.113.10TLSClientHello · supported_versions=TLS 1.3113 B
20.024s203.0.113.10192.168.1.10TLSServerHello · TLS_AES_128_GCM_SHA256109 B
30.048s203.0.113.10192.168.1.10TLSEncrypted handshake · illustrative ciphertext107 B
40.072s192.168.1.10203.0.113.10TLSClient Finished · illustrative ciphertext107 B
50.096s192.168.1.10203.0.113.10TLSApplication data · illustrative ciphertext107 B

NAVSPROUT · PROTOCOL FIELD GUIDES

TLS / SSL, packet by packet.

Understand the TLS 1.3 handshake: key agreement, server authentication, transcript verification and encrypted records. SSL is a legacy name, not the protocol used in this lesson.

PROTOCOL FIELD GUIDE

How TLS / SSL works

Understand the TLS 1.3 handshake: key agreement, server authentication, transcript verification and encrypted records. SSL is a legacy name, not the protocol used in this lesson.

Default port
Application dependent
Transport / carrier
Usually TCP; TLS 1.3 shown
Category
security

1. Offer a ClientHello

The client offers supported versions, cipher suites and a key share. A TLS 1.3 ClientHello still contains legacy compatibility fields.

2. Select a ServerHello

The server chooses compatible parameters and its key share. Both endpoints derive handshake traffic secrets from the shared key exchange and transcript.

3. Authenticate the server

EncryptedExtensions, Certificate and CertificateVerify follow under handshake encryption. The certificate binds an identity to a public key; a signature proves possession.

4. Verify Finished

Finished authenticates the transcript with derived keys. The client validates the server and sends its own Finished before ordinary application data.

5. Protect application records

AEAD encryption authenticates and encrypts each record. TLS 1.3 encrypted records have an outer application_data type even when they carry handshake content.

Protocol relationships

Protocols cooperate across layers. Compare the neighboring lessons to distinguish addressing, delivery, application semantics and encryption.

Standards and editorial method

Written and implemented independently by NavSprout. Lessons summarize public protocol standards using synthetic documentation addresses and fictional credentials. Consult the standards for complete wire formats and normative behavior.

RFC 8446 ↗

Check your understanding

What does Finished verify?

Why it’s hereNAVSPROUT ORIGINAL

Reading definitions is easier when you can connect them to a packet. This first-party learning tool pairs static explanations with a visual lab, byte inspection and a short knowledge check. All course data and application resources ship with NavSprout.

  1. Choose DNS and follow the lookup from client to authoritative server.
  2. Switch to the sequence view, then inspect a packet and select a field to highlight its bytes.
  3. Compare TCP with UDP, answer the quiz and export your progress.

Frequently asked questions

What happens when I open a website?

A typical first HTTPS visit can involve DNS resolution, a transport connection, a TLS handshake and an HTTP exchange. Caches, connection reuse and HTTP/3 can change this sequence.

How are TCP and UDP different?

TCP presents a reliable ordered byte stream. UDP preserves individual datagram boundaries without built-in delivery guarantees. Applications choose the behavior they need.

Are these real captured packets?

No. Frames are generated locally for teaching. Header lengths and checksums are calculated, while TLS ciphertext and some negotiation payloads are illustrative. Downloaded PCAP files contain synthetic examples, not live traffic.

Can I learn without JavaScript or an account?

All 14 protocol guides and their lesson explanations are available as ordinary HTML without signing in. JavaScript powers animations, byte inspection, local progress and quizzes.

Where is my progress saved?

Only in this browser’s local storage. Export a progress JSON file to move it to another device. Clearing browser data can remove progress.

MAKE A THOUGHTFUL CHOICE

Your shortlist, side by side.

Pricing models are indicative. Check each official website for current plans and limits.