Home›Lesson Plans›Computer Science›Networks & the Internet · Grade 7

How a Web Page Loads

Seventh graders trace what happens in the second between pressing enter and seeing a page, as the browser finds a server, asks for files, and assembles them into what you see, then put the steps in order.

Grade 7How a Web Page Loads50 minutes1 class periodUse → Modify → CreateExplicit teaching4 StandardsCSTA
Start the Lesson
Assign or share this lesson
Share to Google Classroom Share to Microsoft Teams

Copy link works with Canvas, Schoology, Moodle and any other LMS — paste it in as a resource or assignment.

Lesson at a Glance

Everything you need before the bell rings

Learning Objectives

Students will be able to…

  • ✓See how a page loads.
  • ✓Know the role of DNS.
  • ✓Follow request and response.
  • ✓Order the steps.
Essential Question

You press enter and a full page appears almost instantly, but a lot happened in that second. What are the steps between your keypress and the page on screen?

0
Lesson Phases
0
Vocabulary Terms
0
Standards Aligned
0
Interactive Task
Order the Steps · Interactive

Order the Steps

Project this and put the steps a web page takes to load in order — tap each one from pressing enter to seeing the page.

🌐 Put the steps of loading a web page in orderTry it
Tap the steps a web page takes to load in order, starting the moment you press enter.
The Lesson · Use → Modify → Create (a coding progression with Unplugged practice)

50 minutes, five moves

Tap any phase to open the teacher moves and student actions.

1

Hook — Enter to Page in a Second

5 min

You type an address, press enter, and a full page appears almost instantly. A lot happened in that second. What are the steps between your keypress and the page?

👩‍🏫 Teacher Moves

  • Ask what happens after enter.
  • Collect guesses.
  • Set the goal.

🎒 Student Actions

  • Think.
  • Share.
  • Get ready.
2

Use — Order the Steps

12 min

Students put the page-loading steps in order.

👩‍🏫 Teacher Moves

  • Send students to Order the Steps.
  • Order the steps.
  • Name each one.

🎒 Student Actions

  • Order.
  • Say.
  • Note it.
3

Modify — Who Does What?

13 min

Students name what handles each step.

👩‍🏫 Teacher Moves

  • Pick a step.
  • Say which computer handles it.
  • Say what it does there.

🎒 Student Actions

  • Pick.
  • Say.
  • Say.
4

Create — My Page-Load Map

15 min

Students diagram the journey.

👩‍🏫 Teacher Moves

  • Draw the browser and the server.
  • Add the DNS lookup between them.
  • Trace request and response with arrows.

🎒 Student Actions

  • Draw.
  • Add.
  • Trace.
5

Reflect — From Address to Screen

5 min

Students reflect on how pages load.

👩‍🏫 Teacher Moves

  • What does DNS do?
  • Why does the browser send a request to a server?
  • Complete the exit ticket.

🎒 Student Actions

  • Say it.
  • Say it.
  • Complete the exit ticket.
Standards Alignment

Built to the standards you report on

Aligned to the CSTA K-12 Computer Science Standards and ISTE Standards for Students.

CSTA
2-NI-04

Model how information is broken down, sent, reassembled, and received across networks.

CSTA
2-NI-05

Explain how physical and digital security measures protect information in transit.

CSTA
2-CS-02

Explain how devices locate and exchange information across a network.

ISTE
1.5.c

Computational Thinker: break a process into steps and model how a system works.

Differentiation

One lesson, every learner

Multilingual Learners

ELL / EMERGING READERS
  • Step picture cards.
  • Sentence frame: “First ___ , then ___ .”
  • Order two steps at a time.

Support & Access

IEP / 504
  • Start with typing and pressing enter.
  • Match each step to a computer.
  • Add one step at a time.

Stretch & Extend

GIFTED / EARLY FINISHERS
  • Add how the request and response travel in packets.
  • Compare DNS to a phone book.
  • Explain where https security fits in.
Materials

What to gather

  • 📽️Projector / board
  • 🌐Page-load step cards
  • 💻Order the Steps
  • 🖥️A browser-to-server diagram
  • ✏️Pencils
  • 🎫Exit-ticket slips
Vocabulary

Key terms — hover for a quick definition

browserthe program that requests and displays web pagesservera computer that stores a website and sends its files when askedDNSthe system that turns a web address into a server's numeric addressrequesta message a browser sends asking a server for a pageresponsethe files a server sends back to the browserHTMLthe code that describes the structure of a web pagerenderto turn page files into what you see on screenIP addressthe numeric address that identifies a server on the internet
Evaluate

Exit Ticket

Preview the three formative checks. Tap “Sample answer” to see what mastery looks like — hide them before you print for students.

QUESTION 1
What does DNS do?
It turns the web address you type into the numeric IP address of the server so the browser can reach it.
QUESTION 2
Why does the browser send a request to a server?
To ask for the files that make up the page; the server then responds with the HTML, images, and other files.
QUESTION 3
What is the last step before you see a web page?
The browser assembles the files it received and renders the page on your screen.

Create: my page-load map.

Have students draw the browser and the server, add the DNS lookup, and trace the request and response with arrows, so the hidden journey becomes visible. A printable web-page-loading worksheet is in the Computer Science library.

Study · Flashcards

Study the key terms

Tap a card to flip it, then rate whether you knew it. Built from this lesson’s vocabulary.

🃏 How a Web Page LoadsFlip
Card 1
Term
Tap to flip →
Meaning
0

Nice work!

Practice · Quiz

Check your understanding

A quick self-check with instant feedback, drawn from this lesson’s key terms.

📝 How a Web Page LoadsQuiz
Score: 0
1 / 6
Question 1
0%

Nice work!

Practice · Worksheet

Printable worksheet

A print-and-go review sheet with a built-in answer key. Tap “Show answer key” to reveal answers, or print the clean version for students.

🖨️ How a Web Page LoadsPrint
Name: ________________________
Date: ____________

Part A · Write the word that matches each meaning

Word bank: browser, DNS, HTML, IP address, render, request, response, server
  1. a message a browser sends asking a server for a page
  2. the files a server sends back to the browser
  3. to turn page files into what you see on screen
  4. the numeric address that identifies a server on the internet
  5. the system that turns a web address into a server's numeric address
  6. the code that describes the structure of a web page
  7. the program that requests and displays web pages
  8. a computer that stores a website and sends its files when asked

Part B · Show what you learned

  1. What does DNS do?
  2. Why does the browser send a request to a server?
  3. What is the last step before you see a web page?
Answer key — Part A: 1) request · 2) response · 3) render · 4) IP address · 5) DNS · 6) HTML · 7) browser · 8) server
Part B: 1) It turns the web address you type into the numeric IP address of the server so the browser can reach it. 2) To ask for the files that make up the page; the server then responds with the HTML, images, and other files. 3) The browser assembles the files it received and renders the page on your screen.