Building Your Story World with HTML – Assignment

Objective: To introduce learners to the basics of HTML and provide them with the tools to create a simple web page that showcases a character and story they’ve developed.

Materials Needed

• Computers with internet access and a text editor
• Basic stationery (paper, pencils, scissors, and glue)
• Printed cheat sheets of common HTML tags
• Access to basic HTML and CSS tutorials

Pre-Assignment Tasks

• Character Creation: Learners create a character and write a brief backstory.
• Story Writing: Learners write a short story involving their characters.
• Introduction to HTML: Provide learners with resources to familiarize themselves with HTML basics.

Assignment Structure

Part 1: Introduction to HTML

Start with a presentation on HTML basics, covering tags, elements, attributes, and the structure of an HTML document. Discuss how web pages can tell stories online.

Part 2: Crafting the HTML Structure

Learners create a paper model of an HTML page, then replicate this model in a text editor, creating the skeleton of their HTML story page.

Part 3: Bringing Characters and Stories into HTML

Learners will insert their character descriptions and stories into the body of their HTML document, using tags like <h1>, <p>, and <img>.

Part 4: Presentation and Review

Each learner presents their web page, explaining their character and story, and receives feedback from peers.

Resources for Further Learning

• Codecademy’s HTML & CSS Course
• Khan Academy’s Intro to HTML/CSS: Making webpages
• w3schools
• codepen.io/pen/

Evaluation Criteria

• Creativity in presenting the character and story
• Correct use of HTML tags and structure
• Basic styling with CSS to enhance the visual appeal
• Participation in activities and discussions