How a Web Page Reaches Your Screen

Every day you might open your school website to check exam announcements or the activity schedule. Have you ever wondered what really happens when you type a site address and press Enter? In this module we take that process apart.

Step by step

1. You type an address (URL), for example www.smpnusantara.sch.id/pengumuman. A URL is the full address of a page, much like the home address of a friend.
2. The browser sends a request to another computer that stores the site. This computer is called a server.
3. The server sends files back to the browser: an HTML file, CSS files, images, and sometimes JavaScript files.
4. The browser reads those files and draws the page on your screen. A browser is an app such as Chrome, Firefox, Edge, or Safari.

The three languages of the web

Imagine building a new classroom:

• HTML (HyperText Markup Language) is the frame of the building: walls, doors, the whiteboard. HTML decides the content and structure, for example which part is a heading, which is a paragraph, which is an image.
• CSS (Cascading Style Sheets) is the paint, the decorations, and how the desks are arranged. CSS decides the appearance: colours, font sizes, spacing, and position.
• JavaScript is the electricity and switches that make things move or react. You will learn JavaScript in a later course.

In this course you focus on HTML and CSS. Neither is a programming language that calculates or makes decisions; they are languages for structuring and styling a page.

Peek at the code of a page

Open any website in a desktop browser and press Ctrl + U. A new tab appears full of text with angle brackets such as <h1> and <p>. That is the HTML code the server sent. Every website, however big, is built on the same foundations you are about to learn.

The key idea: the browser requests files from a server, then turns the HTML and CSS into a page you can see.