How the Web Works

Understanding the Web

The World Wide Web connects browsers and web servers, allowing webpages and other resources to be requested, transferred, and displayed across the Internet.

When you enter a web address or follow a link, several technologies work together behind the scenes. The browser locates the appropriate web server, requests the resource, receives the necessary files, and uses HTML, CSS, JavaScript, images, and other resources to display the webpage.

The Internet & the Web

The Internet and the World Wide Web are related, but they are not the same thing. The Internet is the global network that connects computers and other devices, while the World Wide Web is a system of webpages and resources that can be accessed over that network.

The web uses Internet technologies to allow browsers and servers to communicate. Other services, such as email, also use the Internet but are not part of the World Wide Web itself.

Web Browsers

A web browser is software used to request, interpret, and display webpages. Common browsers include Chrome, Firefox, Edge, and Safari.

When a browser receives the files that make up a webpage, it interprets the HTML to determine the structure of the content, applies CSS to control its presentation, and executes JavaScript when interactive behavior is required.

The browser also requests additional resources referenced by the webpage, such as images, stylesheets, scripts, fonts, audio, and video.

Web Servers

A web server stores or provides websites and other web resources and responds to requests from browsers. The term can refer to the computer providing the resources, the server software handling requests, or both.

When a browser requests a webpage, the server processes the request and sends an HTTP response. For a basic HTML page, that response may contain the requested HTML document. Other requests may return stylesheets, images, scripts, data, or other resources.

For example, a server hosting www.example-web.site could receive a request for a page such as:

https://www.example-web.site/about.html

URLs & Web Addresses

A URL, or Uniform Resource Locator, identifies the location of a resource on the web. URLs can identify webpages, images, stylesheets, scripts, downloadable files, and many other resources.

Consider this URL:

https://www.example-web.site/tutorials/html.html

The URL contains several important parts:

• https identifies the protocol used to access the resource.
• www.example-web.site identifies the host.
• /tutorials/html.html identifies the path to the requested resource.

URLs can contain additional components, including port numbers, query strings, and fragments, which you will encounter later when learning more about links and web addresses.

Domain Names & DNS

Computers communicate across networks using numerical IP addresses, but domain names provide people with easier-to-remember names for Internet resources. The Domain Name System (DNS) helps translate domain names into the information needed to locate the appropriate server.

When you visit www.example-web.site, DNS resolution helps the browser determine where to send the request. The browser can then establish a connection with the server responsible for the website.

DNS is therefore similar to a directory: you provide a domain name, and DNS helps locate the network address associated with that name.

HTTP & HTTPS

HTTP, or Hypertext Transfer Protocol, defines how web clients and servers exchange requests and responses. When a browser asks a server for a webpage or another resource, HTTP provides the rules used for that communication.

HTTPS is HTTP used over an encrypted connection provided by TLS. Encryption helps protect information exchanged between the browser and server from being read or modified while it travels across the network.

http://www.example-web.site/

https://www.example-web.site/

Modern websites should generally use HTTPS to provide secure communication between visitors and the web server.

The Request & Response Process

Loading a webpage involves a series of requests and responses between the browser and web servers. Although the process can become complex, the basic sequence is straightforward.

1. You enter a URL or follow a link.
2. The browser determines where the website is located, using DNS when necessary.
3. The browser establishes a connection with the server.
4. The browser sends an HTTP request for the resource.
5. The server processes the request.
6. The server sends an HTTP response containing a status code, headers, and usually the requested content.
7. The browser processes the response and begins displaying the webpage.
8. The browser requests additional resources referenced by the page as needed.

This process happens very quickly, and a typical webpage may require many separate requests before all of its resources have finished loading.

How the Browser Builds a Webpage

After receiving an HTML document, the browser parses the markup and creates an internal representation of the document called the Document Object Model (DOM). The DOM represents the HTML document as a structured collection of related objects.

The browser also processes CSS and combines information about the document and its styles to determine how the page should be displayed. JavaScript can interact with the DOM and other browser features to change content, respond to user actions, and provide interactive behavior.

A simple HTML document might begin like this:

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Example Web</title>
  </head>
  <body>

    <h1>Welcome to Example Web</h1>

    <p>This webpage was created with HTML.</p>

  </body>
</html>

The browser interprets this markup as a document containing metadata, a heading, and a paragraph, and then displays the resulting webpage to the visitor.

Summary

The World Wide Web works through communication between browsers and web servers over the Internet. URLs identify resources, DNS helps locate servers, and HTTP or HTTPS provides the rules used to exchange requests and responses.

After a browser receives an HTML document, it processes the markup and any related CSS, JavaScript, images, and other resources needed to build and display the webpage. Understanding this basic process provides useful context for learning how HTML fits into the larger web platform.