Comm-101 Comm-101 Essentials of Digital Media

Modern Web Foundations

A step-by-step introduction to visual design, HTML, and CSS. Work through each activity in order.

Phase 1 — Design Fundamentals

1
Lecture

Typography Fundamentals

An introduction to type: how fonts, size, weight, and spacing shape visual communication.
2
Interactive Tool

Typography Playground

Experiment with typefaces, size, weight, leading, and tracking in a live preview.
3
Interactive Tool

Color Design Playground

Explore color palettes, contrast, and mood using a live color editor.
4
Design Challenge

Client Design Challenge

Apply typography and color to real client briefs. Complete 3 or more to unlock your PDF.

Phase 2 — Reading HTML & CSS

5
Introduction

Meet the Rockets Website

Explore the Rockets site that you'll be learning from — built entirely in HTML and CSS.
6
Challenge 1

Reading HTML

Learn the basic HTML skeleton, tags, visible content, links, and attributes.
7
Challenge 2

Reading CSS

Learn selectors, properties, values, classes, IDs, and how CSS connects to HTML.
8
Challenge 3

Modern Web Concepts

Learn headers, nav, hero sections, cards, semantic structure, and responsive design.

Phase 3 — At-Home Lab

9
Lab Assignment

Rockets Website Lab

Edit the Rockets HTML and CSS files yourself, then upload your finished pages to a server.