A project-based introduction to web development for intermediate coders in upper middle or high school using HTML and CSS.
- Grades 7+
- Advanced
- Web
Lesson 3 : All About Lists
Web Development 101
Time: 50+ minutes
Introduction
HTML and CSS Introduced
Vocabulary
Objectives
Materials
Warm-Up
(5 minutes)
Activities
(45 minutes)
Facilitate as students complete all All About Lists modules on their own:
1. Lists (Document)
2. Ordered Lists (Document)
3. Unordered Lists (Document)
4. List Item Type Attribute (Document)
5. Inline Styling (Document)
6. Revisiting List Types (Document)
7. Nested Lists (Document)
8. Lists with Images (Document)
9. Spacing and Sizing (Document)
10. Project 5: My Pets (DIY)
10. Quiz (Multiple Choice)
Extended Activities
(20 minutes)
U.S. Standards
-
CCSS-Math:
MP.1, MP.2, MP.4, MP.7
-
CCSS-ELA:
RI.7.4, RI.8.4, 6-8.RST.3, 6-8.RST.4, 6-8.RST.7
-
CSTA:
2-AP-13, 2-AP-16, 2-AP-17
-
CS CA:
6-8.AP.13, 6-8.AP.16, 6-8.AP.17
-
ISTE:
1.c, 1.d, 4.d, 5.c, 5.d, 6.b
U.K. Standards
Key stage 3
Pupils should be taught to:
understand several key algorithms that reflect computational thinking [for example, ones for sorting and searching]; use logical reasoning to compare the utility of alternative algorithms for the same problem
create, reuse, revise and repurpose digital artefacts for a given audience, with attention to trustworthiness, design and usability
understand a range of ways to use technology safely, respectfully, responsibly and securely, including protecting their online identity and privacy; recognise inappropriate content, contact and conduct, and know how to report concerns
Key stage 4
All pupils must have the opportunity to study aspects of information technology and computer science at sufficient depth to allow them to progress to higher levels of study or to a professional career. Pupils should be taught to:
develop their capability, creativity and knowledge in computer science, digital media and information technology
develop and apply their analytic, problem-solving, design, and computational thinking skills
understand how changes in technology affect safety, including new ways to protect their online privacy and identity, and how to report a range of concerns
Class Presentations
These student-facing slide presentations help educators seamlessly run Tynker lessons in a virtual or physical classroom setting.
Each lesson has its own set of slides that introduce the big ideas, suggest unplugged activities, and include a section for each activity module.
While running lesson slides, you can switch back and forth between the activity, the slides, answer keys and other lesson materials.
A sample slide presentation is available for your review. Please log in to view all the class presentations available with your plan..
Lesson 1
Introduction
Lesson 2
Headings and Images
Lesson 3
All About Lists
Lesson 4
Adding Hyperlinks
Lesson 5
Using Containers
Lesson 6
Tables and Media
Lesson 7
More on Styling
Lesson 8
Pixel Art
Lesson 9
Photo Gallery
Lesson 10
Pictogram
Time: 50+ minutes
Introduction
HTML and CSS Introduced
Vocabulary
Objectives
Materials
Warm-Up (5 minutes)
Activities (45 minutes)
Facilitate as students complete all All About Lists modules on their own:
1. Lists (Document)2. Ordered Lists (Document)
3. Unordered Lists (Document)
4. List Item Type Attribute (Document)
5. Inline Styling (Document)
6. Revisiting List Types (Document)
7. Nested Lists (Document)
8. Lists with Images (Document)
9. Spacing and Sizing (Document)
10. Project 5: My Pets (DIY)
10. Quiz (Multiple Choice)
Extended Activities (20 minutes)
U.S. Standards
- CCSS-Math: MP.1, MP.2, MP.4, MP.7
- CCSS-ELA: RI.7.4, RI.8.4, 6-8.RST.3, 6-8.RST.4, 6-8.RST.7
- CSTA: 2-AP-13, 2-AP-16, 2-AP-17
- CS CA: 6-8.AP.13, 6-8.AP.16, 6-8.AP.17
- ISTE: 1.c, 1.d, 4.d, 5.c, 5.d, 6.b
U.K. Standards
Key stage 3
Pupils should be taught to:Key stage 4
All pupils must have the opportunity to study aspects of information technology and computer science at sufficient depth to allow them to progress to higher levels of study or to a professional career. Pupils should be taught to:Class Presentations
These student-facing slide presentations help educators seamlessly run Tynker lessons in a virtual or physical classroom setting.
Each lesson has its own set of slides that introduce the big ideas, suggest unplugged activities, and include a section for each activity module.
While running lesson slides, you can switch back and forth between the activity, the slides, answer keys and other lesson materials.
A sample slide presentation is available for your review. Please log in to view all the class presentations available with your plan..
Lesson 1
Introduction
Lesson 2
Headings and Images
Lesson 3
All About Lists
Lesson 4
Adding Hyperlinks
Lesson 5
Using Containers
Lesson 6
Tables and Media
Lesson 7
More on Styling
Lesson 8
Pixel Art
Lesson 9
Photo Gallery
Lesson 10
Pictogram