Introduction
Have you ever wondered how your favorite websites are made? Behind every page is code like HTML and CSS. Today, you are a Junior Web Developer! Your mission is to learn the basics of web design and plan your very first site.
Task
Your goal is to create a 'Website Blueprint.' You will choose a topic (like your favorite hobby), write the HTML for a homepage, and explain the purpose of your site in a short presentation.
Process
- Research: Watch the linked video on what HTML is.
- Plan: Choose a theme and draw a layout on paper.
- Code: Use an online editor like CodePen to write a simple heading <h1> and a paragraph <p>.
- Review: Check your code for errors using the resources provided.
Evaluation
| Criteria | Beginning (1 pt) | Developing (2 pts) | Expert (3 pts) |
| HTML Structure | Website is missing major tags like <html> or <body>. | Most tags are present but some are incorrectly nested. | All essential HTML tags are present and used correctly. |
| Content & Design | The website has little to no content or images. | Content is present but layout is cluttered or hard to read. | Content is well-organized, engaging, and easy to navigate. |
| Functionality | Links or buttons do not work. | Most features work, but there are a few broken links. | All links and interactive elements work perfectly. |
| Creativity | Followed the basic template with no original ideas. | Added some personal touches or unique colors. | High level of originality in design and topic choice. |
Conclusion
Congratulations! You've taken your first step into the world of coding. Now that you know the basics, what kind of advanced features would you want to add to your site next?
Credits
Images provided by Pexels. Instructional video by Code.org. Lesson inspired by the K-12 Computer Science Framework.Code.org
Teacher Page
This WebQuest is designed for Grade 7-9 students. It aligns with ICT standards for digital literacy and basic programming.