Web Foundations and Internet Architecture

Introduction

The web is one of the most influential applications of computer networking. It enables users to retrieve documents, execute software, communicate, shop, learn, and access distributed services through a common set of technologies. Although the web is often treated as synonymous with the Internet, the two are different. The Internet is a global network of interconnected networks, whereas the World Wide Web is a distributed information system that operates over the Internet using technologies such as URLs, HTTP, HTML, CSS, and JavaScript.

A web application developer must understand what happens between entering a web address and seeing an interactive page. That process involves domain-name resolution, network routing, transport protocols, security mechanisms, server software, application logic, data storage, browser rendering, and state management. These foundations support later study of front-end development, back-end programming, databases, cloud deployment, and web security.

Learning Objectives

After completing this chapter, you should be able to:

• distinguish the Internet from the World Wide Web;
• explain client–server and layered network architectures;
• interpret URLs, domain names, DNS records, and hosting arrangements;
• describe the roles of TCP/IP, HTTP, and HTTPS;
• trace a browser request–response cycle;
• interpret common HTTP status codes and headers;
• explain cookies, sessions, caching, and browser rendering;
• describe major stages in the evolution of the Web;
• evaluate practical, security, performance, accessibility, and governance concerns in web systems.

1. Internet, Web, and Related Terminology

The Internet is a worldwide system of interconnected networks that exchange data using the Internet protocol suite. It includes private networks, public access networks, mobile networks, data centres, undersea cables, routers, and connected devices.

The World Wide Web is a hyperlinked system of resources identified by URLs and transferred primarily with HTTP or HTTPS. A web resource may be an HTML document, image, stylesheet, video, JSON response, or executable web service.

Important distinctions include:

Email, file transfer, voice-over-IP, and streaming are Internet services, but they are not themselves the Web.

2. A Layered View of Web Communication

Web communication is easier to understand when separated into layers. Each layer provides services to the layer above it and hides implementation details below it.

1. Application layer: HTTP, DNS, SMTP, and other application protocols.
2. Transport layer: TCP provides reliable ordered delivery; UDP provides lightweight datagrams without TCP’s delivery guarantees. Modern HTTP/3 uses QUIC, which operates over UDP while implementing reliable, encrypted transport features.
3. Internet layer: IP provides addressing and routing between networks. IPv4 uses 32-bit addresses; IPv6 uses 128-bit addresses.
4. Link and physical layers: Ethernet, Wi-Fi, fibre, radio, and other technologies move frames or signals across a local medium.

A message is encapsulated as it moves down the sending stack and decapsulated as it moves up the receiving stack. This modular design allows, for example, HTTP to operate over different physical networks without changing its basic semantics.

Client–Server Computing

In the client–server model, a client requests a service and a server provides it. A browser is a client, while a web server listens for requests and sends responses. The server may invoke application code, query a database, access a cache, or call another service before responding.

The model is not always a simple two-machine arrangement. A production application commonly contains a browser, DNS service, content-delivery network, reverse proxy, web server, application server, cache, database, and external services. Such systems are distributed and may scale horizontally by adding server instances.

Client–server systems provide centralised control and shared services, but they also introduce latency, dependency on network availability, server capacity constraints, and security responsibilities. A browser can perform substantial processing, yet it should not be assumed that client-side validation or computation is trustworthy because users control the client environment.

Figure: A simplified client–server path for a web request.

3. URLs, Domain Names, DNS, and Hosting

A Uniform Resource Locator (URL) identifies both a resource and the method by which it may be accessed. Consider:

https://shop.example.com:443/products/item?id=42#reviews

Its components are:

• https: the scheme or protocol;
• shop: a subdomain;
• example.com: the domain name;
• 443: an explicit port, although it is the default port for HTTPS;
• /products/item: the path;
• ?id=42: the query string;
• #reviews: a fragment interpreted by the client, normally not sent to the server.

A URL is a particular kind of Uniform Resource Identifier (URI). A domain name is a human-readable label, not the physical location itself. DNS translates names into records, commonly including IP addresses.

Domain Name System

DNS is a distributed, hierarchical naming system. A browser or operating system may consult a local cache, then a recursive resolver. If necessary, the resolver consults root servers, the appropriate top-level-domain servers, and authoritative name servers. Frequently used record types include:

DNS answers have a time to live (TTL), which controls how long a resolver may cache an answer. DNS improves usability and allows infrastructure changes, but DNS is not inherently proof of application identity; HTTPS certificate validation provides an additional identity check.

Hosting

Hosting is the provision of computing, storage, networking, and operational services for making a website or application available. Common models include shared hosting, virtual private servers, dedicated servers, containers, platform-as-a-service, serverless platforms, and cloud infrastructure. A site may use a content-delivery network (CDN) to cache static content near users and reduce latency.

Hosting decisions involve cost, availability, scalability, compliance, operational control, data location, backup arrangements, and vendor dependence. A domain registrar manages registration; it need not be the same organisation as the hosting provider.

4. TCP/IP, Ports, and Secure Transport

IP addresses identify interfaces or endpoints at the Internet layer, while ports identify services at a host. TCP connections are commonly represented by a combination of source address, source port, destination address, and destination port.

TCP provides connection-oriented, ordered, reliable byte-stream delivery. It uses acknowledgements, retransmission, flow control, and congestion control. TCP does not, by itself, encrypt data or prove the identity of a server.

TLS provides encryption, integrity, and authenticated server identity when correctly configured. HTTPS is HTTP carried over TLS. During a TLS handshake, the client and server negotiate cryptographic parameters, and the server presents a certificate whose name and trust chain are checked by the client. HTTPS protects data in transit but does not automatically make an application secure: injection flaws, weak authentication, unsafe authorisation, and malicious scripts remain possible.

HTTP/1.1 commonly uses persistent TCP connections. HTTP/2 supports multiplexed streams over a connection and efficient header compression. HTTP/3 uses QUIC and can reduce some transport-level delays, particularly when network conditions change.

5. The HTTP Request–Response Cycle

HTTP is a stateless application protocol: each request contains the information needed for its interpretation, although cookies and other mechanisms can connect multiple requests into an application session.

A request normally contains a method, target, protocol version, headers, and sometimes a body:

GET /courses/web HTTP/1.1
Host: university.example
Accept: text/html
Accept-Language: en

A response contains a status line, headers, and optionally a body:

HTTP/1.1 200 OK
Content-Type: text/html; charset=UTF-8
Cache-Control: max-age=300

<html>...</html>

Common methods include:

• GET: retrieve a representation; it should not intentionally change server state.
• POST: submit data or request processing, often creating a resource or triggering an operation.
• PUT: create or replace a representation at a known target; normally idempotent when designed according to HTTP semantics.
• PATCH: partially modify a resource.
• DELETE: request removal of a resource.
• HEAD: obtain headers corresponding to a GET response without the response body.

Idempotence means that repeating an operation has the same intended effect as performing it once; it does not mean that every response must be identical.

Status Codes

The distinction between 401 and 403 is important: 401 indicates that authentication is required or has failed, while 403 indicates that the server understood the request but refuses to authorise it. A 404 response may mean that the resource does not exist, or may deliberately conceal its existence.

Headers

Headers communicate metadata and control behaviour. Content-Type describes the representation format; Content-Length describes body length when supplied; Location supports redirects; Authorization carries credentials or tokens; Accept expresses preferred response formats; and Cache-Control specifies caching directives. Headers can influence security through policies such as Content-Security-Policy, Strict-Transport-Security, and X-Content-Type-Options.

6. Cookies, Sessions, and State

HTTP does not remember previous requests by default. A cookie is a small name–value record that a server asks a browser to store and return for matching requests. Attributes include Expires or Max-Age, Domain, Path, Secure, and SameSite.

A cookie marked HttpOnly cannot normally be read by client-side JavaScript, reducing some cookie-theft risks. Secure restricts transmission to HTTPS. SameSite controls cross-site sending and can reduce cross-site request forgery (CSRF) exposure. Cookies should contain minimal information; a random session identifier is generally preferable to storing sensitive personal data directly.

A session is server-side or application-level state associated with a user or client across requests. A typical login flow is:

1. The user submits credentials over HTTPS.
2. The server verifies them.
3. The server creates a random session identifier.
4. The identifier is sent in a protected cookie.
5. Subsequent requests present the cookie.
6. The server retrieves session data and applies authorisation rules.

Authentication establishes identity; authorisation determines permitted actions. Sessions require expiration, rotation after login, secure invalidation on logout, protection against fixation, and careful handling of concurrent devices.

7. Caching and Performance

Caching stores a reusable response so that a later request can be served more quickly or without contacting the origin server. Caches may exist in the browser, an intermediary proxy, a CDN, or the application itself.

Cache-Control: max-age=600 permits freshness for 600 seconds under the relevant caching rules. Validators such as ETag and Last-Modified allow conditional requests. If the stored representation remains valid, the server may return 304 Not Modified without retransmitting the full body.

Caching improves latency, reduces bandwidth, and lowers server load, but stale or incorrectly shared data can cause serious privacy and correctness problems. Personalised responses should be controlled carefully, commonly using directives such as private or no-store where appropriate. Cache keys, invalidation policy, content versioning, and variation headers must be designed deliberately.

Performance is influenced by DNS lookup, connection establishment, TLS negotiation, server processing, data transfer, browser parsing, rendering, and client-side execution. Useful practices include compressing suitable resources, reducing unnecessary JavaScript, optimising images, using semantic caching policies, and measuring real-user performance rather than relying only on laboratory tests.

8. Browser Operation and Rendering

A browser typically performs the following activities:

1. parses the URL and checks local caches;
2. resolves the domain through DNS;
3. establishes a transport and, for HTTPS, a TLS connection;
4. sends an HTTP request;
5. receives HTML and related resources;
6. parses HTML into a Document Object Model (DOM);
7. parses CSS into style information;
8. combines structure and style to form a render tree;
9. performs layout, painting, and compositing;
10. executes JavaScript, which may alter the DOM or request further resources.

The process is iterative rather than strictly one-time. CSS and JavaScript can affect layout and rendering, while images and fonts may arrive later. Browser developers must consider accessibility, responsive design, keyboard operation, performance, privacy controls, and differences among browser engines.

Server-side rendering generates HTML before transmission. Client-side rendering sends a relatively small initial document and constructs much of the interface in the browser. Hybrid and streaming approaches combine these strategies. The appropriate choice depends on application requirements, search visibility, time to usable content, development complexity, and device capabilities.

9. Evolution of the Web

The early Web, proposed by Tim Berners-Lee at CERN, combined hypertext with Internet networking. Early sites were primarily static documents. Web standards and browsers later enabled forms, scripting, multimedia, and dynamic server-generated pages.

The often-used term Web 1.0 describes largely read-oriented publishing. Web 2.0 describes more interactive, participatory services involving user-generated content, social platforms, asynchronous requests, and rich browser applications. These labels are informal rather than precise technical standards.

Modern web development includes responsive interfaces, APIs, progressive web applications, real-time communication, cloud platforms, edge computing, and component-based front-end frameworks. WebAssembly permits certain compiled languages to run in browsers under a controlled execution model. Artificial intelligence is increasingly integrated through recommendation, search, accessibility, content generation, and developer tooling, but these uses require attention to privacy, bias, security, intellectual property, and reliability.

The Web is also moving toward stronger privacy protections, passkeys, HTTP/3 adoption, edge delivery, and improved accessibility. Interoperability remains essential: applications should rely on open standards rather than assuming a single browser, device, or vendor.

10. Security, Ethics, and Governance

Web security is a system property, not merely an encryption feature. Developers should use HTTPS, validate input on the server, encode output according to context, enforce authorisation on every protected operation, store passwords with modern password-hashing algorithms, and manage secrets outside source code.

Common threats include cross-site scripting (XSS), SQL injection, CSRF, broken access control, insecure file handling, credential theft, denial-of-service, and supply-chain compromise. Security headers, dependency updates, logging, monitoring, backups, incident response, and threat modelling support defence in depth.

Privacy obligations vary by jurisdiction, but responsible systems should collect only necessary data, state purposes clearly, obtain valid consent where required, limit retention, protect data, and provide appropriate user rights. Accessibility is both an ethical responsibility and, in many contexts, a legal obligation. Semantic HTML, text alternatives, sufficient contrast, keyboard support, captions, and predictable interaction are core design practices.

Applied Case: Illustrative University Course Portal

Background

A university deploys a portal at https://portal.university.example where students view courses, register for classes, and download timetables.

Problem

Users report slow page loads during registration, occasional stale course availability, and concern that a student might access another student’s timetable by changing an identifier in a URL.

Analysis

DNS directs the portal name to a CDN or load balancer. Static JavaScript, CSS, and images can be cached, but registration availability is dynamic and must not be served as stale shared content. The application must verify the authenticated session and authorisation on the server rather than trusting a student identifier supplied by the browser. Peak traffic requires capacity planning, database indexing, rate limiting, and monitoring.

Approach and Solution

The university uses HTTPS, secure and HttpOnly session cookies, short session lifetimes, and re-authentication for sensitive changes. Static assets receive versioned URLs and long cache lifetimes. Registration responses use conservative caching directives. The application obtains the student identity from the authenticated session, checks course permissions, and returns 403 Forbidden when access is denied. A CDN serves public assets, while application servers remain behind a load balancer. Performance dashboards track response time, error rate, cache hit rate, and database load.

Outcome

Static traffic is served close to users, reducing origin load. Dynamic registration information remains current. Server-side authorisation prevents identifier manipulation from exposing another student’s data. Monitoring allows operators to detect capacity and security problems during registration periods.

Learning Points

Performance optimisation must not compromise correctness or privacy. Caching policy depends on the sensitivity and volatility of data. Authentication is not sufficient without authorisation, and client-supplied identifiers must never be trusted as proof of entitlement.

Challenges and Limitations

Web architecture involves unavoidable trade-offs. Distributed deployment improves availability but increases operational complexity. Caching improves speed but risks staleness. Client-side computation improves responsiveness but can increase bundle size and expose logic to inspection. Third-party services simplify development but create supply-chain, privacy, availability, and vendor-lock-in risks. HTTPS protects network transport but cannot correct faulty application logic. Finally, standards evolve, and developers must test interoperability rather than relying on assumptions.

Chapter Summary

The Internet is a global network infrastructure, while the Web is a resource-sharing system built primarily on HTTP and HTTPS. Web applications use layered protocols: DNS resolves names, IP routes packets, transport protocols provide communication services, and HTTP exchanges representations. URLs identify resources and contain scheme, host, path, query, and fragment components. Browsers act as clients; servers and supporting services process requests and return responses.

HTTP methods express intended operations, status codes communicate outcomes, and headers provide metadata and control. Cookies and sessions supply application state over an otherwise stateless protocol. Caches improve performance but require careful freshness, privacy, and invalidation policies. Browsers parse, execute, and render resources through DOM, style, layout, paint, and compositing stages. Contemporary web systems combine servers, databases, CDNs, APIs, cloud services, and increasingly edge and AI capabilities. Secure, accessible, private, interoperable, and measurable design is essential for professional web development.

Key Terms

Internet: Global interconnection of networks using Internet protocols.

World Wide Web: Hyperlinked information system operating over the Internet.

Client: Software or device that requests a service.

Server: Software or device that provides a network service.

Protocol: Rules governing communication between systems.

URL: Address identifying a resource and access scheme.

Domain name: Human-readable name used in network addressing.

DNS: Distributed system that maps domain names to records.

Hosting: Provision of infrastructure for serving applications or resources.

IP: Internet-layer protocol for addressing and routing.

TCP: Reliable, ordered transport protocol based on a byte stream.

TLS: Protocol providing encrypted and authenticated communication.

HTTP: Application protocol for exchanging web requests and responses.

Status code: Numeric response classification indicating processing outcome.

Header: Metadata field controlling or describing a message.

Cookie: Browser-stored data returned with matching requests.

Session: State associated with a client across multiple requests.

Cache: Storage of reusable responses for faster subsequent access.

DOM: Programmatic tree representation of an HTML document.

CDN: Distributed infrastructure that delivers content near users.

Review Questions

Short Answer Questions

1. What is the difference between the Internet and the World Wide Web?
2. Identify the main components of a URL.
3. What service does DNS provide?
4. Why is HTTPS different from HTTP over an unprotected connection?
5. What is the purpose of an HTTP status code?

Long Answer Questions

1. Explain the client–server model and describe how a modern web application may involve more than one server component.
2. Describe the complete browser request–response cycle, from entering a URL to rendering a page.
3. Compare TCP, IP, HTTP, and TLS by describing the problem each technology addresses.
4. Explain cookies, sessions, authentication, and authorisation, including important security controls.
5. Discuss the benefits and risks of caching in a web application.

Analytical / Application Questions

1. A website displays old inventory data after a product sells out. Analyse how DNS caching, browser caching, CDN caching, and application caching could contribute, and propose a correction.
2. A student changes /timetable/1842 to /timetable/1843 and sees another student’s timetable. Identify the security failure and design an appropriate server-side solution.
3. Design a high-level architecture for a globally accessed news site. Justify your choices concerning DNS, HTTPS, CDN placement, dynamic content, caching, monitoring, and availability.

Multiple Choice Questions with Answers

Question 1

Which statement best distinguishes the Internet from the World Wide Web?

A. The Internet is a global network infrastructure, while the Web is a service operating over it.

B. The Web provides physical cables, while the Internet provides HTML documents.

C. They are two names for exactly the same technical system.

D. The Internet is limited to browsers, while the Web includes email.

Correct Answer: A. The Internet is a global network infrastructure, while the Web is a service operating over it.

Question 2

What is the primary purpose of DNS?

A. To encrypt HTTP messages

B. To map domain names to network records such as IP addresses

C. To render HTML documents

D. To store browser cookies

Correct Answer: B. To map domain names to network records such as IP addresses

Question 3

Which URL component normally identifies a specific resource location on a host?

A. Scheme

B. Fragment

C. Path

D. Port protocol version

Correct Answer: C. Path

Question 4

Which HTTP status code indicates that a request succeeded and a new resource was created?

A. 200

B. 201

C. 301

D. 404

Correct Answer: B. 201

Question 5

What is the usual distinction between HTTP 401 and HTTP 403?

A. 401 concerns authentication; 403 indicates refusal to authorise the request.

B. 401 means server failure; 403 means successful creation.

C. 401 is a redirect; 403 means the resource was permanently moved.

D. There is no distinction in HTTP semantics.

Correct Answer: A. 401 concerns authentication; 403 indicates refusal to authorise the request.

Question 6

Which cookie attribute restricts a cookie to transmission over HTTPS?

A. HttpOnly

B. SameSite

C. Secure

D. Max-Age

Correct Answer: C. Secure

Question 7

What does an ETag commonly support?

A. Conditional requests and validation of cached representations

B. Conversion of domain names into IP addresses

C. Password hashing

D. HTML layout calculation

Correct Answer: A. Conditional requests and validation of cached representations

Question 8

Which statement about TCP is correct?

A. It is an application-layer markup language.

B. It provides reliable, ordered byte-stream delivery.

C. It authenticates every web application user.

D. It replaces DNS records.

Correct Answer: B. It provides reliable, ordered byte-stream delivery.

Question 9

Why must authorisation be enforced on the server?

A. Because browser code and submitted identifiers are under the user’s control.

B. Because browsers cannot display secure pages.

C. Because DNS cannot resolve private domains.

D. Because HTTP has no status codes.

Correct Answer: A. Because browser code and submitted identifiers are under the user’s control.

Question 10

Which browser structure represents an HTML document as a programmable tree?

A. TLS certificate

B. DNS zone

C. Document Object Model

D. Transport control block

Correct Answer: C. Document Object Model