Lesson 1: Quality Websites

Overview

Every website has a purpose, a reason someone created it and others use it. In this lesson, students will identify the purpose of a website and the key features of a website that can help it achieve its purpose. Students will break up into pairs to analyze a set of websites with a common purpose. Students will decide if the websites achieve their intended purpose and give reasons for why. Using the reasons why, the class will have come up with a list of features that influence if a website meets its purpose.

Purpose

Unit 2 is all about the World Wide Web. Chapter 1 focuses on creating websites. In order to create quality websites students need to understand what a website is and what makes it good. By focusing on the purpose of a website students see that websites are only useful if they meet their intended purpose. In order to be good creators of web content students must begin to think about how to create websites that achieve their purpose. The creation of a class list of ideas helps to start students thinking before they begin to create in the next lessons.

Agenda

Warm Up (15 minutes)

Activity (35 minutes)

Wrap Up (10 minutes)

Assessment

Extension Activities

Objectives

Students will be able to:

  • Identify the purpose of a website and explain how well it is meeting that purpose
  • Identify high quality features of websites and use them to give feedback on a website

Preparation

Links

For the Teacher

For the Students

Vocabulary

  • Website - A location connected to the Internet that maintains one or more pages on the World Wide Web.

Support

Report a Bug

Teaching Guide

Warm Up (15 minutes)

Journal and Discuss: Last Website Visited

Set Up: Have students take out their journal. In their journal have students answer the following prompt.

Prompt: What was the last website you visited? Why did you go to that website?

Discussion Goal

The goal of having this discussion is to pull out that websites share information and that people go to websites for a particular purpose. You only stay on that website if it fulfills your needs.

Discuss: Have students share out the last website they visited. Make sure students share why they went to that website and what information were they looking for. In addition you can ask students if they got the information or if they website did not provide what they wanted.

Activity (35 minutes)

Rating Websites

Create a Feature List

Goal: The class works together to create a list of features that help a website achieve its purpose.

Remarks

Now that you have looked a collection of websites that all have a similar purpose. We are going to try to make a more general list of what features contribute to a website meeting its purpose.

Prompt: On your worksheets under the section called "List of Common Features" identify common features of the websites that you ranked as achieving their purpose (good) and common features of websites that you rated as not achieving their purpose (bad).

Teaching Tip

If possible it would be good to bind the Web Development Practices - Project Guide into a booklet or hole punch it so students can keep it in a binder. They will need it through out the whole unit.

Distribute: Web Development Practices - Project Guide

Remarks

You will each be using this packet as a tool to review and improve the websites you create. You will add to it throughout the unit as you learn new ways to make good websites. Today we will be starting to create a class list of some of the things we thought were common to websites that achieved their purpose.

Discussion Goal

Things to keep in mind during this discussion:

  • The ultimate goal here is to identify specifically which features can make a website better for the user.
  • Try to re-frame bad things into positive actions
  • Much of web design is rooted in personal preference.
  • Central to evaluating a website is the degree to which it aligns with its purpose.

If students are reluctant to discuss features ask them about the following features:

Discuss: Once students have completed lists bring them together to share out those ideas as a class.

Display: As students share out features record and displays a class list. Students should be keeping a copy of the list in their copy of Web Development Practices - Project Guide. You may want to model the chart on the board similar to the one students are filling in.

Wrap Up (10 minutes)

Website Feedback

Remarks

We spent much of class today critiquing websites. That is an important part of analyzing a website. In order to turn that critique into something actionable we need to turn it into feedback. Feedback is an important part of creating any product as it allows the creator to reflect on their work, define changes they want to make and prepare for future improvements. Creators need good, actionable, and thoughtful feedback in order for them to make improvements. You are going to pick one website and give feedback to the creator of that website using the I like, I wish, What If model which they could use to improve their website.

Set Up: Students will still need their Rating the Quality of Websites - Activity Guide.

Transition: Have students pick one of the websites they looked at earlier in class and open it up on their computer.

Teaching Tip

If your students are not comfortable with the I like, I wish, What if model you may want to pick one website to give feedback on as a class before having students work on their own.

Prompt: In the "Website Feedback" section of your worksheet give feedback to the creator of the website which would help them improve their website. Use the Quality Website Features List we developed as a class as a guide.

Discuss: If there is time you can have students share some of the suggestions they gave for different websites.

Collect: If you want, you can collect the Activity Guides as “exit slips” at the end of the period.

Assessment

Collect completed Activity Guides as a formative assessment if desired. Students answers to the wrap up question will help to capture what students understand from the lesson.

Extension Activities

  • Have student use the class feature list to analyze their favorite sites for their overall level of functionality. Students cite specific examples of how and where content and style influence the functionality of their favorite website. Have students to record their work in their journals.

  • Have students read Top Ten Rules of Web Design - Website and Principles of Effective Web Design - Website. Add new features they may not have considered before to their feature list.

View on Code Studio

The Internet - Web Development: Lesson 1 - Quality Websites

Background

Every website has a purpose, a reason someone created it and others use it. In this lesson, students will identify the purpose of a website and the key features of a website that can help it achieve its purpose. Students will break up into pairs to analyze a set of websites with a common purpose. Students will decide if the websites achieve their intended purpose and give reasons for why. Using the reasons why, the class will have come up with a list of features that influence if a website meets its purpose.

Vocabulary

  • Website - A location connected to the Internet that maintains one or more pages on the World Wide Web.

Resources

View on Code Studio

Rating the Quality of Websites

Goal: Students identify features that they believe make some websites better than others.

Say:

 We just shared the last websites we visited. More importantly you shared why you went to those websites. All websites are created to serve a certain purpose. Some of the websites you go to meet your needs better than others. When websites don't meet your needs it may be because they were designed for a different purpose or maybe they don't do a good job of achieving their intended purpose. You are going look at a set of websites to see how well they meet their intended purpose. All of the websites you will be looking at were designed for the same purpose, to share information about a restaurant.

Setting: Think about this, you and your family are trying to decide what place to get dinner from. You are looking at restaurants online to help you make your decision. For each website, you will think about how well it helps with your decision of what place to get dinner from. Before we look at the websites, let's think about what kind of information we will be looking for.

Prompt: When you are trying to decide where to get dinner, what kind of information are you looking for?

Discuss: Have students share out the types of information they might look for when trying to make this decision.

Group: Put students in pairs.

Distribute: Give one copy of Rating the Quality of Websites - Activity Guide to each student.

Transition: Have students go to the "Rating Websites" level on Code Studio to begin looking at the websites. Links to all of the websites can be found in Code Studio. Using the worksheet as a guide, students will:

  • Open each website one at a time.
  • Decide with your partner if and how well the website achieves its purpose.
  • Identify at least three features of the website that support your rating, and record those features.
  • Repeat until you have gone through all the websites.

If students do not agree with their partner that is okay but they should discuss the differences in opinion.

This activity is NOT about students giving "accurate ratings".  Rather, it is about having students identify reasons for their ratings in order to identify qualities of website's that meet their purpose. In addition personal preference plays a role in everyone's ratings.

Circulate: As students are working to get a sense of the ratings they are giving in order to pull out key insights from students.

View on Code Studio

Rating Websites

Overview:

You and your family are trying to decide what place to get dinner from. You are looking at restaurants online to help you make your decision. How well do these restaurants help you make this decision?

Directions:

For each of the websites below, you and your partner will together do the following:

  1. Click on the link to the website.
  2. Spend one minute exploring the website with your partner.
  3. Decide together how you would rate the website.
  4. Circle your chosen ratings in the spaces provided
  5. Identify at least 3 features of the website that support your rating, and record those features in the blank space provided.

Websites

  1. Website 1
  2. Website 2
  3. Website 3
  4. Website 4
  5. Website 5

Standards Alignment

View full course alignment