Web Development Foundations
- Grades: 6-8
- Number of Students: 30 or 100
- Number of Lessons: 4 Units, 3 Projects
- Hours of Content: 60
- Additional Resources: Flyer, Syllabus
Highlights:
This course teaches students the basics of web design and web development. This course will dive into the following topics: basic art principles, user experience and interface design, responsive layouts, accessibility, HTML, CSS, and JavaScript. At the end of this course, students will be able to build responsive websites and web-based tools that are designed with a target audience and accessibility needs in mind.
Certifications:
Upon completing this course, students will be prepared to earn the following industry-recognized certification:
- KnowledgePillars HTML & CSS Coding Specialist
- Pearson IT Specialist HTML and CSS
- ICT Essentials Web Design Essentials
Curriculum or Lesson Topics:
Course Outline:
Designing for the Internet
Students learn the fundamentals of visual design, how to create layouts for the web using design software, and the best practices to make designs that a variety of people can enjoy.
Web Development Basics
Students begin the transition from web designer to web developer as we discuss the workings of the internet, the web browser and the foundational skills that will allow us to turn our designs to websites.
JavaScript Basics & HTML Forms
Students will develop an understanding of the programming language used for this course, JavaScript, which is used in almost every modern website. So in this unit we start with the basics such as using data types for different purposes, writing expressions, and programming behavior with functions.
Designing & Developing Responsive Websites
Students will conclude by utilizing more advanced concepts to take their CSS and JavaScript knowledge to the next level as we build a variety of interactive projects.
Projects:
Web Design Wire Frames
Students create a mood board and a collection of both block and high-fidelity wireframes utilizing their understanding of UI and UX design, the web design workflow, and visual hierarchy.
Green Team Website
Students create a responsive static website using HTML and CSS from scratch, exercising their understanding of semantic and non-semantic HTML elements, typography, and positioning.
Color Picker
Using HTML, CSS, and JavaScript, students will create a color picker application that can generate RGBA values and hexadecimal color code.
Technical Requirements:
Operating System
- Chromebook: Chome OS 100.0 or later
- Windows: 7, 8, 8.1, 10 or later
- Mac: OS X El Capitan 10.11 or later
- Linux: 64-bit Ubuntu 18.04+, Debian 10+, openSUSE 15.2+, or Fedora Linux 32+
Software Installed
- Google Chrome