Module 3.3: Typography in CSS

Overview

In this module, the two lesson help students to first understand typography on web pages, then apply that knowledge to their portfolio sites.

Lesson 1: Understanding Typography in CSS

• Estimated time required: 30 - 60 minutes
• Link to student Lesson 1 page

Tips for Delivering This Lesson

• This lesson includes a short assessment based on assigned reading. As in similar lessons earlier in the curriculum, this assessment could be conducted over email, or using an online survey or assessment tool.

Lesson 2: Applying Typography in CSS

• Estimated time required: 60 - 90 minutes
• Link to student Lesson 2 page

Tips for Delivering This Lesson

• In this lesson, students consult several resources in search of fonts they like, then they add a pair of font-family properties to their external CSS file (one for their body and one for headings). The most important takeaway from this lesson is that they understand how the CSS font-family property works (browsers step sequentially through the list of fonts until they find one that's installed on the user's computer).

Example Output

When this lesson is complete, students will have applied typography-related styles to their site by changing the external CSS file. These changes should be visible on any web page within their site, including index.html.