Web Design Fundamentals Course
For Middle School & High School Students
Pre-Requisites: No prior knowledge required.
Overview:
In this course students will learn how to create web pages using HTML, how to style elements using CSS, and how to create User Interface wireframes.
Students may be taught to create and manage their files using EduBolt or via FTP. No additional software is required to be installed on any computer, unless you prefer to teach students to use an FTP client / IDE.
Units
HTML
In this unit, students will learn the basics of a web page.
Contents: 18 Lessons & 16 Assignments
Lesson | Title |
---|---|
1 | What is HTML? |
2 | Components of a Web Page |
3 | Basic Tags |
4 | Code Comments for Clarification |
5 | Headings and Hierarchy |
6 | Nested Tags |
7 | Content Formatting |
8 | Font Formatting |
9 | Emphasizing Text |
10 | HyperLinks |
11 | Colors |
12 | Tables |
13 | Advanced TAbles |
14 | Sections and Divs |
15 | Images |
16 | Frames |
17 | Forms |
18 | More Tags |
CSS
In this unit, students will learn the basics of cascading style sheets.
Contents: 18 Lessons
Lesson | Title |
---|---|
1 | What is CSS? |
2 | Syntax and Selectors |
3 | Inline Styling |
4 | Internal and External Style Sheets |
5 | Styles Cascade |
6 | CSS Box Model |
7 | Colors and Backgrounds |
8 | Opacity and Transparency |
9 | Formatting Text, Fonts and Links |
10 | Horizontal and Vertical Alignment |
11 | Tables and Lists |
12 | Height and Width |
13 | Padding and Margins |
14 | Borders and Outlines |
15 | Display and Overflow Properties |
16 | Position and Float Properties |
17 | Forms, Inputs and Buttons |
18 | Attribute Selectors |
UI Wireframing
In this unit, students will learn the basics of User Interface (UI) Wireframing.
Contents: 8 Lessons & 8 Assignments
Lesson | Title |
---|---|
1 | What are UI Wireframes? |
2 | When to Prepare a Wireframe |
3 | Wireframe Usages |
4 | Key Considerations |
5 | Low Fidelity Wireframes |
6 | High Fidelity Wireframes |
7 | To Mock-Ups and Beyond! |
8 | Recap |