How the Web Moves a Page

A request begins with an address

A web address, often called a URL, tells a browser where to look for a resource and which protocol to use. When a person enters an address, the browser separates the host name from the path and prepares to contact the relevant server.

The host name is useful to people, but networks route traffic using IP addresses. The Domain Name System (DNS) provides the translation between a name and one or more addresses.

Finding the server

The browser asks a DNS resolver for the address associated with the host name. The resolver may already have a cached answer. Otherwise, it follows the DNS hierarchy until it can return an answer or report that no record exists.

With an address available, the browser can establish a network connection. For HTTPS, it also negotiates an encrypted session using Transport Layer Security (TLS). The certificate helps the browser verify that it is communicating with a server authorised for the requested domain.

Requesting a resource

Once the connection is ready, the browser sends an HTTP request. A simple page load commonly begins with a request for an HTML document. The server responds with a status code, headers and a response body.

The HTML describes the page structure. It can refer to additional resources such as stylesheets, scripts, fonts and images. The browser requests those resources as needed and combines them to render the page.

A page is a collection of resources

A modern page is rarely a single file. The browser may make several requests, reuse cached resources and progressively display content as it becomes available. A stylesheet controls presentation, while JavaScript can add behaviour or update parts of the page.

Caching can reduce repeat work. If a resource has not changed, the browser may reuse a local copy or ask the server whether its cached copy is still valid.

The useful mental model

A web page appears simple on screen, but it is the result of several cooperating systems: naming, routing, transport security, HTTP and browser rendering. Understanding these layers makes common problems easier to diagnose. A DNS problem occurs before the browser reaches the server; a certificate problem occurs during secure connection setup; and a missing image may be an issue with an individual resource rather than the page itself.