Skip to content
THE INTERNET MACHINE
The Internet
Machine
Module
01/04

THE VISIBLE WORLD

01FRONTEND

Why can we see a website at all?

MODULE 01/04 · THE VISIBLE WORLD

Why can we see a website at all?

FRONTEND

Every button, every letter and every color you see on screen is assembled from three languages that each do a different job. This book takes a web page apart piece by piece — then has you put it back together with your own hands.

When you finish, you’ll understand

  • What HTML, CSS and JavaScript each do
  • How a browser turns a text file into a picture on the screen
  • Why the same page fits both a phone and a big monitor
  • How a web page “listens” to what we click

The world of this book

A world of shapes, colors and pieces on the screen

Who it’s for

Start right away, even if you have never seen code before

Checking your access

Contents

7 chapters

  1. 01A web page is made of three materials“If you pulled a web page apart, what would you find inside?”Meet HTML, which says what is on the page, CSS, which says what it looks like, and JavaScript, which makes it respond — by building one real web page yourself.Lab 01: The web page playgroundFree · 18 min
  2. 02How a browser reads a page“How does plain text in a file become a picture on the screen?”Follow the journey from an HTML file arriving on your device, to a DOM tree, to pixels painted on the screen one by one.Checking your access
  3. 03Everything on screen is a box“Why do web designers see everything as rectangles?”The box model, margins, padding, and the Flexbox and Grid layout systems that line pieces up neatly.Checking your access
  4. 04Small screens, big screens, one page“How does a web page know you are on a phone?”Responsive design and media queries — the techniques that make one page fit every screen size.Checking your access
  5. 05A page that listens“When we press a button, how does the page know?”Events, the DOM and state — how JavaScript waits for what the user does and changes the screen to match.Checking your access
  6. 06The building blocks of a page“How do huge sites with thousands of pages keep every page consistent?”The idea of components, and why tools like React were created.Checking your access
  7. 07A web for everyone“How do people who cannot see the screen use a website?”Accessibility and speed — the two things that separate a good website from one that is merely pretty.Checking your access