Section 2.7

Learning Goals

1. Students create a classic Google website, select a theme, design the basic site layout, and add sub pages.

2. Students create a basic web page, and add basic content (text, images).

3. Students change the basic layout of their web page.

4. Students collaborate on their web site, edit shared pages, and invite others to view it.

5. Students work as a web-development team, each performing a specific role.

Objectives and General Description

In this section students learn the basic elements of creating a classic Google website. The goal of this section is to familiarize students with the basic workings of Google websites, including creation of a website, enabling students to collaborate on the same website, add new pages, add basic content, and format the layout of the website and each page. The teacher will provide instruction to students as needed on basic google site creation. Students are expected to have only the most basic elements of the website completed at this point. The teacher should expect at the end of this section that pages will be sparsely populated, layouts might be vastly different or all exactly the same, and elements will be missing or incomplete.

We provide a set of instructional sheets to get students comfortable with creating and formatting their own basic pages. Make sure to use New Sites, not Classic Sites.

Activities

Activity 2.7.1 (Budget 20 minutes)

Students create a new google site and invite team members.

1. Using the Instructional Sheet - Create New Website, the Server Administrator from each team will sign into their google account and create an appropriately named Google site. The team will need to agree on a site name. The students will also need to create a unique URL. The teacher should define a naming convention that creates a unique URL for each team, without being traceable to the school or students -- something like MonkeyHippoP3T7 (for period 3, team 7).

1b. This step is optional, but recommended. Following the instructions in 1 for creating a new website, have each student create their own personal website. This website can be anything the student wants it to be (that is classroom appropriate). They can use this site to experiment with different designs and layouts in activity 2.8.2, without messing up the team website. Students that finish any part of Unit 2 early can always go back to working on their personal web page. The teacher may want students to make this a "job application" or "portfolio" website, where the student builds it with the intent of showing it to prospective employers.

2. Using the Instructional Sheet - Adding Teammates, the Server Administrator sets the site permission to invite only, invites all other team members and the teacher, and provides them with edit or ownership rights for the site.

3. The teacher validates that students used New Sites for the team website, and that site permissions are appropriately set for each site. If students created individual websites, the teacher will need to make sure permissions for individual websites are set appropriately as well and that students are using New Sites.

4. The teacher discusses the role and importance of the Server Administrator and how the assignment of rights allows the administrator to control who can access and change website content, and who can allow other people to do the same.

Activity 2.7.2 (Budget 90 minutes)

Students select theme and layout of basic site.

1. Layout designers lead the team in an investigation of the available themes, colors and image choices. The layout designers first will determine the main theme and color, and then select background features to be used for the entire website. Instructional Sheet - Main Design Layout Part 1. If 1b. was done, teachers should encourage students to create design sub-groups within their teams, who can play independently on their own sites, and offer alternative designs.

2. Students create three basic pages as a team - About, Problem and Sub-problem, using Instructional Sheet - Adding Basic Pages. This is necessary for the Navigation Bar to appear. Students will learn about the Hamburger button, and experiment with horizontal and side navigation bars.

3. Students should decide on a final theme, logo, and color choices from among the alternatives or as a combination of features. The layout designer should feel empowered to make the final design decisions (they can be changed later if needed).

5. The Quality Assurance team member(s) should submit a screen shot of the Home page to the teacher, showing that the website has these basic components:

• • Home page, About page, Problem page

  • Navigation bar (either Horizontal or Side)

  • Title with logo

  • Background image

6. The teacher discusses the roles and importance of the Layout Designer and the Quality Assurance team.

Activity 2.7.3 (Budget 45 minutes)

Students add new web pages and copy content from their slides.

1. In section 2.7.3 each student was assigned web pages to create. Referring back to the Instructional Sheet - Adding Basic Pages, each student should create those pages they are responsible for, and organize their pages appropriately in the Pages tab.

3. After adding a page students should use Instructional Sheet - Adding Basic Content to transfer the content of their slides to their pages. Students should copy and paste the titles and text from their slides into the individual web pages that best correspond to their slides. Teachers encourage students to play with different layout options and images on their individual pages. If 1b. was done, teachers should encourage students to create design sub-groups within their teams, who can play independently on their own sites, and offer alternative designs.

3. The project manager should ensure that all slide content is converted to a website, so that information is not lost. A Project Manager Checklist needs to be filled out, initialed, and submitted by the Project Manager.

4. Quality assurance ensures that each webpage is up to standards and should sign off on each page. A Quality Assurance Checklist needs to be filled out, initialed, and submitted by the QA team.

5. The teacher discusses the role and importance of the Project Manager.

Resources

• 2.7.1 Instructional Sheet - Create New Website (Student Resource)

• 2.7.1 Instructional Sheet - Adding Teammates (Student Resource)

• 2.7.2 Instructional Sheet - Main Design Layout Part 1 (Student Resource)

• 2.7.2 Instructional Sheet - Adding a New Page (Student Resource)

• 2.7.3 Instructional Sheet - Adding Basic Content (Student Resource)

• 2.7.3 Project Manager Checklist (Student Worksheet)

• 2.7.3 Quality Assurance Checklist (Student Worksheet)