| Activity | Points | Item Type |
|---|---|---|
| What is the Web? | ||
| 1.1 Welcome | Lesson | |
| 1.1.1 Welcome to Web Design | 1 | Video |
| 1.1.2 Welcome to Web Design Quiz | 3 | Check for Understanding |
| 1.1.3 Websites in Your Life | 5 | Free Response |
| 1.1.4 What is Web Design? | 5 | Free Response |
| 1.1.5 Meet a Web Developer | 1 | Connection |
| 1.1.6 Course Goals | 5 | Free Response |
| 1.2 The Internet | Lesson | |
| 1.2.1 What is The Internet? | 1 | Video |
| 1.2.2 What is the Internet? Quiz | 2 | Check for Understanding |
| 1.2.3 A Day Without the Internet | 5 | Free Response |
| 1.2.4 The Impact of the Internet: Crowdsourcing | 5 | Video |
| 1.2.5 Exploring Crowdsourcing | 5 | Free Response |
| 1.3 Viewing Websites | Lesson | |
| 1.3.1 Viewing Websites | 1 | Video |
| 1.3.2 Viewing Websites Quiz | 5 | Check for Understanding |
| 1.3.3 Free Response: Explaining a URL | 5 | Free Response |
| 1.3.4 What is a Browser? | 1 | Connection |
| 1.3.5 Your Browser | 1 | Connection |
| 1.3.6 Explaining a Browser | 5 | Free Response |
| 1.3.7 Viewing Websites In Different Browsers | 5 | Connection |
| 1.3.8 Reflection: Using Different Browsers | 5 | Free Response |
| 1.4 Digital Footprint and Reputation | Lesson | |
| 1.4.1 Digital Footprint and Reputation | 1 | Video |
| 1.4.2 Digital Footprint and Reputation | 3 | Check for Understanding |
| 1.4.3 Social Media Clean-up | 1 | Example |
| 1.4.4 Building a Positive Digital Footprint | 5 | Free Response |
| 1.4.5 Right to be Forgotten? | 1 | Connection |
| 1.4.6 Right to be Forgotten | 5 | Free Response |
| 1.4.7 What is your Digital Footprint? | 5 | Free Response |
| 1.5 Getting Started - What is the Web? Quiz | Lesson | |
| 1.5.1 Getting Started - What is the Web? Quiz | 10 | Unit Quiz |
| 1.5.2 Getting Started Badge | 1 | Badge |
| HTML - Structuring Websites | ||
| 2.1 Introduction to HTML | Lesson | |
| 2.1.1 Introduction to HTML | 1 | Video |
| 2.1.2 Introduction to HTML Quiz | 2 | Check for Understanding |
| 2.1.3 Our First HTML Page | 5 | Example |
| 2.1.4 Creating Your First Webpage | 5 | Exercise |
| 2.1.5 Your Second Tag | 5 | Example |
| 2.1.6 Dear Diary | 5 | Exercise |
| 2.2 Structure of an HTML Page | Lesson | |
| 2.2.1 Structure of an HTML Page | 1 | Video |
| 2.2.2 Structure of an HTML Page Quiz | 1 | Check for Understanding |
| 2.2.3 HTML Template | 1 | Example |
| 2.2.4 Hello World Page | 1 | Example |
| 2.2.5 Using Comments | 5 | Example |
| 2.2.6 Working Within the Page Structure | 5 | Exercise |
| 2.2.7 Introduce Yourself | 5 | Exercise |
| 2.3 Formatting Text | Lesson | |
| 2.3.1 Formatting Text | 1 | Video |
| 2.3.2 Formatting Text Quiz | 1 | Check for Understanding |
| 2.3.3 Dictionary Entry | 1 | Example |
| 2.3.4 Online Recipe | 5 | Exercise |
| 2.3.5 Class Schedule | 5 | Exercise |
| 2.3.6 Reading List | 5 | Exercise |
| 2.4 Creating Links | Lesson | |
| 2.4.1 Links | 1 | Video |
| 2.4.2 Links Quiz | 1 | Check for Understanding |
| 2.4.3 The <a> Tag | 1 | Example |
| 2.4.4 Search Engine Links | 5 | Exercise |
| 2.4.5 Linkbran.ch | 5 | Exercise |
| 2.4.6 Wiki Page | 5 | Exercise |
| 2.5 Incorporating Images | Lesson | |
| 2.5.1 Images | 1 | Video |
| 2.5.2 Images Quiz | 1 | Check for Understanding |
| 2.5.3 The <img> Tag | 1 | Example |
| 2.5.4 Using an Image as a Link | 1 | Example |
| 2.5.5 Images of Space | 5 | Exercise |
| 2.5.6 Your Favorite Image | 5 | Exercise |
| 2.5.7 Gallery Layout | 5 | Exercise |
| 2.6 Using Lists | Lesson | |
| 2.6.1 HTML Lists | 1 | Video |
| 2.6.2 HTML Lists Quiz | 1 | Check for Understanding |
| 2.6.3 Grocery Shopping | 1 | Example |
| 2.6.4 Chores | 5 | Exercise |
| 2.6.5 Favorites | 5 | Exercise |
| 2.6.6 Adding to Your Favorites | 5 | Exercise |
| 2.7 HTML Tables | Lesson | |
| 2.7.1 HTML Tables | 1 | Video |
| 2.7.2 HTML Tables Quiz | 3 | Check for Understanding |
| 2.7.3 Address Book | 1 | Example |
| 2.7.4 State Flowers | 5 | Exercise |
| 2.7.5 Report Card | 5 | Exercise |
| 2.8 Copyright | Lesson | |
| 2.8.1 Copyright | 1 | Video |
| 2.8.2 Copyright Quiz | 2 | Check for Understanding |
| 2.8.3 Citing Sources Example | 1 | Example |
| 2.8.4 Exploring Creative Commons | 1 | Connection |
| 2.8.5 Response: Creative Commons | 5 | Free Response |
| 2.8.6 Finding Images | 5 | Free Response |
| 2.8.7 Image Squares | 5 | Exercise |
| 2.8.8 Why Copyright is Important | 5 | Free Response |
| 2.9 Applying Styling | Lesson | |
| 2.9.1 HTML Styling | 1 | Video |
| 2.9.2 HTML Styling Quiz | 1 | Check for Understanding |
| 2.9.3 Styling the Grocery List | 1 | Example |
| 2.9.4 Styling an Article | 5 | Exercise |
| 2.9.5 Does Taylor Swift Lack Style? | 5 | Exercise |
| 2.10 HTML Colors | Lesson | |
| 2.10.1 HTML Colors | 1 | Video |
| 2.10.2 HTML Colors Quiz | 2 | Check for Understanding |
| 2.10.3 HTML Colors Examples | 1 | Example |
| 2.10.4 Shoelaces | 5 | Exercise |
| 2.10.5 Rainbow | 5 | Exercise |
| 2.10.6 Color Wheel | 1 | Connection |
| 2.10.7 All About You | 5 | Exercise |
| 2.11 Quiz: Exploring Web Design | Lesson | |
| 2.11.1 Exploring Web Design | 10 | Quiz |
| Project - Create a Basic homepage | ||
| 3.1 Homepage: Your First Website | Lesson | |
| 3.1.1 Example Homepage | 1 | Example |
| 3.1.2 Real World Homepage | 1 | Connection |
| 3.1.3 Set Up Your codehs.me Website | 10 | Challenge |
| 3.1.4 Create Your Homepage | 10 | Challenge |
| 3.1.5 Create Your Homepage Badge | 1 | Badge |
| CSS - Styling Websites | ||
| 4.1 Introduction to CSS Styling | Lesson | |
| 4.1.1 Introduction to CSS Styling | 5 | Video |
| 4.1.2 Introduction to CSS Quiz | 2 | Check for Understanding |
| 4.1.3 Styling with CSS | 5 | Example |
| 4.1.4 Styling a List | 5 | Exercise |
| 4.1.5 Adding CSS Styling | 5 | Exercise |
| 4.1.6 Global Trip Skeleton | 5 | Exercise |
| 4.2 CSS Select by Tag | Lesson | |
| 4.2.1 CSS Select by Tag | 1 | Video |
| 4.2.2 CSS Select by Tag Quiz | 1 | Check for Understanding |
| 4.2.3 Rainbow | 1 | Example |
| 4.2.4 Puppy Styling | 1 | Example |
| 4.2.5 Today's Top Videos | 5 | Exercise |
| 4.2.6 World Heritage Sites | 5 | Exercise |
| 4.2.7 Global Trip: Style Headers | 5 | Exercise |
| 4.3 CSS Select by Class | Lesson | |
| 4.3.1 CSS Select by Class | 1 | Video |
| 4.3.2 CSS Select by Class Quiz | 1 | Check for Understanding |
| 4.3.3 Simple Checkerboard | 1 | Example |
| 4.3.4 Football Divisons | 5 | Exercise |
| 4.3.5 Favorite Navigation | 5 | Exercise |
| 4.3.6 Global Trip: Emphasize with Styles | 5 | Exercise |
| 4.4 CSS Select by ID | Lesson | |
| 4.4.1 CSS Select by ID | 1 | Video |
| 4.4.2 CSS Select by ID Quiz | 1 | Check for Understanding |
| 4.4.3 Logo | 1 | Example |
| 4.4.4 Water Cycle | 5 | Exercise |
| 4.4.5 Aquarium Features | 5 | Exercise |
| 4.4.6 Global Trip: Add Photos | 5 | Exercise |
| 4.4.7 Selector Badge | 1 | Badge |
| 4.5 The Cascade | Lesson | |
| 4.5.1 The Cascade | 1 | Video |
| 4.5.2 The Cascade Quiz | 3 | Check for Understanding |
| 4.5.3 Using Importance | 1 | Example |
| 4.5.4 Order of Precedence | 1 | Example |
| 4.5.5 Planning for the Weekend | 5 | Exercise |
| 4.5.6 Highlight to Remember | 5 | Exercise |
| 4.5.7 Top Theme Parks | 5 | Exercise |
| 4.6 Add CSS Styling to your Homepage | Lesson | |
| 4.6.1 Add Styling to Homepage | 5 | Challenge |
| 4.7 CSS - Styling Websites Quiz | Lesson | |
| 4.7.1 CSS - Styling Websites Quiz | 7 | Unit Quiz |
| 4.7.2 CSS Badge | 1 | Badge |
| Advanced HTML and CSS | ||
| 5.1 Getting Started - Advanced HTML and CSS | Lesson | |
| 5.1.1 Getting Started | 1 | Video |
| 5.1.2 Example: Image Filters | 1 | Example |
| 5.1.3 Example: Animations | 1 | Example |
| 5.1.4 Example: Interactions | 1 | Example |
| 5.2 Multi-file Websites | Lesson | |
| 5.2.1 Splitting Your Site into Files | 1 | Video |
| 5.2.2 Splitting Your Site into Files Quiz | 2 | Check for Understanding |
| 5.2.3 Multipage Site Example | 1 | Example |
| 5.2.4 Farmer's Market | 5 | Exercise |
| 5.2.5 Bakery Stand | 5 | Exercise |
| 5.2.6 More About Bakeries | 5 | Exercise |
| 5.3 Divs | Lesson | |
| 5.3.1 Divs | 1 | Video |
| 5.3.2 Divs Quiz | 2 | Check for Understanding |
| 5.3.3 Divvying up the Site | 1 | Example |
| 5.3.4 Email | 5 | Exercise |
| 5.3.5 Navigation Bar | 5 | Exercise |
| 5.3.6 Volcanoes | 5 | Exercise |
| 5.3.7 Div Badge | 1 | Badge |
| 5.4 Spans | Lesson | |
| 5.4.1 Spans | 1 | Video |
| 5.4.2 Spans Quiz | 1 | Check for Understanding |
| 5.4.3 Span Formatting | 1 | Example |
| 5.4.4 Butterfly Lifecycles | 5 | Exercise |
| 5.4.5 Caterpillar Webs | 5 | Exercise |
| 5.4.6 Party Invitation | 5 | Exercise |
| 5.5 Combining CSS Selectors | Lesson | |
| 5.5.1 Combining CSS Selectors | 1 | Video |
| 5.5.2 Combining CSS Selectors Quiz | 2 | Check for Understanding |
| 5.5.3 More Specific Styling | 1 | Example |
| 5.5.4 Daily Agenda | 5 | Exercise |
| 5.5.5 Captions | 5 | Exercise |
| 5.5.6 Restaurant Info | 5 | Exercise |
| 5.6 Special Selectors | Lesson | |
| 5.6.1 Special Selectors | 1 | Video |
| 5.6.2 Special Selectors Quiz | 2 | Check for Understanding |
| 5.6.3 Vote For Me | 1 | Example |
| 5.6.4 Vote For Me Pt 2 | 1 | Example |
| 5.6.5 Voting Strategies | 5 | Exercise |
| 5.6.6 Emphasize Your Options | 5 | Exercise |
| 5.6.7 Club Membership | 5 | Exercise |
| 5.6.8 Special Selectors Badge | 1 | Badge |
| 5.7 Visibility | Lesson | |
| 5.7.1 Visibility | 1 | Video |
| 5.7.2 Visibility Quiz | 2 | Check for Understanding |
| 5.7.3 Display Example | 1 | Example |
| 5.7.4 Fading Text | 1 | Example |
| 5.7.5 In a Jam | 5 | Exercise |
| 5.7.6 Planets and Moons | 5 | Exercise |
| 5.7.7 Parody | 5 | Exercise |
| 5.8 Reading Documentation | Lesson | |
| 5.8.1 Reading Documentation | 1 | Video |
| 5.8.2 Reading Documentation Quiz | 2 | Check for Understanding |
| 5.8.3 Using Docs: Float | 1 | Example |
| 5.8.4 Using Docs: <blockquote> Tag | 1 | Example |
| 5.8.5 Finding Color Names | 5 | Exercise |
| 5.8.6 Mathematical Formulas | 5 | Exercise |
| 5.8.7 Help Karel's Code | 5 | Exercise |
| 5.9 Image Manipulation | Lesson | |
| 5.9.1 Image Manipulation | 1 | Video |
| 5.9.2 Image Manipulation Quiz | 2 | Check for Understanding |
| 5.9.3 Grayscale Filter | 1 | Example |
| 5.9.4 Blur Filter | 1 | Example |
| 5.9.5 Hue Rotation | 1 | Example |
| 5.9.6 The Brightness Filter | 5 | Exercise |
| 5.9.7 Filter Settings | 5 | Exercise |
| 5.9.8 Choose a Filter | 5 | Exercise |
| 5.10 Animation | Lesson | |
| 5.10.1 Animation | 1 | Video |
| 5.10.2 Animation Quiz | 2 | Check for Understanding |
| 5.10.3 Animated Image Filter | 1 | Example |
| 5.10.4 Animate Your Image | 5 | Exercise |
| 5.10.5 Animate Text Color | 5 | Exercise |
| 5.10.6 Add Animation to Your Homepage | 5 | Exercise |
| 5.11 Interaction | Lesson | |
| 5.11.1 Interaction | 1 | Video |
| 5.11.2 Interaction Quiz | 2 | Check for Understanding |
| 5.11.3 Interactive Image Filter | 1 | Example |
| 5.11.4 Smooth Interactive Image Filter | 1 | Example |
| 5.11.5 Smooth Change on Click | 1 | Example |
| 5.11.6 Identify the Image | 5 | Exercise |
| 5.11.7 A Button | 5 | Exercise |
| 5.11.8 Film Strip | 5 | Exercise |
| 5.11.9 CSS Tricks | 1 | Connection |
| 5.12 Advanced HTML and CSS Quiz | Lesson | |
| 5.12.1 Advanced HTML and CSS Quiz | 15 | Unit Quiz |
| 5.12.2 Advanced HTML and CSS Badge | 1 | Badge |
| Final Project | ||
| 6.1 Final Project | Lesson | |
| 6.1.1 Gathering Ideas | 5 | Free Response |
| 6.1.2 Community Website | 5 | Challenge |
| 6.1.3 Final Project Badge | 1 | Badge |
| 6.1.4 Web Design Completed | 1 | Badge |
Sign up for a free teacher account to get access to curriculum, teacher tools and teacher resources.
Teacher SignupSign up as a student if you are in a school and have a class code given to you by your teacher.
Student Signup
