Lesson 10: Websites for Expression

Overview

Question of the Day: How can we use websites to express ourselves?

In this lesson students investigate ways to use websites as a means of personal expression and develop a list of topics and interests that they would want to include on a personal website. Students begin by brainstorming different ways that people express and share their interests and ideas. Students then look at a few exemplar websites to identify ways they express ideas. Finally, students brainstorm and share a list of topics and interests they might want to include on a personal website; they will reference this list as they progress through the unit.

Purpose

This lesson emphasizes that web development, and by extension computer science, is an avenue for self expression. The warm up situates web development as another means of self-expression alongside visual art, dance, music, fashion, social media, and many other ways students are likely already expressing themselves. Seeing student exemplars helps scope students' expectations for their own pages. The activity situates web development within the Problem Solving Process framework, and brainstorming content for their website provides students an opportunity to define the ways that they would like to express themselves through their pages.

Assessment Opportunities

  1. Identify websites as a form of personal expression

    In the activity guide and discussion, check that students have clearly explained the purpose of their own web pages and why that purpose is personally relevant to them.

Agenda

Lesson Modifications

Warm Up (5 mins)

Activity (20 mins)

Wrap Up (5 mins)

View on Code Studio

Objectives

Students will be able to:

  • Identify websites as a form of personal expression.

Preparation

  • Prepare journals or optionally print copies of the activity guide

Links

Heads Up! Please make a copy of any documents you plan to share with students.

For the Teachers

For the Students

Support

Report a Bug

Teaching Guide

Lesson Modifications

Attention, teachers! If you are teaching virtually or in a socially-distanced classroom, please see these modifications for Unit 2.

Warm Up (5 mins)

Express Yourself

Prompt: What are the ways that you or your friends express yourselves? Think about different ways of communicating, activities, or spaces that you consider a form of self-expression.

Discussion Goal

Goal: This warm-up should generate a list of ways students express their ideas. If they need help getting started, offer them a couple of examples from the list below. The goal of this warm-up is to frame web development as another form of self-expression.

Discuss: Students should brainstorm ideas independently, then share with a neighbor, and finally share with the whole class.

Remarks

We share our thoughts, feelings, and ideas in many different ways. Some people might express their thoughts online, others might do so through the way they dress, by making a song, or by drawing a picture. Self-expression is an important part of our lives, and as we're going to see, making websites is another way we can express our ideas, interests, and feelings.

Question of the Day: How can we use websites to express ourselves?

Activity (20 mins)

Problem-Solving Process Review

Review: Review the problem-solving process framework: Define, Prepare, Try, Reflect

Remarks

Although we don't usually think about self-expression as a "problem" that we need to solve, we can use the problem-solving process to help us express ourselves with our web pages. Today, we are going to "Define" the problem that our web pages will solve.

Teaching Tip

Use Journals: The activity for today's lesson can easily be completed in student journals. Project or otherwise share the prompts and let students complete their work in their journals.

Personal Website Planning Guide

Distribute: Have students open a journal or optionally distribute copies of the activity guide.

Brainstorm Content: Read through this section of the activity guide. Then give students several minutes to silently brainstorm content they might want to include on a personal website.

Share: Have students share their content ideas with a neighbor.

Remarks

When sharing ideas with other people it’s important to consider not just what you want to say, but how you want to say it. You just created a list of ideas you might want to share on your personal websites. Let's go look at some personal websites other students have made and think about the content they're sharing as well as how they are presenting that message.

View Personal Web Pages: Send students to Code.org and have them look through the exemplar web pages in pairs. They can use these web pages as inspiration for their own personal web pages. You may want to review the purposes of the various websites and why they are personally significant to their creators.

Assessment Opportunity

Students should identify their websites as an opportunity to express themselves and their own goals. Check that each student has an explanation of why their site is personally significant.

Web Page Purpose: Give students some time to think about what purposes their own web pages will serve. Try to steer the conversation away from the exact content of the site, which they will have time to plan in a later lesson.

Share: Give students a chance to share their website purposes with a neighbor.

Wrap Up (5 mins)

Assessment Opportunity

As students share different aspects of the websites, make sure that the discussion highlights the creative aspects of making websites, and that websites can be a form of personal expression unique to each individual.

Journal 3-2-1

Question of the Day: How can we use websites to express ourselves?

Prompt: Now that you've had a chance to share your website ideas, write down...

  • 3 reasons your site will be special to you
  • 2 reasons your neighbor's site will be special to them
  • 1 thing you'd still like to learn how to do in HTML or CSS

Remarks

In the next few lessons, we'll be working to bring many of your ideas to reality. Some of the content you want to share might change as we go through the unit, but this goal of using websites for self-expression will be there throughout.

Collect: If students did not put their web page ideas in a journal, collect them. They will explicitly be referenced again when they begin their project.

  • Lesson Overview
  • 1
  • (click tabs to see student view)
View on Code Studio

Teaching Tip

Student Instructions

  • Sample Personal Websites
  • 2
  • (click tabs to see student view)
View on Code Studio

Student Instructions

Personal Website Exemplars

Click the websites below to check out personal websites other students have made.

Examples

The Cutest Dog
Dog Sample Page
My Trip
Trip Sample Page
Musical Instruments
Instrument Sample Page
Recycling Club
Recycling Sample Page
Haikus
Haiku Sample Page

Standards Alignment

View full course alignment

CSTA K-12 Computer Science Standards (2017)

AP - Algorithms & Programming
  • 2-AP-13 - Decompose problems and subproblems into parts to facilitate the design, implementation, and review of programs.
IC - Impacts of Computing
  • 1B-IC-18 - Discuss computing technologies that have changed the world and express how those technologies influence, and are influenced by, cultural practices.