TL;DR:
Your browser turns the name in the address into a number (DNS), asks the server for the page (a request), and receives HTML back (the response).
HTML gives the page its structure, CSS its look and JavaScript its behaviour. The HTML usually triggers more requests for these and for images.
Status codes tell you how a request went: 200 means success and 404 means not found.
You type an address, press enter, and a second later a page is on your screen. In that second your computer talked to several other machines, got back text, and turned the text into pixels. None of it is magic. It is a sequence of small, ordinary steps, and you can see most of them yourself.
The idea in plain words
The web is a conversation between two programs. The browser on your computer is the client. A server somewhere else holds the site's files and answers requests. They talk using HTTP, a set of rules for asking for things and replying. The secure version, HTTPS, is the same conversation inside an encrypted connection.
Why there are several steps
Computers on the internet find each other by numbers called IP addresses, but people prefer names. So the first thing the browser has to do is turn a name into a number. After that it can open a connection, ask for the page, and read the answer. Each step solves one problem, and each one can be examined separately.
Worked example: typing an address and pressing enter
Say you type https://example.com/ and press enter.
Read the address: The browser splits it into the protocol (https), the host name (example.com) and the path (/).
Look up the host (DNS): The Domain Name System works like a phone book. The browser asks a DNS service for the IP address that goes with example.com. It may remember a recent answer so that it does not need to ask again.
Open a connection: The browser connects to that IP address. For HTTPS, the two sides also agree on encryption keys, so what follows cannot be read in transit.
Send the request: The browser sends a short message asking for the page.
Receive the response: The server replies with a status code and the page's HTML.
Fetch the rest and draw: The browser reads the HTML, finds links to CSS, JavaScript and images, requests those too, then lays out and paints the page.
The request in step 4 looks like this in its simplest form.
GET / HTTP/1.1
Host: example.comGET means 'send me this'. / is the path. The Host line says which site on that server you want. The reply begins like this.
HTTP/1.1 200 OK
Content-Type: text/html
<!doctype html>
<html> ... </html>The number 200 is the status code: 200 means success. A page that does not exist would give 404, and a server fault would give a code starting with 5. After the blank line comes the page itself.
HTML, CSS and JavaScript
HTML describes the structure and content: headings, paragraphs, links, images.
CSS describes how it looks: colours, fonts, spacing, layout.
JavaScript adds behaviour: menus that open, forms that check themselves, content that updates without reloading.
A good way to remember it: HTML is the skeleton, CSS the clothes, JavaScript the movement. Most pages need many requests, one for the HTML and more for each style file, script and image, which is why a page can load in stages.
What the server does
Sometimes the server just finds a file and sends it, as with a plain HTML page. Often it runs a program first. The program may look up your account in a database, fill a template with the results, and send back HTML built just for you. From the browser's side the two cases look identical: a request goes out, a response comes back.
That is also why a page can change without reloading. JavaScript on the page can send further requests in the background and update part of the page with the replies.
What the browser remembers
To save time, the browser keeps copies of files it has fetched, such as images and style sheets, in a cache. On a second visit it may reuse them instead of asking again. A website can also store small pieces of text called cookies in your browser, which are sent back with later requests so the site can recognise you between pages. Neither changes the basic conversation. They only reduce how often it has to happen.
See it yourself
Every major browser has developer tools, usually opened from its menu or with a keyboard shortcut. The Network panel lists each request, its status code and its size. Reload a page with the panel open and you can watch the steps above happen.
How to check your answer
Can you put the steps in order: DNS, connect, request, response, render?
Can you say what each file type does: HTML structure, CSS style, JavaScript behaviour?
Do you know what 200 and 404 mean?
Can you explain why the browser makes more than one request for one page?
Common mistakes
Thinking the internet and the web are the same thing. The web is one service that runs on the internet.
Thinking DNS fetches the page. It only supplies the address.
Thinking the whole page arrives in one piece. It arrives as HTML plus many other files.
Thinking HTTPS means the site is trustworthy. It means the connection is encrypted, not that the site is honest.
Where you will use it next
With this picture, topics like web servers, APIs and web security have a place to sit. The data a server returns often comes from a database, as in what a database is and how a query works. To practise writing the code that makes pages respond, see variables, loops and conditionals in Python.
Frequently asked questions
What is the difference between a URL and a domain name?
The domain name is just the host part, like example.com. The URL is the full address, including the protocol and path.
Why do pages sometimes load slowly?
Any step can be slow: the DNS lookup, the connection, the server's work, or the size of the files.
Get started
