From Code to Screen: The Webpage Construction Process
🎯 Today's Learning Objective
Students will be able to describe the concepts of how a webpage is constructed, saved, and viewed.
📋 Instructions
Listen as your teacher explains each step of the webpage construction process
Fill in the boxes with the key information for each step
Draw arrows to show how each step connects to the next
Use your own words to explain what happens at each stage
Work with your partner to make sure you both understand
1
Write HTML Code
CONSTRUCT
What are you doing in this step?
What tools/programs do you use?
What does the HTML code contain? (Give examples of tags)
↓
2
Save as .html File
SAVE
What file extension must you use?
Why is it important to save the file correctly?
What happens if you save it as a .txt file instead?
↓
3
Upload to CodeHS / Organize Files
ORGANIZE
Where do you save your webpage files for this project?
Why is file organization important for webpages?
What folder did you create today?
↓
4
Preview in Browser
VIEW
How does the browser know what to display?
What's the difference between viewing the CODE and viewing the WEBPAGE?
What did you notice about how your Webpage1.html looked in the browser?
💠Final Reflection
In your own words, explain the complete process of how a webpage goes from code to what you see on screen. Use the words: construct, save, organize, and view.