Try for free
DiscoverMobile appPricingFor schoolsHelpLogin
← Back to quizzesFree quiz

Fundamentals of the Web and HTML

Many beginners confuse the terms Internet and Web . While they are closely related, they refer to distinct layers of the global network.

10 questions~5 min
Fundamentals of the Web and HTML — Qwi
0 / 10
Score: 0%
1

Which of the following best describes the relationship between Internet and the Web?

2

In the HTTP request/response cycle, which component initiates the request?

3

Which HTML tag is used to define a paragraph and must be closed with a matching end tag?

4

What is the primary purpose of the tag in an HTML document?

5

During the indexing phase of a search engine, what type of data is primarily stored?

6

Which of the following statements about cookies is accurate?

7

In HTML, which tag creates a hyperlink that opens the page "http://www.monlycee.net" when clicked?

8

Which HTML element defines the head section of a page and typically contains metadata such as charset and title?

9

What distinguishes a block‑level element from an inline element in HTML layout?

10

Which of the following best describes the three main phases of a search engine's operation?

Understanding the Internet and the World Wide Web

Many beginners confuse the terms Internet and Web. While they are closely related, they refer to distinct layers of the global network.

  • Internet: The physical infrastructure – cables, routers, and protocols – that transports data between computers worldwide.
  • Web (World Wide Web): An application layer that runs on top of the Internet, using the HTTP protocol to deliver hypertext documents (web pages) to users.

Think of the Internet as the highway system and the Web as the fleet of cars that travel on those highways delivering passengers (information) to destinations.

HTTP Request/Response Cycle

The communication between a web browser and a server follows a simple but powerful pattern.

Who initiates the request?

The client – typically a web browser – sends an HTTP request to a server. The server then processes the request and returns an HTTP response containing the requested resource (HTML, CSS, JSON, etc.).

  • Client side: Generates the request, includes method (GET, POST), URL, headers, and optionally a body.
  • Server side: Receives the request, performs the necessary logic, and sends back a response with a status code (200 OK, 404 Not Found, etc.).

Understanding this flow is essential for debugging, building APIs, and optimizing page load times.

Core HTML Elements You Must Know

Paragraph Tag (<p>)

The paragraph element defines a block of text. It must be opened with <p> and closed with </p>. Example:

<p>This is a paragraph of content.</p>

Using proper closing tags ensures that browsers render the document correctly and improves accessibility.

Linking an External Stylesheet

The <link rel="stylesheet" href="style.css"> tag connects an external CSS file to the HTML document. This tag belongs in the <head> section and tells the browser where to find the visual styling rules.

<head>
  <link rel="stylesheet" href="style.css">
</head>

Separating style from content makes maintenance easier and improves page load performance because browsers can cache the CSS file.

Defining the Head Section

The <head> element contains metadata about the page, such as character encoding, title, and links to external resources.

<head>
  <meta charset="UTF-8">
  <title>My Web Page</title>
  <link rel="stylesheet" href="style.css">
</head>

Properly structured head information helps search engines index your page and improves SEO.

Creating Hyperlinks

To make a clickable link that opens http://www.monlycee.net, use the anchor tag:

<a href="http://www.monlycee.net">Cliquez ici</a>

The href attribute holds the destination URL, while the text between the opening and closing tags is what users see.

Mnemonic: A for Anchor → <a href="URL">text</a>. If you want something to be clickable, think <a>, not <link>, <script>, or <img>.

Search Engine Indexing Basics

When a search engine crawls the web, it stores data in an inverted index. This structure maps significant words (tokens) to the URLs where they appear, enabling fast retrieval of relevant pages during a query.

  • Only essential terms are indexed – stop words ("the", "and", etc.) are usually ignored.
  • Metadata such as title tags, headings, and alt attributes are given extra weight.
  • Full HTML source is rarely stored; instead, the engine extracts and normalizes text content.

Optimizing your HTML for search engines means using clear headings, descriptive meta tags, and meaningful link text.

Cookies: Small Files with Big Impact

Cookies are tiny text files saved on a user's device by a web server. They enable the server to remember stateful information across multiple requests.

  • Purpose: Session management (login status), personalization, and tracking user preferences.
  • Security note: Cookies are not a secure storage mechanism for passwords; they should contain only non-sensitive identifiers.
  • Size limit: Typically 4KB per cookie, with a maximum number of cookies per domain.

Proper cookie handling improves user experience and is a key factor in compliance with privacy regulations (GDPR, CCPA).

Putting It All Together: A Sample HTML Document

Below is a minimal, well‑structured HTML5 page that incorporates the concepts discussed.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Fundamentals of the Web</title>
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <h2>Welcome to the Web</h2>
    <p>The Internet provides the infrastructure; the Web delivers content.</p>
    <a href="http://www.monlycee.net">Visit Monlycee</a>
  </body>
</html>

Notice the clear separation of concerns: metadata in <head>, styling linked via <link>, and content placed inside <body> using semantic tags.

SEO Best Practices for Beginners

To make your pages rank higher in search results, follow these simple guidelines:

  • Use descriptive, keyword‑rich titles: The <title> tag should accurately reflect the page’s content.
  • Structure content with headings: <h2>, <h3>, etc., help both users and crawlers understand hierarchy.
  • Include meta descriptions: Although not a ranking factor, they improve click‑through rates.
  • Optimize images with alt attributes: Provides context for screen readers and search bots.
  • Leverage internal linking: Use clear anchor text (<a>) to connect related pages.
  • Minimize page load time: Link external CSS early, defer non‑critical JavaScript, and enable caching.

Implementing these practices from the start will give your site a solid foundation for long‑term visibility.

Key Takeaways

  • The Internet is the underlying network; the Web is an application that uses HTTP to deliver content.
  • Clients (browsers) initiate HTTP requests; servers respond with the requested resources.
  • Use <p>...</p> for paragraphs, <link rel="stylesheet"> for CSS, and <a href="URL"> for hyperlinks.
  • Search engines store significant words in an inverted index, not the full HTML source.
  • Cookies are small text files that preserve session data; they are not secure storage for passwords.
  • Proper <head> metadata and semantic HTML improve SEO and accessibility.

Mastering these fundamentals equips you to build robust, searchable, and user‑friendly web pages.