How the Web Works
Before we start
You have a URL.
example.com/products — five plain words. Before a single pixel shows up, your browser and that site's server run through a small negotiation, then the browser builds the page you actually see, piece by piece. Scroll to watch it happen.
Step 1
Breaking down the address
Your browser splits the URL into parts before doing anything else: the scheme (https, meaning "use an encrypted connection"), the host (example.com, who to talk to) and the path (/products, what you're asking for on that host).
Step 2
Saying hello (TCP handshake)
Before any data flows, the browser and server agree they're both ready — a three-step handshake. SYN: "can we talk?" SYN-ACK: "yes, can you hear me?" ACK: "loud and clear." Only now is a connection actually open.
Step 3
Securing the connection
For https sites, one more negotiation happens right here — a TLS handshake — so everything sent from this point on is encrypted. It's the difference between a postcard anyone can read and a sealed envelope.
Step 4
Sending the request
With the connection open and secure, the browser sends an HTTP request: GET /products, plus a pile of headers describing itself — what browser it is, what it can accept, whether it's carrying cookies.
Step 5
The response
The server replies: a status code (200 OK means success), more headers, and a body — usually a chunk of raw HTML text. At this point the browser has data, but nothing resembling a page yet.
Step 6
Parsing HTML into the DOM
The browser reads that HTML text tag by tag and builds a tree out of it — the DOM. <html> at the root, <head> and <body> beneath it, and every tag inside those nesting as branches. This tree is what the rest of the browser actually works with.
Step 7
Applying CSS, running JS
Stylesheets attach rules to that tree — colors, layout, spacing — and any <script> tags run, often reaching into the tree themselves to add, remove or change elements after the fact. What you see is never just the original HTML.
Step 8
Now you can see it
The browser turns that styled tree into pixels and paints it on screen. This entire sequence — connect, request, respond, parse, style, script, paint — repeats for every image, font and script the page needs, usually dozens of times per load.