Web Technologies · SHS1 Computing

Lesson notes

Learning Objectives

Indicator: 1.2.3.LI.2 - Draw and explain 2 Web Outline plans showing the wireframes

By the end of the lesson, learners can:

Define a wireframe and a web outline plan in their own words.
Identify the key components of a web outline plan, including header, navigation, content areas, and footer.
Draw two complete wireframes for different types of websites (for example, a school website and an online store).
Explain the purpose and function of each section in their wireframes.
Justify their design choices in a short presentation, comparing the structure of their two wireframes.

Sign in with your phone number to read the full note and download the GES plan - free.

Sign in with phone number

Curriculum details

Strand: Procedural Programming (computational Thinking) (Strand 2)
Sub-strand: Web Technologies (2.3)
Content standard: 1.2.3.CS.1 - Demonstrate knowledge and understanding of Web Development 1.2.3.LO.1 Explain the basic principles of web design and identify the modern technologies used in web design.
Indicator: 1.2.3.LI.2 - Draw and explain 2 Web Outline plans showing the wireframes
Suggested placement: Semester 2, Week 16 (Week 36 of the year)
Our suggestion, laid out in curriculum order across three terms of twelve weeks. NaCCA does not fix the week, so follow your school's scheme of learning.
Source document note: The official curriculum document has a fault in this entry, so the curriculum text above is transcribed exactly as printed:

exemplars - p.46: the assessment token is visibly printed `1.2.3AS.2` with missing separator(s); the exact printed token is retained here and associated to 1.2.3.LI.2 by sequence and table position
Curriculum reference: NaCCA curriculum document, p. 46

Exemplars (from the NaCCA curriculum)

- Brainstorming on what is a website map, and web outline plan using the wireframes.
- Engage learners in a brainstorming session to explore the concept of website mapping and Level 3 Strategic reasoning the creation of web outline plans using wireframes.
- Encourage learners to draw and explain two web outline plans, demonstrating their understanding of wireframes as a visual representation of a website's structure.
Teaching and Learning Materials:
- Notepad or exercise book
- Pen
- Smartphones
- Laptops
- Desktop computers
- YEAR TWO
- * Tablets * TV and Radio
- Open Educational Resources (including YouTube, MOOCs -
- Udemy/Coursera, Khan Academy, and TESSA) * The iBox/iCampus (CENDLOS)
- * Productivity tools ix. Subject-based application software
- Instructional laboratories (with multimedia equipment and smartboards)
- Maintenance and repair workshops
Assessment (1.2.3AS.2). The document marks these depth-of-knowledge levels for this indicator: Level 4 Extended critical thinking and reasoning.