Students learn about the history of computer science and the first basic steps of HTML.
History of Computer Science
HTML Basics
HTML Heading
2-IC-20, 3A-AP-18, 3A-AP-17, 2-AP-11, 2-DA-07
Students learn the different parts and pieces that make up a computer and how each part contributes to the whole. They learn to add color to their text in HTML.
Computer Parts
Hardware v Software
Text Colors
2-CS-02, 2-CS-03, 3A-AP-18, 3A-AP-17, 2-AP-16, 2-AP-11, 2-DA-07, 3B-AP-22, 3B-AP-24
Students learn the basics of how the internet actually works and how to add fonts to their text in HTML.
How the internet works
Fonts
2-NI-04, 2-AP-11, 2-AP-17, 2-AP-16, 2-DA-07, 3B-AP-22, 3B-AP-21, 3B-AP-19, 3B-AP-16, 3B-AP-14, 3B-AP-11, 3A-AP-18, 3A-AP-17, 3A-AP-16
Students examine more specifics of how different components work together to make the internet function as we know it. They add structure to their HTML files.
How the Internet Works
HTML as a Language
HTML Structure
2-NI-04, 3B-NI-03, 3A-CS-03, 2-AP-11, 2-CS-02, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3A-AP-23, 3B-AP-14, 3B-AP-19, 3A-IC-24
Students discover basic troubleshooting strategies for some common troubles with technology. They add background colors and titles to their HTML file.
Troubleshooting
Background Color
HTML Title
2-AP-17, 2-CS-03, 2-AP-11, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3A-AP-23, 3B-AP-14, 3B-AP-19, 3B-AP-22
Students practice using troubleshooting techniques to solve some examples of issues with technology. They add paragraphs, breaks, and dividers to their HTML file.
Troubleshooting
Paragraphs
Breaks/Dividers
2-AP-11, 2-CS-03, 2-AP-17, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-14, 3B-AP-19, 3B-AP-22
Students discover some strategies for debugging their code and fixing their own issues. They add ordered and unordered lists to their HTML file.
Debugging Strategies
Ordered/Unordered Lists
2-AP-11, 2-CS-03, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3A-AP-23, 3B-AP-14, 3B-AP-19, 3B-AP-22, 3B-AP-24
Students explore different careers in Web Development and what kinds of schooling and preparation are needed. They add text align to their HTML file.
Career Exploration
Text Align
2-IC-20, 2-AP-17, 2-AP-11, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-11, 3B-AP-14, 3B-AP-22, 3B-AP-19
Students dive deeper into a career of their choice and learn more specifics about what it takes to go into that career field.
Career Exploration
Links
2-AP-11, 2-AP-17, 2-IC-20, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-22
Students analyze what it means to be a good Digita Citizen and how to be respectful with technology. They add images to their HTML files.
Digital Citizenship
Images
2-IC-20, 2-NI-05, 2-AP-17, 2-AP-11, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22
Students explore some strategies to keep safe while using technology. They add buttons to their HTML files.
Digital Safety
Buttons
2-AP-17, 3A-NI-05, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-14, 3B-AP-21, 3B-AP-22, 3B-AP-19
Students examine some different programming languages and the advantages and disadvantages of each. They add background images to their HTML files.
Programming Languages
Background Image
2-AP-13, 2-AP-17, 2-IC-20, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-10, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22
Students analyze what a digital footprint is and take a look at their own digital footprint so far. They discuss strategies to have a healthy footprint. They add videos to their HTML files.
Digital Footprint
Videos
2-AP-17, 2-IC-20, 3A-IC-24, 3B-IC-25, 3B-IC-26, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22
Students critically think about the accessibility of different programs and applications. They add image links to their HTML files.
Digital Accessibility
Image Link
2-IC-21, 2-IC-20, 2-AP-17, 2-AP-13, 2-CS-01, 3A-AP-17, 3A-AP-21, 3A-IC-25, 3A-AP-13, 3A-AP-16, 3A-AP-18, 3B-AP-14, 3B-AP-19, 3B-AP-21
Students discuss how to have a healthy relationship with social media and technology in their personal life. They add marquees to their HTML file.
Social Media
Marquees
2-AP-13, 2-AP-17, 2-IC-20, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22, 3B-IC-25, 3B-IC-27, 3A-IC-24
Students form teams and create a plan to work together to accomplish given objectives in a programming project.
Team Project
2-CS-01, 2-CS-02, 2-DA-07, 2-AP-11, 2-AP-13, 2-AP-15, 2-AP-16, 2-AP-17, 2-AP-18, 2-IC-22, 3A-DA-09, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3A-AP-23, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22, 3B-AP-17, 3A-AP-22
Students practice giving and recieiving feedback with other teams on their programming projects.
Team Project
Feedback
2-CS-01, 2-CS-02, 2-DA-07, 2-AP-11, 2-AP-13, 2-AP-15, 2-AP-16, 2-AP-17, 2-AP-18, 2-IC-22, 3A-DA-09, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3A-AP-19, 3A-AP-23, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22, 3B-AP-17, 3A-AP-22
Teams present their projects and what they learned with the class.
Team Project Presentations
2-CS-01, 2-CS-02, 2-DA-07, 2-AP-11, 2-AP-13, 2-AP-15, 2-AP-16, 2-AP-17, 2-AP-18, 2-IC-22, 2-AP-19, 3A-DA-09, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3A-AP-19, 3A-AP-22, 3A-AP-23, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22
Students are introduced to the CSS language and the benefits of having an external style sheet. They create separate CSS files and connect them to their HTML files.
Intro to CSS
External Style Sheet
3B-AP-22, 3B-AP-21, 3B-AP-19, 3B-AP-11, 3B-AP-10, 3A-AP-18, 3A-AP-17, 3A-AP-16, 3A-AP-13
Students add text shadowing and rounded corners to their CSS and HTML files.
Text Shadow
Rounded Corners
3B-AP-22, 3B-AP-19, 3B-AP-14, 3B-AP-11, 3A-AP-18, 3A-AP-17, 3A-AP-16, 3A-AP-13, 2-AP-17
Students explore the need for data compression and the difference between lossy and lossless compression techniques. They add box shadows to their CSS and HTML files.
Data Compression
Box Shadow
2-AP-11, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-10, 3B-AP-11, 3B-AP-19, 3B-AP-21, 3B-AP-22
Students examine the challenges and advantages of modern data storage approaches. They add color gradient to their CSS and HTML files.
Color Gradient
Storage
2-AP-11, 2-AP-13, 2-AP-17, 2-AP-16, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22, 3B-AP-12
Students learn the importance of good code documentation and how to add comments in their HTML and CSS files.
Documenting Code
Comments in HTML/CSS
2-AP-11, 2-AP-13, 2-AP-19, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22, 3A-AP-23
Students learn how to differentiate their tags by using class names. They also practice using the color picker in their CSS and HTML files.
Classes
Color Picker
3B-AP-22, 3B-AP-21, 3B-AP-19, 3B-AP-14, 3B-AP-11, 3B-AP-10, 3A-AP-23, 3A-AP-18, 3A-AP-17, 3A-AP-16, 3A-AP-13, 3A-DA-09, 2-AP-16, 2-AP-11, 2-DA-07
Students practice gathering data and analyzing it for patterns. They add margins and padding to their CSS and HTML files.
Data
Margins
Padding
2-DA-07, 2-AP-11, 2-AP-13, 2-AP-17, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22
Students learn how to change appearance when the cursor hovers over an item by using pseudo selectors. They add opacity to their CSS and HTML files.
Pseudo Selectors
Opacity
3B-AP-22, 3B-AP-21, 3B-AP-19, 3B-AP-14, 3B-AP-11, 3B-AP-10, 3A-AP-23, 3A-AP-18, 3A-AP-17, 3A-AP-16, 3A-AP-13, 2-AP-16, 2-AP-11, 2-DA-07
Students criticaly examine design choices and learn some strategies for effective web design. They further compartmentalize their code with the use of Div tags.
Design Tips
Div Tags
2-AP-11, 2-AP-13, 2-AP-17, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22
Students learn more advanced ways to design buttons and lists on their HTML files.
Button Design
List Styles
3B-AP-21, 3B-AP-19, 3B-AP-11, 3B-AP-10, 3A-AP-23, 3A-AP-18, 3A-AP-17, 3A-AP-16, 3A-AP-13, 3A-DA-09, 2-AP-16, 2-AP-11, 2-DA-07
Students discover the need for market research and practice collecting data to better understand a population. They add icons to their CSS and HTML files.
Market Research
CSS Icons
2-DA-08, 2-AP-15, 2-IC-22, 3A-DA-11, 3A-AP-17, 3A-AP-13, 3A-AP-16, 3A-AP-18, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22
Students learn how to add borders and more advanced approaches to positioning items on their web pages.
Borders
Positioning
3B-AP-22, 3B-AP-21, 3B-AP-19, 3B-AP-14, 3B-AP-11, 3B-AP-10, 3A-AP-23, 3A-AP-18, 3A-AP-17, 3A-AP-16, 3A-AP-13, 3A-DA-09, 2-AP-16, 2-AP-11, 2-DA-07
Students learn to make their web pages responsive to different screen sizes as they add media queries to their CSS and HTML code. They add styling to their background images.
Media Queries
Background Image Styles
3B-AP-22, 3B-AP-21, 3B-AP-19, 3B-AP-14, 3B-AP-11, 3B-AP-10, 3A-AP-23, 3A-AP-18, 3A-AP-17, 3A-AP-16, 3A-AP-13, 3A-DA-09, 2-AP-16, 2-AP-11, 2-DA-07
Students are introduced to the cybersecurity concept of cryptography and practice encrypting messages. They are also introduced to Bootstrap and learn to connect to the Bootstrap library.
Bootstrap
Cryptography
3B-NI-04, 3B-AP-18, 2-NI-06, 2-DA-07, 2-AP-11, 2-AP-13, 2-AP-17, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22
Students explore other encryption techniques as they practice with the pig pen cipher. They practice using different Bootstrap classes in their CSS And HTML files.
Cipher
Bootstrap Classes
2-NI-06, 2-DA-07, 2-AP-11, 2-AP-13, 2-AP-17, 3B-NI-04, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3A-AP-15, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22
Students analyze different legal and ethical concerns that arise with advancing technologies in today's world. They learn to add Bootstrap Grids to their CSS and HTML files.
Legal and Ethical Concerns
Bootstrap Grid
3A-AP-18, 2-AP-11, 2-AP-13, 2-AP-17, 2-IC-23, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22
Students get further practice using Bootstrap's 12 column grid. They also add Jumbotrons to their CSS and HTML files.
12 Column Grid
Jumbotron
3B-AP-22, 3B-AP-21, 3B-AP-19, 3B-AP-14, 3B-AP-11, 3B-AP-10, 3A-AP-23, 3A-AP-18, 3A-AP-17, 3A-AP-16, 3A-AP-13, 3A-DA-09, 2-AP-16, 2-AP-11, 2-DA-07
Students examine how personal data can be collected and explore their own opinions on the prevalence of personal data online. They learn to add cards to their CSS and HTML files.
Personal Data
Cards
2-IC-23, 3A-IC-29, 3A-IC-30, 2-AP-11, 2-AP-13, 2-AP-17, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22
Students explore different kinds of threats that exist in technology and ways they can protect or prevent against them. They learn to add carousels to their HTML and CSS files.
Types of Threat
Carousels
3A-NI-05, 3A-NI-06, 3A-NI-07, 3A-IC-24, 3A-IC-30, 2-NI-05, 2-AP-11, 2-AP-13, 2-AP-17, 2-IC-20, 2-IC-23, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-10, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22
Students learn more options that the Bootstrap library has to offer as they add a nav bar and dropdown to their CSS and HTML files.
Bootstrap Nav Bar
Bootstrap Dropdown
3B-AP-22, 3B-AP-21, 3B-AP-19, 3B-AP-14, 3B-AP-11, 3B-AP-10, 3A-AP-23, 3A-AP-18, 3A-AP-17, 3A-AP-16, 3A-AP-13, 3A-DA-09, 2-AP-16, 2-AP-11, 2-DA-07
Students examine the Digital Divide and how different people have varying access to technology. They learn to add animations to their CSS and HTML files.
Digital Equity
Animations
2-IC-21, 2-IC-20, 2-AP-17, 2-CS-01, 2-AP-11, 2-AP-13, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22, 3A-AP-21, 3A-IC-25, 3B-IC-26, 3B-IC-27
Students learn to add tranformation and transitions to their HTML and CSS files.
Transform
Transition
3B-AP-22, 3B-AP-21, 3B-AP-19, 3B-AP-14, 3B-AP-11, 3B-AP-10, 3A-AP-23, 3A-AP-18, 3A-AP-17, 3A-AP-16, 3A-AP-13, 3A-DA-09, 2-AP-16, 2-AP-11, 2-DA-07
Students learn some strategies to break down big projects into smaller, more manageable pieces. They are introduced to tables in HTML.
Tables
Break Down Big Probems
2-AP-11, 2-AP-13, 2-AP-17, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21
Students practice creative probem solving through a team activity as they try to creat shapes with a rope while blindfolded. They learn more details about creating tables in HTML.
Tables
Problem Solving
2-AP-11, 2-AP-13, 2-AP-17, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22
Students practice breaking down a big project into smaller pieces by planning out a party. They learn how to add styling to their tables in CSS And HTML.
Tables
Break Down Big Probems
2-AP-11, 2-AP-13, 2-AP-17, 3A-AP-17
Students further practice creative problem solving as they algorithmically work through a pathway puzzle. They are introduced to creating forms on their CSS and HTML files.
Problem Solving
Forms
2-AP-11, 2-AP-13, 2-AP-17, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22
Students practice communicating with peers through a blindfolded unplugged activity; They learn to create a text input on their forms in HTML and CSS.
Communication
Text Input
2-AP-11, 2-AP-13, 2-AP-17, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22
Students discuss how there are often many different ways to create a piece of code that works. Many approaches can be correct. They learn to add radio options for their HTML forms.
Radio Input
2-AP-11, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22
Students examine the presence of AI and the pros and cons of pursuing further innovations in machine learning. They learn to create a submission for inputs on their HTML and CSS forms
Artificial Intelligence
Submit Input
2-AP-11, 2-AP-12, 2-AP-17, 2-IC-20, 3A-AP-13, 3A-AP-16, 3A-AP-17, 3A-AP-18, 3B-AP-10, 3B-AP-11, 3B-AP-14, 3B-AP-19, 3B-AP-21, 3B-AP-22
Students have an opportunity to reflect on their progress over the course of the class. They examine the presence of computer science in their future and discuss ways that knowledge of computers will benefit them.
Why Computer Science Matters
2-IC-20
In this course, students will complete challenges that help solidify concepts as they use skills in a variety of ways. In order to complete tasks, students will creatively apply what they've learned by using different approaches to reach a goal. This experience closely follows challenges they would face in a technical interview, allowing them to practice. Students will create a variety of websites using different web development skills.