How Websites Work: Browsers, Servers, URLs, and HTML

When you open a website address, the browser asks a server for a document. The server sends a response, often including HTML, and the browser reads it and requests pictures, CSS, and other needed files.

What You Need to Know

A local file skips the internet request: the browser reads it directly from your computer. This is a good way to practice, but features requiring a server work differently.

The goal is not to collect as many tags as possible. Pick the element that best describes what the content really is.

Example: See It in Action

Take a look at this small piece of HTML. You can use it in a practice document and change the text to make it your own.

<!doctype html>
<html lang="en">
    <head><title>My website</title>
    </head>
    <body>
        <h1>Hello from the browser!</h1>
    </body>
</html>

Let’s Understand the Example

• The html element holds the complete page and usually names its language.
• The head contains useful page information for the browser, such as its title and character encoding.
• The title names the page in the browser tab. It is different from the heading shown on the page.
• Lang tells tools which language the text uses, helping pronunciation and language-aware features.

Some of the markup affects the browser tab or page settings rather than appearing as visible text. Check the browser tab and inspector as well as the page itself.

What Should You See?

The browser tab should show “My website”. The page itself shows “Hello from the browser!” as a heading; those two labels are allowed to be different.

Read only the headings, from top to bottom. Do they tell a sensible story? If not, move sections or choose levels that match the content.

Try It Yourself

1. Open a local file, then open the same page through a local development server and compare the address bar.
2. Save your changes, open or refresh the page, and compare the result with the original example.
3. Tell a friend what your change did. If you are not sure, undo it, refresh the page, and compare.

Common Beginner Mistakes

• Confusing a file on your computer with a page already published on the internet.
• Avoid picking tags just for their default bold, italic or spaced appearance. Use CSS for presentation.

Key Takeaways

• When you open a website address, the browser asks a server for a document.
• The html element holds the complete page and usually names its language.
• A local file skips the internet request: the browser reads it directly from your computer. This is a good way to practice, but features requiring a server work differently.