Projects
Explainer website
This project is scaffolded, teaching foundational concepts by progressively building a
short one-page website explaining any topic, fiction or nonfiction: basic car maintenance,
rides at Disney Land, game consoles, an alien invasion, anything. For content, you can use
Wikipedia content, Google searches, or other credible resources. Please source your
content that is not yours and provide links at the bottom of the page. Small weekly tasks
on this project will demonstrate the application of techniques discussed in the weekly
modules.
Read project details
→
Recipe website
Using HTML and CSS skills introduced so far in this class, you will create a one-page
responsive website for a recipe. You can use a family recipe, an historical recipe, a
recipe you find on the web (that you credit), or one you make up. You are welcome to use
AI tools for content, but the coding should be your own hand-written HTML and CSS. Apply
visual hierarchy in your CSS design so that color, typography, layout best expresses your
content. The focus of this project is effective visual design and hierarchy and responsive
design.
Mock business website
Build a responsive website for a fictional business. Your site should have a designed
navigation bar and includes exactly 3 pages: a homepage/landing page, an about page, and a
services page. You may use one of the business profile templates I provided or make up
your own. If you opt to make up your own, you must develop a logo and color palette that
is approved by me. You can use AI tools for content or make it up on your
own. It can be inspired by a real business, but should be adjusted to be fictionalized.
The business can be anything of your choice: a dog grooming company, a tech start up, a
local restaurant, anything. It should use both text and image to promote the business to
its target audience. Apply visual hierarchy in your CSS design so that color,
typography, layout best expresses your content.
Multimodal narrative website
In a team, build a responsive website for a work of integrated writing and
media. The narrative can be a story, a digital essay, a biography, but must be
storytelling focused.
Your site should have a designed navigation bar with at least two pages: the
main page and an about page with information about you the author. You may break up your
narrative into multiple pages with links in the nav bar if you wish. For example, if your
topic is a
band or musician, you might want to break up the article into pages of different periods
or albums.
Along with the text, you should illustrate your page with images and/or other media, like
audio, video, or gif animations. Apply visual hierarchy in your CSS design so that color,
typography, layout best expresses your content.
