Please enable JavaScript to use CodeHS

  • Beginners

Adventure Story

In this project, students will use HTML and CSS to create a multi-page website that takes the user through an adventure story.

Easy

2 Hours

High School

Middle School

Project Description

Background

In this project, you will create a website that takes the user through a short adventure story. Here’s how your website will work:

  1. Your main page will present the user with a scenario where they have to make a choice.
  2. You will present the user with at least two choices, providing a link for each choice.
  3. The user will click on the link for their choice, and they will be taken to a new page that describes the result of their decision.


Program Requirements

At a minimum, your program must meet the following requirements:

  • Have at least 3 HTML files, one for the main page and one for each decision the user can make.
  • Your main page should link to both of the decision pages. Each decision page should include a link back to the main page to give the user the option to restart.
  • Each page should include the proper HTML skeleton and be structured clearly.
  • Each page should include an image that illustrates the story. You can add the image as a background image or as a stand-alone image on the page.
  • You must use a CSS style sheet that has at least three rules. One of the rules must select by class or id.
  • Have a cohesive storyline that is engaging and fun for the user. Each page should have a minimum of three complete sentences.


Your Task

Before you begin coding, you need to spend some time planning your story – draft your story sequence, two decisions, and the outcome of each decision. Feel free to build out your story to include more than one decision! For example, the outcome of the user’s first choice could result in another decision, which could result in another decision, etc.


Once you have your story drafted, use your HTML and CSS skills to create a website that brings your story to life!

Project Demo

Explore this program before assigning it!

Project Overview

Here is an outline of the project activities: