Please enable JavaScript to use CodeHS

Utah Web Development 1 and 2 - Outline

  1. The Internet

    1. 1.1 Welcome to the Internet

    2. Video 1.1.1 Welcome to the Internet
    3. Check for Understanding 1.1.2 Welcome to the Internet Quiz
    4. Free Response 1.1.3 Reflection: The Internet and You
    5. Free Response 1.1.4 An Internet Timeline
    6. 1.2 Viewing Websites

    7. Video 1.2.1 Viewing Websites
    8. Check for Understanding 1.2.2 Viewing Websites Quiz
    9. Free Response 1.2.3 Free Response: Explaining a URL
    10. Connection 1.2.4 Viewing Websites In Different Browsers
    11. Free Response 1.2.5 Reflection: Using Different Browsers
    12. 1.3 Digital Footprint and Reputation

    13. Video 1.3.1 Digital Footprint and Reputation
    14. Check for Understanding 1.3.2 Digital Footprint and Reputation
    15. Example 1.3.3 Social Media Clean-up
    16. Free Response 1.3.4 Building a Positive Digital Footprint
    17. Connection 1.3.5 Right to be Forgotten?
    18. Free Response 1.3.6 Right to be Forgotten
    19. Free Response 1.3.7 What is your Digital Footprint?
    20. 1.4 Ethics and Legal Considerations

    21. Article 1.4.1 Legal, Ethics, and Bias in Computing
    22. Article 1.4.2 Which Laws?
    23. Connection 1.4.3 Self-driving Cars
    24. Free Response 1.4.4 Self-driving Cars
    25. Connection 1.4.5 Exploring Creative Commons
    26. Free Response 1.4.6 Response: Creative Commons
    27. Free Response 1.4.7 Negative Consequences
    28. 1.5 Cybersecurity

    29. Video 1.5.1 Cybersecurity
    30. Check for Understanding 1.5.2 Cybersecurity Quiz
    31. Example 1.5.3 You Can Be Tracked!
    32. Connection 1.5.4 Password Strength
    33. Free Response 1.5.5 Reflection: Password Strength
    34. Example 1.5.6 Phishing Simulator
    35. Connection 1.5.7 Rogue Access Points
    36. Connection 1.5.8 Phishing for Your Info
    37. Free Response 1.5.9 Phishing Reflection
    38. 1.6 Computer Science Careers

    39. Video 1.6.1 Computer Science All Around Us
    40. Quiz 1.6.2 Computer Science All Around Us
    41. Connection 1.6.3 CS Careers
    42. Free Response 1.6.4 CS Career Response
    43. Connection 1.6.5 Coding in the Wild
    44. Free Response 1.6.6 Coding in the Wild Response
    45. Connection 1.6.7 Inclusive Coding
    46. Free Response 1.6.8 Inclusive Coding Response
    47. Resource 1.6.9 Career Research
    48. Notes 1.6.10 Career & Technical Student Organizations (CTSO)
    49. Free Response 1.6.11 Refection: CTSOs
  2. HTML - Structuring Websites

    1. 2.1 Introduction to HTML

    2. Video 2.1.1 Introduction to HTML
    3. Check for Understanding 2.1.2 Introduction to HTML Quiz
    4. Example 2.1.3 Our First HTML Page
    5. Exercise 2.1.4 Say Hello!
    6. 2.2 Structure of an HTML Page

    7. Video 2.2.1 Structure of an HTML Page
    8. Check for Understanding 2.2.2 Structure of an HTML Page Quiz
    9. Example 2.2.3 HTML Template
    10. Example 2.2.4 Hello World Page
    11. Example 2.2.5 Using Comments
    12. Exercise 2.2.6 The <title> Tag
    13. Exercise 2.2.7 Your First HTML Page
    14. 2.3 Formatting Text

    15. Video 2.3.1 Formatting Text
    16. Check for Understanding 2.3.2 Formatting Text Quiz
    17. Example 2.3.3 Dictionary
    18. Example 2.3.4 Using Special Characters
    19. Exercise 2.3.5 Word Definitions
    20. Exercise 2.3.6 Pet Names
    21. Exercise 2.3.7 Call of the Wild
    22. Badge 2.3.8 Formatting Badge
    23. 2.4 Links

    24. Video 2.4.1 Links
    25. Check for Understanding 2.4.2 Links Quiz
    26. Example 2.4.3 The <a> Tag
    27. Exercise 2.4.4 Bookmarks
    28. Exercise 2.4.5 Encyclopedias
    29. 2.5 Images

    30. Video 2.5.1 Images
    31. Check for Understanding 2.5.2 Images Quiz
    32. Example 2.5.3 The <img> Tag
    33. Exercise 2.5.4 Collage on a Theme
    34. Exercise 2.5.5 Linking an Image
    35. Exercise 2.5.6 National Parks
    36. 2.6 Copyright

    37. Video 2.6.1 Copyright
    38. Check for Understanding 2.6.2 Copyright Quiz
    39. Example 2.6.3 Citing Sources Example
    40. Connection 2.6.4 Exploring Creative Commons
    41. Free Response 2.6.5 Response: Creative Commons
    42. Free Response 2.6.6 Finding Images
    43. Exercise 2.6.7 Make a Collage
    44. Free Response 2.6.8 Why Copyright is Important
    45. 2.7 HTML Lists

    46. Video 2.7.1 HTML Lists
    47. Check for Understanding 2.7.2 HTML Lists Quiz
    48. Example 2.7.3 Grocery Shopping
    49. Exercise 2.7.4 Class Planning
    50. Exercise 2.7.5 Dream Destinations
    51. Exercise 2.7.6 Vacation Guides
    52. 2.8 HTML Tables

    53. Video 2.8.1 HTML Tables
    54. Check for Understanding 2.8.2 HTML Tables Quiz
    55. Example 2.8.3 Address Book
    56. Exercise 2.8.4 National Sports
    57. Exercise 2.8.5 Table of Favorites
    58. 2.9 HTML Styling

    59. Video 2.9.1 HTML Styling
    60. Check for Understanding 2.9.2 HTML Styling Quiz
    61. Example 2.9.3 Stylish Address Book
    62. Exercise 2.9.4 Background Colors
    63. Exercise 2.9.5 Style Your Class List
    64. Badge 2.9.6 Styling Badge
    65. 2.10 HTML Colors

    66. Video 2.10.1 HTML Colors
    67. Check for Understanding 2.10.2 HTML Colors Quiz
    68. Example 2.10.3 HTML Colors Examples
    69. Exercise 2.10.4 Create Your Own Color
    70. Exercise 2.10.5 Gradients
    71. Connection 2.10.6 Color Wheel
    72. Exercise 2.10.7 Using Good Colors
    73. 2.11 HTML - Structuring Websites Quiz

    74. Unit Quiz 2.11.1 HTML - Structuring Websites Quiz
    75. Badge 2.11.2 HTML Badge
  3. CSS - Styling Websites

    1. 3.1 Introduction to CSS

    2. Video 3.1.1 Introduction to CSS
    3. Check for Understanding 3.1.2 Introduction to CSS Quiz
    4. Example 3.1.3 Styling your H1s
    5. Exercise 3.1.4 First style with CSS
    6. Exercise 3.1.5 List Styling
    7. Exercise 3.1.6 Endangered Animals: Skeleton
    8. 3.2 CSS Select by Tag

    9. Video 3.2.1 CSS Select by Tag
    10. Check for Understanding 3.2.2 CSS Select by Tag Quiz
    11. Example 3.2.3 Rainbow
    12. Example 3.2.4 Puppy Styling
    13. Exercise 3.2.5 Set List
    14. Exercise 3.2.6 Your Appliance Recommendations
    15. Exercise 3.2.7 Endangered Animals: Style the Headers
    16. 3.3 CSS Select by Class

    17. Video 3.3.1 CSS Select by Class
    18. Check for Understanding 3.3.2 CSS Select by Class Quiz
    19. Example 3.3.3 Simple Checkerboard
    20. Exercise 3.3.4 Swim Meet
    21. Exercise 3.3.5 Favorite Things
    22. Exercise 3.3.6 Endangered Animals: Add Color Coding
    23. 3.4 CSS Select by ID

    24. Video 3.4.1 CSS Select by ID
    25. Check for Understanding 3.4.2 CSS Select by ID Quiz
    26. Example 3.4.3 Logo
    27. Exercise 3.4.4 Must Do Today!
    28. Exercise 3.4.5 Lomeli's Menu
    29. Exercise 3.4.6 Endangered Animals: Add Pictures
    30. Badge 3.4.7 Selector Badge
    31. 3.5 The Cascade

    32. Video 3.5.1 The Cascade
    33. Check for Understanding 3.5.2 The Cascade Quiz
    34. Example 3.5.3 Using Importance
    35. Example 3.5.4 Order of Precedence
    36. Exercise 3.5.5 We Really Like Dairy
    37. Exercise 3.5.6 Style the Table
    38. 3.6 Multi-file Websites

    39. Video 3.6.1 Splitting Your Site Into Files
    40. Quiz 3.6.2 Splitting Your Site Into Files Quiz
    41. Example 3.6.3 Multipage Site Examples
    42. Example 3.6.4 Absolute versus Relative Links
    43. Exercise 3.6.5 Add a Style Sheet
    44. Exercise 3.6.6 Dividing the Site
    45. Exercise 3.6.7 Career Site: Creating Structure
    46. 3.7 What is Web Optimization?

    47. Video 3.7.1 What is Web Optimization?
    48. Check for Understanding 3.7.2 What is Web Optimization?
    49. Connection 3.7.3 Website Folder Structure
    50. Notes 3.7.4 File Conventions
    51. Free Response 3.7.5 Folders and Files
    52. 3.8 CSS - Styling Websites Quiz

    53. Video 3.8.1 Optimizing Web Information
    54. Check for Understanding 3.8.2 Optimizing Web Information
    55. Connection 3.8.3 How Search Works
    56. Free Response 3.8.4 How Search Works
    57. Connection 3.8.5 What is Search Engine Optimization (SEO)?
    58. Free Response 3.8.6 SEO Definition
    59. Connection 3.8.7 Ethical Search Optimization
    60. Free Response 3.8.8 Ethical Search Optimization
    61. Connection 3.8.9 Yoast Analyzer
    62. Free Response 3.8.10 Yoast Tool Activity
    63. Unit Quiz 3.8.11 CSS - Styling Websites Quiz
    64. Badge 3.8.12 CSS Badge
  4. Advanced HTML and CSS

    1. 4.1 Getting Started - Advanced HTML and CSS

    2. Video 4.1.1 Getting Started
    3. Example 4.1.2 Example: Image Filters
    4. Example 4.1.3 Example: Animations
    5. Example 4.1.4 Example: Interactions
    6. 4.2 Embedding iframes

    7. Video 4.2.1 Embedding iframes
    8. Check for Understanding 4.2.2 Embedding IFrames Quiz
    9. Example 4.2.3 Embedding CodeHS
    10. Exercise 4.2.4 Embedding a Website
    11. Exercise 4.2.5 Embed a Tweet
    12. Exercise 4.2.6 Embed a Video
    13. Exercise 4.2.7 Career Site: Include Outside Information
    14. 4.3 Divs

    15. Video 4.3.1 Divs
    16. Check for Understanding 4.3.2 Divs Quiz
    17. Example 4.3.3 Divvying up the Site
    18. Exercise 4.3.4 Quotes
    19. Exercise 4.3.5 Flags
    20. Exercise 4.3.6 Career Site: Separate the Content
    21. Badge 4.3.7 Div Badge
    22. 4.4 Spans

    23. Video 4.4.1 Spans
    24. Check for Understanding 4.4.2 Spans Quiz
    25. Example 4.4.3 Span Formatting
    26. Exercise 4.4.4 Vocabulary
    27. Exercise 4.4.5 Text Decoration
    28. Exercise 4.4.6 Career Site: Style Special Pieces
    29. 4.5 Semantic Tags

    30. Video 4.5.1 Semantic Tags
    31. Example 4.5.2 Semantic Skeleton
    32. Example 4.5.3 Section Flowchart Example
    33. Example 4.5.4 Semantic Article
    34. Exercise 4.5.5 Great Quotes
    35. Exercise 4.5.6 Article of Interest
    36. Exercise 4.5.7 Career Site: Semantic Tags
    37. 4.6 Combining CSS Selectors

    38. Video 4.6.1 Combining CSS Selectors
    39. Check for Understanding 4.6.2 Combining CSS Selectors Quiz
    40. Example 4.6.3 More Specific Styling
    41. Exercise 4.6.4 Choosing Nested Tags
    42. Exercise 4.6.5 Highlight the First Item
    43. Exercise 4.6.6 Calorie Recommendations
    44. 4.7 The Don't Repeat Yourself Principle

    45. Video 4.7.1 Don't Repeat Yourself
    46. Check for Understanding 4.7.2 Don't Repeat Yourself Quiz
    47. Example 4.7.3 Styling Multiple Tags
    48. Example 4.7.4 Style Similar Items with Same Class
    49. Exercise 4.7.5 Managing Change
    50. Exercise 4.7.6 Condense CSS Rules
    51. Free Response 4.7.7 Why DRY?
    52. 4.8 Special Selectors

    53. Video 4.8.1 Special Selectors
    54. Check for Understanding 4.8.2 Special Selectors Quiz
    55. Example 4.8.3 Vote For Me
    56. Example 4.8.4 Vote For Me Pt 2
    57. Exercise 4.8.5 Extend Vote For Me
    58. Exercise 4.8.6 Special Vendors
    59. Exercise 4.8.7 Checklist
    60. Exercise 4.8.8 Career Website: Add Milestones
    61. Badge 4.8.9 Special Selectors Badge
    62. 4.9 Visibility

    63. Video 4.9.1 Visibility
    64. Check for Understanding 4.9.2 Visibility Quiz
    65. Example 4.9.3 Display Example
    66. Example 4.9.4 Fading Text
    67. Exercise 4.9.5 Favorite Sea Creature
    68. Exercise 4.9.6 Caption on Demand
    69. 4.10 Reading Documentation

    70. Video 4.10.1 Reading Documentation
    71. Check for Understanding 4.10.2 Reading Documentation Quiz
    72. Example 4.10.3 Using Docs: Float
    73. Example 4.10.4 Using Docs: <blockquote> Tag
    74. Example 4.10.5 HTML Forms
    75. Exercise 4.10.6 Style the Table
    76. Exercise 4.10.7 Electric Company
    77. Exercise 4.10.8 Career Website: Add Pictures
    78. 4.11 Using the Inspector

    79. Video 4.11.1 Using the Inspector
    80. Check for Understanding 4.11.2 Using the Inspector Tool Quiz
    81. Connection 4.11.3 Inspector Quick Start
    82. Check for Understanding 4.11.4 Classes and IDs
    83. Check for Understanding 4.11.5 Exploring the Art Museum
    84. Check for Understanding 4.11.6 What's Your Style?
    85. 4.12 The Box Model

    86. Video 4.12.1 The Box Model
    87. Check for Understanding 4.12.2 The Box Model Quiz
    88. Example 4.12.3 Adding Space Using Margin
    89. Example 4.12.4 Adding Space Using Padding
    90. Example 4.12.5 Combining Margin and Padding
    91. Example 4.12.6 Margin and Padding with em
    92. Exercise 4.12.7 I need some space!
    93. Exercise 4.12.8 I need some breathing room!
    94. Free Response 4.12.9 Where is space added?
    95. Free Response 4.12.10 Relative Measurements
    96. Exercise 4.12.11 Align Content Side by Side
    97. Exercise 4.12.12 Career Website: Separate Content
    98. Connection 4.12.13 Design with the Box Model
    99. Badge 4.12.14 Box Badge
    100. 4.13 Image Manipulation

    101. Video 4.13.1 Image Manipulation
    102. Check for Understanding 4.13.2 Image Manipulation Quiz
    103. Example 4.13.3 Grayscale Filter
    104. Example 4.13.4 Blur Filter
    105. Example 4.13.5 Hue Rotation
    106. Exercise 4.13.6 Invert Filter
    107. Exercise 4.13.7 Blurred
    108. Exercise 4.13.8 Hue Rotation Comparisons
    109. Exercise 4.13.9 Overexposure
    110. Exercise 4.13.10 Grayscale Art
    111. Exercise 4.13.11 Aesop's Fables Part 1
    112. Exercise 4.13.12 Aesop's Fables Part 2
    113. 4.14 Animation

    114. Video 4.14.1 Animation
    115. Check for Understanding 4.14.2 Animation Quiz
    116. Example 4.14.3 Animated Image Filter
    117. Exercise 4.14.4 Animated Invert Filter
    118. Exercise 4.14.5 Album Cover
    119. Exercise 4.14.6 Aesop's Fables Part 3
    120. 4.15 Interaction

    121. Video 4.15.1 Interaction
    122. Check for Understanding 4.15.2 Interaction Quiz
    123. Example 4.15.3 Interactive Image Filter
    124. Example 4.15.4 Smooth Interactive Image Filter
    125. Example 4.15.5 Smooth Change on Click
    126. Exercise 4.15.6 Button Interaction
    127. Exercise 4.15.7 Create Your Own Tooltip
    128. Exercise 4.15.8 Aesop's Fables Part 4
    129. Exercise 4.15.9 Career Website: Engage the User
    130. Connection 4.15.10 CSS Tricks
    131. 4.16 The CSS Grid Layout

    132. Video 4.16.1 The CSS Grid Layout
    133. Quiz 4.16.2 CSS Grid Layout Quiz
    134. Example 4.16.3 Grid Layout
    135. Example 4.16.4 Applying The Grid Model
    136. Exercise 4.16.5 The Rainbow in a Grid
    137. Exercise 4.16.6 Image Gallery
    138. 4.17 Web Accessibility

    139. Connection 4.17.1 Accessibility
    140. Free Response 4.17.2 Accessibility Tips
    141. Example 4.17.3 Inaccessible Site Review
    142. Exercise 4.17.4 Improve Site's Accessibility
    143. 4.18 Advanced HTML and CSS Quiz

    144. Unit Quiz 4.18.1 Advanced HTML and CSS Quiz
    145. Badge 4.18.2 Advanced HTML and CSS Badge
  5. Project - Create Your Homepage

    1. 5.1 Homepage: Your First Website

    2. Example 5.1.1 Example Homepage
    3. Connection 5.1.2 Real World Homepage
    4. Challenge 5.1.3 Set Up Your codehs.me Website
    5. Free Response 5.1.4 Analyzing Requirements
    6. Free Response 5.1.5 Planning your Homepage
    7. Challenge 5.1.6 Create Your Homepage
    8. Free Response 5.1.7 Testing your homepage
    9. Badge 5.1.8 Create Your Homepage Badge
  6. Introduction to Javascript in HTML

    1. 6.1 The Script Tag

    2. Video 6.1.1 The Script Tag
    3. Check for Understanding 6.1.2 The Script Tag Quiz
    4. Example 6.1.3 Debugging Functions
    5. Free Response 6.1.4 Using the Console
    6. Exercise 6.1.5 Writing in the Console
    7. Exercise 6.1.6 Alert Introduction
    8. Exercise 6.1.7 Debugging with the Console
    9. Challenge 6.1.8 Quick Trivia
    10. 6.2 Using the DOM

    11. Video 6.2.1 getElementById
    12. Check for Understanding 6.2.2 getElementById Quiz
    13. Example 6.2.3 Welcome to My Site!
    14. Exercise 6.2.4 Let's Get to Know You
    15. Exercise 6.2.5 Simple Math
    16. Video 6.2.6 Using the DOM
    17. Check for Understanding 6.2.7 Using the DOM Quiz
    18. Example 6.2.8 Multiple <p> tags
    19. Exercise 6.2.9 Menu Opinion
    20. Exercise 6.2.10 Longest Paragraph
    21. 6.3 Creating Elements Using the DOM

    22. Video 6.3.1 Creating Elements Using the DOM
    23. Check for Understanding 6.3.2 Creating Elements Using the DOM
    24. Example 6.3.3 Make a Button
    25. Example 6.3.4 The Whole Family
    26. Exercise 6.3.5 Roll Call
    27. Exercise 6.3.6 Add to Calendar
    28. 6.4 Styling Elements Using Javascript

    29. Video 6.4.1 Styling Elements Using JavaScript
    30. Check for Understanding 6.4.2 Styling Elements Using JavaScript
    31. Example 6.4.3 Frankenstein Footnote
    32. Example 6.4.4 .(attribute) vs. setAttribute
    33. Example 6.4.5 Styling an Image
    34. Exercise 6.4.6 Add a Link
    35. Exercise 6.4.7 Adding a Frame
    36. Exercise 6.4.8 Create a Flag
    37. Exercise 6.4.9 Checkerboard
    38. 6.5 Functions in HTML

    39. Video 6.5.1 Functions in HTML
    40. Check for Understanding 6.5.2 Functions in HTML
    41. Example 6.5.3 Changing Text Color
    42. Example 6.5.4 Change Text Color with Parameters
    43. Exercise 6.5.5 Announcement Function
    44. Exercise 6.5.6 Random Number Generator
    45. Exercise 6.5.7 Add Colors!
    46. 6.6 This Keyword

    47. Video 6.6.1 This Keyword
    48. Check for Understanding 6.6.2 This Keyword
    49. Example 6.6.3 Clicking Multiple Paragraphs
    50. Example 6.6.4 Clicking with Event Listeners
    51. Exercise 6.6.5 Click Box
    52. Exercise 6.6.6 Cross Out
    53. Challenge 6.6.7 Make a Quilt
    54. 6.7 Challenge: Make a Keyboard

    55. Connection 6.7.1 Challenge Overview!
    56. Exercise 6.7.2 Make Button
    57. Exercise 6.7.3 Make Text
    58. Challenge 6.7.4 Make a Keyboard
    59. 6.8 Keyboard Interactions

    60. Video 6.8.1 Keyboard Events
    61. Check for Understanding 6.8.2 Keyboard Events
    62. Example 6.8.3 Coordinate Plane
    63. Example 6.8.4 Make a Keyboard with Key Events
    64. Exercise 6.8.5 Key Alert
    65. Exercise 6.8.6 Light Up Squares
    66. Exercise 6.8.7 Light Switch Squares
    67. 6.9 JavaScript Animations

    68. Video 6.9.1 Animations in JavaScript
    69. Check for Understanding 6.9.2 Animations in JavaScript
    70. Example 6.9.3 Growing Square
    71. Example 6.9.4 Changing Colors
    72. Exercise 6.9.5 Rotating Div
    73. Exercise 6.9.6 Lucky Lotto Number
    74. Exercise 6.9.7 Rotating Div with Keyboard Interaction
    75. 6.10 Positioning and Animations

    76. Video 6.10.1 Positioning and Animations
    77. Check for Understanding 6.10.2 Positioning and Animations
    78. Example 6.10.3 Positioning Elements
    79. Example 6.10.4 Moving Square in Container
    80. Exercise 6.10.5 Practice with Positions
    81. Exercise 6.10.6 Hidden Nav Bar
    82. Exercise 6.10.7 Moving a Square
    83. Challenge 6.10.8 Add Div Animation
    84. 6.11 Introduction to JavaScript in HTML Quiz

    85. Unit Quiz 6.11.1 Introduction to JavaScript in HTML Quiz
  7. Bootstrap

    1. 7.1 What is Bootstrap?

    2. Video 7.1.1 What is Bootstrap?
    3. Example 7.1.2 Example Bootstrap Mobile Site
    4. Connection 7.1.3 Real World Bootstrap: OneNYC
    5. Free Response 7.1.4 Responsive vs Unresponsive
    6. Free Response 7.1.5 Favorite Bootstrap Site
    7. 7.2 Getting Started with Bootstrap

    8. Video 7.2.1 Getting Started with Bootstrap
    9. Check for Understanding 7.2.2 Getting Started Quiz
    10. Example 7.2.3 First Bootstrap Page
    11. Example 7.2.4 Cascading Style Sheets
    12. Example 7.2.5 Container-Fluid Page
    13. Exercise 7.2.6 Using the Bootstrap Skeleton
    14. Exercise 7.2.7 Your First Bootstrap
    15. Challenge 7.2.8 1. Photo Portfolio
    16. Connection 7.2.9 Container Docs
    17. 7.3 The Bootstrap Grid System

    18. Video 7.3.1 The Grid System
    19. Check for Understanding 7.3.2 The Bootstrap Grid Quiz
    20. Example 7.3.3 Grid System Example
    21. Example 7.3.4 Column Overflow
    22. Example 7.3.5 Different Device Sizes
    23. Example 7.3.6 Example Layout
    24. Example 7.3.7 Realty: Grid System
    25. Exercise 7.3.8 Grid Practice
    26. Exercise 7.3.9 Endangered Animals
    27. Challenge 7.3.10 2. Photo Portfolio
    28. Connection 7.3.11 Grid System Docs
    29. 7.4 Bootstrap Components

    30. Video 7.4.1 Bootstrap Components
    31. Quiz 7.4.2 Bootstrap Components Quiz
    32. Example 7.4.3 Text Formats
    33. Example 7.4.4 Making Buttons
    34. Example 7.4.5 Button Groups
    35. Example 7.4.6 Using Icons
    36. Example 7.4.7 Favicons
    37. Example 7.4.8 Realty: Buttons and Page Headers
    38. Exercise 7.4.9 Header and Buttons
    39. Exercise 7.4.10 Icon Buttons
    40. Challenge 7.4.11 3. Photo Portfolio
    41. Connection 7.4.12 Button Docs
    42. Connection 7.4.13 Icon Docs
    43. 7.5 More Bootstrap Components

    44. Video 7.5.1 More Bootstrap Components
    45. Check for Understanding 7.5.2 More Bootstrap Components Quiz
    46. Example 7.5.3 Thumbnail Skeleton
    47. Example 7.5.4 Kitten Thumbnails
    48. Example 7.5.5 Table Skeleton
    49. Example 7.5.6 Striped Tables
    50. Example 7.5.7 Realty: Thumbnail Links
    51. Exercise 7.5.8 Shoe Shop
    52. Exercise 7.5.9 Adding Captions
    53. Exercise 7.5.10 Bootstrap Tables
    54. Exercise 7.5.11 Favorite TV Shows
    55. Exercise 7.5.12 Favorite Animals
    56. Challenge 7.5.13 4. Photo Portfolio
    57. Connection 7.5.14 Thumbnail Docs
    58. Connection 7.5.15 Table Docs
    59. Example 7.5.16 Image Hover Effects
    60. 7.6 Navigation Bars

    61. Video 7.6.1 Navigation Bars
    62. Check for Understanding 7.6.2 Navigation Bars Quiz
    63. Connection 7.6.3 Navbar Docs
    64. Example 7.6.4 Simple Nav Tabs
    65. Example 7.6.5 Basic Navbar
    66. Example 7.6.6 Basic Collapsable Navbar
    67. Example 7.6.7 Realty: Navbar
    68. Example 7.6.8 Realty: Collapsable Navbar
    69. Exercise 7.6.9 Navigation Links
    70. Exercise 7.6.10 Navbar Puzzles
    71. Exercise 7.6.11 Making Navbars
    72. Challenge 7.6.12 5. Photo Portfolio
    73. 7.7 Drop Down Menus

    74. Video 7.7.1 Drop Down Menus
    75. Check for Understanding 7.7.2 Drop Down Menus Quiz
    76. Example 7.7.3 Basic Dropdown
    77. Example 7.7.4 Realty: Dropdown
    78. Exercise 7.7.5 World Traveller
    79. Exercise 7.7.6 Which Animal?
    80. Exercise 7.7.7 Dropdown Nav
    81. Challenge 7.7.8 6. Photo Portfolio
    82. Connection 7.7.9 Drop Down Menu Docs
    83. Badge 7.7.10 Menu Badge
    84. 7.8 Using Bootstrap Examples to Create a Media Carousel

    85. Video 7.8.1 Using Bootstrap Examples
    86. Check for Understanding 7.8.2 Using Bootstrap Examples Quiz
    87. Connection 7.8.3 Bootstrap Starter Templates
    88. Example 7.8.4 Realty: Carousel
    89. Example 7.8.5 Carousel Bootstrap Template
    90. Connection 7.8.6 Exploring Creative Commons
    91. Example 7.8.7 Using Proper Media Sizes
    92. Free Response 7.8.8 Generating Media
    93. Challenge 7.8.9 7. Photo Portfolio
    94. 7.9 Bootstrap Quiz

    95. Unit Quiz 7.9.1 Bootstrap Quiz
    96. Badge 7.9.2 Bootstrap Badge
  8. Bootstrap Project

    1. 8.1 Bootstrap Project

    2. Example 8.1.1 Example Mobile Responsive Website
    3. Connection 8.1.2 Real World Bootstrap: University of Washington
    4. Connection 8.1.3 Real World Bootstrap: Maple
    5. Challenge 8.1.4 Project: Create a Mobile Responsive Website
    6. Badge 8.1.5 Bootstrap Project Badge
  9. Storing and Collecting Data

    1. 9.1 Collecting and Storing Data

    2. Video 9.1.1 Collecting and Storing Data
    3. Check for Understanding 9.1.2 Collecting and Storing Data
    4. Connection 9.1.3 How Much is Your Data Worth?
    5. Free Response 9.1.4 How Much is Your Data Worth Responses
    6. Example 9.1.5 Does Your Browser Have Local Storage?
    7. Example 9.1.6 Local Storage
    8. Connection 9.1.7 Cookies vs. Local Storage
    9. Free Response 9.1.8 Cookies vs. Local Storage Responses
    10. 9.2 Storing Data with Local Storage

    11. Video 9.2.1 Storing Data with Local Storage
    12. Check for Understanding 9.2.2 Storing Data with Local Storage
    13. Example 9.2.3 Saving Your Name
    14. Example 9.2.4 Save Button Clicks
    15. Exercise 9.2.5 Save Background Color
    16. Exercise 9.2.6 How Many Times Have You Visited This Site
    17. 9.3 Storing Data Structures with Local Storage

    18. Video 9.3.1 Storing Data Structures with Local Storage
    19. Check for Understanding 9.3.2 Storing Data Structures with Local Storage
    20. Example 9.3.3 Using JSON
    21. Example 9.3.4 Last Three Backgrounds
    22. Exercise 9.3.5 Print To Do List
    23. Exercise 9.3.6 Tracking Scores
    24. Challenge 9.3.7 Saving Active Divs
    25. 9.4 JavaScript Objects

    26. Video 9.4.1 Using Objects in JavaScript
    27. Check for Understanding 9.4.2 Using Objects in JavaScript
    28. Example 9.4.3 Person Object
    29. Example 9.4.4 Using Functions in Objects
    30. Exercise 9.4.5 A Contact Object
    31. Exercise 9.4.6 Add Contact
    32. Exercise 9.4.7 Retrieve Contacts
    33. Challenge 9.4.8 Print Contact List + Styling
    34. 9.5 Using Input Fields

    35. Video 9.5.1 Using Input Fields
    36. Check for Understanding 9.5.2 Using Input Fields
    37. Example 9.5.3 Input Types
    38. Example 9.5.4 Serialized Form Array
    39. Example 9.5.5 Storing Input in Local Storage
    40. Example 9.5.6 Upload a File
    41. Exercise 9.5.7 To-Do List
    42. Exercise 9.5.8 To-Do List with Local Storage
    43. Exercise 9.5.9 Birthday Tracker
    44. Exercise 9.5.10 Verify with File MIME Types
    45. 9.6 Challenge: Create a Survey

    46. Connection 9.6.1 Survey Challenge Overview
    47. Free Response 9.6.2 Survey Brainstorm
    48. Exercise 9.6.3 Create Survey Form
    49. Challenge 9.6.4 Complete your Survey
    50. 9.7 Storing Data with Firebase

    51. Video 9.7.1 Storing Data with Firebase
    52. Check for Understanding 9.7.2 Storing Data with Firebase
    53. Example 9.7.3 Storing and Collecting Data with Firebase
    54. Exercise 9.7.4 Introduce Yourself to Firebase
    55. Exercise 9.7.5 Storing a Book Object
    56. Exercise 9.7.6 Retrieving a Book Object
    57. 9.8 Traversing Data with Firebase

    58. Video 9.8.1 Traversing Data with Firebase
    59. Check for Understanding 9.8.2 Traversing Data with Firebase
    60. Example 9.8.3 Adding New Nodes
    61. Example 9.8.4 Visualizing Firebase
    62. Free Response 9.8.5 Visualizing Firebase
    63. Exercise 9.8.6 Retrieving Authors
    64. Exercise 9.8.7 Diary Entry
    65. 9.9 Challenge: Collecting User Clicks

    66. Connection 9.9.1 Storing Click Data Overview
    67. Challenge 9.9.2 Get Date and Element
    68. Challenge 9.9.3 Storing Click Data
    69. 9.10 For/In Loops

    70. Video 9.10.1 For/In Loops
    71. Check for Understanding 9.10.2 For/In Loops Quiz
    72. Example 9.10.3 Find Users with Same Name
    73. Example 9.10.4 Nested For/In Loops
    74. Exercise 9.10.5 Hogwarts
    75. Exercise 9.10.6 How Many Guests?
    76. Challenge 9.10.7 Visualizing User Clicks
    77. 9.11 Using APIs

    78. Video 9.11.1 Using APIs
    79. Check for Understanding 9.11.2 Using APIs
    80. Example 9.11.3 Using an API Key
    81. Example 9.11.4 Generate an API Key
    82. Exercise 9.11.5 Creating a Dictionary API
    83. Exercise 9.11.6 Using a Movie API
    84. 9.12 Server-side Languages

    85. Video 9.12.1 Web Stacks and Server-side Languages
    86. Video 9.12.2 Server-side Languages Live Coding
    87. Example 9.12.3 Server-side Hello World
    88. Example 9.12.4 Divide Two Mystery Numbers
    89. Exercise 9.12.5 Server-side About Me
    90. Exercise 9.12.6 Classify Trees Server-side
    91. Exercise 9.12.7 Calculate Mystery Numbers
    92. 9.13 Storing and Collecting Data Quiz

    93. Unit Quiz 9.13.1 Storing and Collecting Data Quiz
  10. How to Build and Maintain a Website

    1. 10.1 Choosing a Domain Name

    2. Video 10.1.1 Choosing a Domain Name
    3. Check for Understanding 10.1.2 Choosing a Domain Name
    4. Connection 10.1.3 How to Choose a Domain Name
    5. Free Response 10.1.4 How to Choose a Domain Name
    6. Notes 10.1.5 Choosing a Domain Name
    7. Free Response 10.1.6 Choosing a Domain Name
    8. 10.2 Hosting Your Website

    9. Video 10.2.1 Personal Servers vs. Web Server Providers
    10. Check for Understanding 10.2.2 Personal Servers vs. Web Server Providers
    11. Connection 10.2.3 How to Host a Website
    12. Article 10.2.4 Internet Protocols
    13. Article 10.2.5 Activity: Internet Protocols
    14. Free Response 10.2.6 How to Host a Website
    15. Article 10.2.7 Understanding IP Addresses
    16. Connection 10.2.8 Hosting a Website from Your Own Home
    17. Free Response 10.2.9 Self-Hosted or Web Server Provider?
    18. 10.3 Using a CMS

    19. Video 10.3.1 Using a CMS
    20. Check for Understanding 10.3.2 Using a CMS
    21. Connection 10.3.3 How to Choose a CMS
    22. Free Response 10.3.4 How to Choose a CMS
    23. Connection 10.3.5 Comparing CMS Systems
    24. Free Response 10.3.6 Comparing CMS Systems
    25. 10.4 What is Web Optimization?

    26. Video 10.4.1 What is Web Optimization?
    27. Check for Understanding 10.4.2 What is Web Optimization?
    28. Connection 10.4.3 Website Folder Structure
    29. Notes 10.4.4 File Naming Conventions
    30. Free Response 10.4.5 Folders and Files
    31. 10.5 Optimizing Web Information

    32. Video 10.5.1 Optimizing Web Information
    33. Check for Understanding 10.5.2 Optimizing Web Information
    34. Connection 10.5.3 How Search Works
    35. Free Response 10.5.4 How Search Works
    36. Connection 10.5.5 What is Search Engine Optimization (SEO)?
    37. Free Response 10.5.6 SEO Definition
    38. Connection 10.5.7 Ethical Search Optimization
    39. Free Response 10.5.8 Ethical Search Optimization
    40. Connection 10.5.9 Yoast Analyzer
    41. Free Response 10.5.10 Yoast Tool Activity
    42. 10.6 Web Site Maintenance

    43. Video 10.6.1 Introduction: Why Website Maintenance?
    44. Exercise 10.6.2 One Pager: Site Maintenance
    45. 10.7 How to Build and Maintain a Website Quiz

    46. Unit Quiz 10.7.1 How to Build and Maintain a Website Quiz
  11. Final Project

    1. 11.1 Project Overview

    2. Resource 11.1.1 Final Project Overview
    3. Connection 11.1.2 Innovative Brainstorm
    4. Free Response 11.1.3 Innovative Brainstorm
    5. 11.2 Planning Your Site

    6. Free Response 11.2.1 Determine your Objectives
    7. Free Response 11.2.2 Create a Sitemap
    8. Free Response 11.2.3 Create a Project Timeline
    9. 11.3 Creating Your Site

    10. Free Response 11.3.1 Create your Site
    11. 11.4 Providing Feedback

    12. Connection 11.4.1 Evaluating an Innovation
    13. Free Response 11.4.2 Evaluating an Innovation
    14. Free Response 11.4.3 User Testing 1
    15. Free Response 11.4.4 User Testing 2
    16. 11.5 Presenting Your Innovation

    17. Free Response 11.5.1 Make Changes and Update Version
    18. Presentation 11.5.2 Present your Innovation
  12. JavaScript Bootcamp

    1. 12.1 Hello World

    2. Video 12.1.1 Hello World
    3. Check for Understanding 12.1.2 Hello World Quiz
    4. Example 12.1.3 Hello World
    5. Exercise 12.1.4 Your Name and Hobby
    6. 12.2 Variables

    7. Video 12.2.1 Variables
    8. Check for Understanding 12.2.2 Variables Quiz
    9. Example 12.2.3 Basic Variables
    10. Exercise 12.2.4 Daily Activities
    11. 12.3 User Input

    12. Video 12.3.1 User Input
    13. Check for Understanding 12.3.2 User Input Quiz
    14. Example 12.3.3 Basic User Input
    15. Exercise 12.3.4 Dinner Plans
    16. Badge 12.3.5 User Input Badge
    17. 12.4 Basic Math in JavaScript

    18. Video 12.4.1 Basic Math in JavaScript
    19. Check for Understanding 12.4.2 Basic Math in JavaScript Quiz
    20. Example 12.4.3 Simple Calculator
    21. Example 12.4.4 Dollars to Pounds
    22. Example 12.4.5 Dividing Up Groups
    23. Exercise 12.4.6 T-Shirt Shop
    24. Exercise 12.4.7 Running Speed
    25. 12.5 Booleans

    26. Video 12.5.1 Booleans
    27. Check for Understanding 12.5.2 Booleans Quiz
    28. Example 12.5.3 First Boolean
    29. Exercise 12.5.4 Do You Have a Dog?
    30. 12.6 Logical Operators

    31. Video 12.6.1 Logical Operators
    32. Check for Understanding 12.6.2 Logical Operators Quiz
    33. Example 12.6.3 Light Switch
    34. Example 12.6.4 President
    35. Example 12.6.5 Wasting Time
    36. Exercise 12.6.6 Can You Graduate?
    37. Exercise 12.6.7 School's Out
    38. 12.7 Comparison Operators

    39. Video 12.7.1 Comparison Operators
    40. Check for Understanding 12.7.2 Comparison Operators Quiz
    41. Example 12.7.3 Voting Age
    42. Example 12.7.4 Grade Range
    43. Exercise 12.7.5 Rolling Dice
    44. Exercise 12.7.6 Girl Scout Designation
    45. 12.8 If Statements

    46. Video 12.8.1 If Statements
    47. Check for Understanding 12.8.2 If Statements Quiz
    48. Example 12.8.3 Negative Numbers
    49. Example 12.8.4 Great Names
    50. Example 12.8.5 Even and Odd
    51. Example 12.8.6 Secret Password
    52. Exercise 12.8.7 Teenagers
    53. Exercise 12.8.8 Dietary Restrictions
    54. Badge 12.8.9 Conditionals Badge
    55. 12.9 For Loops in JavaScript

    56. Video 12.9.1 Basic For Loop
    57. Check for Understanding 12.9.2 For Loops Quiz
    58. Example 12.9.3 For Loop
    59. Exercise 12.9.4 Chalkboard
    60. 12.10 For Loop Practice

    61. Video 12.10.1 For Loop Examples
    62. Check for Understanding 12.10.2 For Loop Examples Quiz
    63. Example 12.10.3 For Loop Sum
    64. Exercise 12.10.4 Better Sum
    65. Exercise 12.10.5 Factorial
    66. Exercise 12.10.6 All Dice Values
    67. 12.11 Random Numbers

    68. Video 12.11.1 Random Numbers
    69. Check for Understanding 12.11.2 Random Numbers Quiz
    70. Example 12.11.3 Rolling a Die
    71. Example 12.11.4 Flipping a Coin
    72. Exercise 12.11.5 Lots of Rolls
    73. 12.12 While Loops

    74. Video 12.12.1 While Loops
    75. Check for Understanding 12.12.2 While Loops Quiz
    76. Example 12.12.3 While Loop Countdown
    77. Exercise 12.12.4 Inventory
    78. Exercise 12.12.5 Fibonacci
    79. 12.13 Loop and a Half

    80. Video 12.13.1 Loop and a Half
    81. Check for Understanding 12.13.2 Loop and a Half Quiz
    82. Example 12.13.3 Adding Up Numbers
    83. Exercise 12.13.4 Snake Eyes
    84. Exercise 12.13.5 Better Password Prompt
    85. Badge 12.13.6 Looper Badge
    86. 12.14 Functions and Parameters 1

    87. Video 12.14.1 Functions and Parameters 1
    88. Check for Understanding 12.14.2 Functions and Parameters Quiz 1
    89. Example 12.14.3 Double Number
    90. Exercise 12.14.4 Square
    91. Exercise 12.14.5 Triple
    92. 12.15 Functions and Parameters 2

    93. Video 12.15.1 Functions and Parameters 2
    94. Check for Understanding 12.15.2 Functions and Parameters Quiz 2
    95. Example 12.15.3 Sum Function
    96. Exercise 12.15.4 Area of Triangle
    97. Exercise 12.15.5 Height in Meters
    98. 12.16 Functions and Return Values 1

    99. Video 12.16.1 Functions and Return Values 1
    100. Check for Understanding 12.16.2 Functions and Return Values Quiz
    101. Example 12.16.3 Double Number
    102. Exercise 12.16.4 Square with Return Values
    103. Exercise 12.16.5 Triple with Return Values
    104. Exercise 12.16.6 Gymnastics Mats
    105. 12.17 Functions and Return Values 2

    106. Video 12.17.1 Functions and Return Values 2
    107. Check for Understanding 12.17.2 Functions and Return Values Quiz 2
    108. Example 12.17.3 Return Values
    109. Exercise 12.17.4 Is It Even?
    110. Exercise 12.17.5 Max
    111. 12.18 Local Variables and Scope

    112. Video 12.18.1 Local Variables and Scope
    113. Check for Understanding 12.18.2 Local Variables and Scope Quiz
    114. Example 12.18.3 Return Values
    115. Exercise 12.18.4 Local Variables
    116. Badge 12.18.5 JavaScript Exercises Badge
    117. 12.19 Intro to Lists/Arrays

    118. Video 12.19.1 Intro to Lists/Arrays
    119. Check for Understanding 12.19.2 Intro to Lists/Arrays Quiz
    120. Example 12.19.3 Making an Array
    121. Exercise 12.19.4 List of Places to Travel
    122. Exercise 12.19.5 List of Even Numbers
    123. 12.20 Indexing Into an Array

    124. Video 12.20.1 Indexing Into an Array
    125. Check for Understanding 12.20.2 Indexing into an Array Quiz
    126. Example 12.20.3 Array Indexing Practice
    127. Exercise 12.20.4 Top Websites
    128. 12.21 Adding/Removing From an Array

    129. Video 12.21.1 Adding/Removing From an Array
    130. Check for Understanding 12.21.2 Adding/Removing from an Array Quiz
    131. Example 12.21.3 Add/Remove From Array
    132. Exercise 12.21.4 Practice Push and Pop
    133. 12.22 Array Length and Looping Through Arrays

    134. Video 12.22.1 Array Length and Looping Through Arrays
    135. Check for Understanding 12.22.2 Array Length and Looping Through Arrays Quiz
    136. Example 12.22.3 Print Shopping List
    137. Example 12.22.4 Sum Array
    138. Exercise 12.22.5 Product of List
    139. Exercise 12.22.6 Print Flight Itinerary
    140. Exercise 12.22.7 Double List
    141. Exercise 12.22.8 Evens Only List
    142. Exercise 12.22.9 Reverse List
  13. Using JavaScript Libraries

    1. 13.1 Introduction to jQuery

    2. Video 13.1.1 Introduction to jQuery
    3. Check for Understanding 13.1.2 Introduction to jQuery
    4. Example 13.1.3 Using the Selector
    5. Example 13.1.4 jQuery Functions
    6. Connection 13.1.5 Exploring the jQuery Documentation
    7. Free Response 13.1.6 Exploring the jQuery Documentation
    8. Exercise 13.1.7 High School Info
    9. Exercise 13.1.8 Change Paragraph Size
    10. Exercise 13.1.9 jQuery Table
    11. Challenge 13.1.10 Smart jQuery Table
    12. 13.2 Iterating with jQuery

    13. Video 13.2.1 Iterating with jQuery
    14. Check for Understanding 13.2.2 Iterating with jQuery
    15. Example 13.2.3 Printing To Do List
    16. Example 13.2.4 Smart Table Using Each
    17. Exercise 13.2.5 Mark Complete
    18. Exercise 13.2.6 Fix Width
    19. Exercise 13.2.7 Strobe Light
    20. 13.3 Animations with jQuery

    21. Video 13.3.1 Animations with jQuery
    22. Check for Understanding 13.3.2 Animations with jQuery
    23. Example 13.3.3 .animate Grow
    24. Example 13.3.4 Animation Queue
    25. Example 13.3.5 Toggle
    26. Exercise 13.3.6 Bouncy Ball
    27. Exercise 13.3.7 Extracurriculars
    28. Exercise 13.3.8 FrankenDiv
    29. 13.4 Callback Functions and Synchronization

    30. Video 13.4.1 Callback Functions and Synchronization
    31. Check for Understanding 13.4.2 Callback Functions and Synchronization
    32. Example 13.4.3 .animate Execution Delay
    33. Example 13.4.4 .animate Per-Element Callback
    34. Exercise 13.4.5 Grow and Shrink Counter
    35. Exercise 13.4.6 Progress Bar
    36. Challenge 13.4.7 The Wave
    37. 13.5 Using Multiple Files in JavaScript

    38. Video 13.5.1 Using Multiple Files in JavaScript
    39. Check for Understanding 13.5.2 Using Multiple Files in JavaScript
    40. Example 13.5.3 Execution Order
    41. Example 13.5.4 Accessibility Button
    42. Exercise 13.5.5 Our First js File
    43. Exercise 13.5.6 Fix Load Order
    44. Challenge 13.5.7 The Wave with .js
    45. 13.6 Using JavaScript Libraries Quiz

    46. Unit Quiz 13.6.1 Using JavaScript Libraries Quiz
  14. Project: Build an Interactive Resume!

    1. 14.1 Creating a Resume

    2. Connection 14.1.1 Interactive Resume Project Overview
    3. Connection 14.1.2 What is a Resume?
    4. Free Response 14.1.3 What is a Resume?
    5. Free Response 14.1.4 Draft Your Resume
    6. 14.2 Layout and Web Design Theory

    7. Video 14.2.1 Layout and Web Design Theory
    8. Check for Understanding 14.2.2 Layout and Web Design Theory
    9. Free Response 14.2.3 Learning More About the Z and F Layouts
    10. Connection 14.2.4 Explore Resume Layouts
    11. Free Response 14.2.5 Explore Resume Layouts
    12. Free Response 14.2.6 Sample Interactive Layouts
    13. 14.3 Interactive Resume Development

    14. Free Response 14.3.1 Draft Your Interactive Resume
    15. Challenge 14.3.2 Online Interactive Resume Draft
    16. Free Response 14.3.3 Evaluating an Interactive Resume
    17. Challenge 14.3.4 Final Draft Interactive Resume
  15. Web Design Level 1 Certification Practice

    1. 15.1 Practice #1: Intro to the Internet

    2. Quiz 15.1.1 Quiz: Intro to the Internet
    3. Notes 15.1.2 Practice #1 Reflection
    4. 15.2 Practice #2: HTML

    5. Quiz 15.2.1 Quiz: HTML
    6. Notes 15.2.2 Practice#2 Reflection
    7. 15.3 Practice #3: CSS

    8. Quiz 15.3.1 Quiz: CSS
    9. Notes 15.3.2 Practice #3 Reflection
    10. 15.4 Practice #4: Advanced HTML & CSS

    11. Quiz 15.4.1 Quiz: Advanced HTML & CSS
    12. Notes 15.4.2 Practice #4 Reflection