HTML (Web Design) Class Notes

This class will be delivered in Canvas.

In today's world, web pages are the most common medium for sharing ideas and information. Learning to design websites is an incredibly useful skill for any career path. The CodeHS Web Design course is a project-based course that teaches students how to build their own web pages. Students will learn the languages HTML and CSS, and will create their own live homepages to serve as portfolios of their creations. By the end of this course, students will be able to explain how web pages are developed and viewed on the Internet, analyze and fix errors in existing websites, and create their very own multi page websites. Students will learn the foundations of user interface design, rapid prototyping and user testing, and will work together to create professional, mobile responsive websites.

There are 9 Units in this quarter class:

1. What is the Web?
   This unit gives an introduction to web design. It focuses on what is the Internet and how a web page gets to your computer.
2. Structuring Websites
   This unit includes topics on HTML tags, attributes, and elements. Students will learn the anatomy of o HTML page and how to format text.
3. CSS for Structuring Websites
   In this unit, we will look at CSS vs HTML. Students will learn how to use CSS selectors to style webpages.
4. Create your homepage
   Students will build their own website about themselves. This site will be accessible on their own custom url on the CodeHS site, and will be continually improved by the student as they continue on in the course.
5. Advanced HTML and CSS
   In this unit, students will learn to split their webpage into separate files and to use iframes and embedding.
6. Designing User Interfaces
   In this unit, students will learn about various User Interface (UI) Design techniques.
7. Bootstrap
   Students will be introduced to Bootstrap, learn how to add Bootstrap to a webpage, and create the basic structure using Bootstrap’s container classes. Bootstrap is a free and open-source CSS framework directed at responsive, mobile-first front-end web development. It contains CSS- and JavaScript-based design templates for typography, forms, buttons, navigation, and other interface components.
8. Design Research Project
   In this unit, students will select a design concept; research it, build an example, and present on the concept.
9. Final Project
   In this project, students will design, prototype, test, and develop a final website
   ● Brainstorm ideas for a final project
   ● Plan out milestones for incremental development
   ● Design the different pages you will create for this website
   ● Prototype your designs and improve them by getting feedback from users
   ● Create your final personal website