Materials below are selected for a graduate level course, CSE 629: Web-based Website Design. The course is intended for MSEd: Educational Technology students who require a course that gives them experience in developing a professional website or portfolio using web-based tools. A second goal is to offer hands on experience creating accessible content while practicing principles of good usability and user experience (UX). Additionally, this course is meant to help address a sore point for many educators by providing a basic understanding of project management (PM) practices. Thus planning the website (the project), time investment, resources, and how to accessibly and effectively deliver content are key components of this course.

Since different people teach this course, this collection of resources is meant to suggest a set of common resources for faculty to integrate into their courses while allowing them to personalize themes and emphases. Hopefully, faculty will also add materials to this content as well.

Please note: this course reading/assignment plan is an OER and can be remixed fit. All of the items linked, however, are not OERs. Many of the artifacts are videos from YouTube and are copyrighted by the individuals--that is why links are provided. When each resource is listed, the copyright status is provided so that you can make the most accurate determination possible about potential use in/for your classes and students.

Students learn that ordinary citizens, including students like themselves, can make meaningful contributions to science through the concept of "citizen science." First, students learn some examples of ongoing citizen science projects that are common around the world, such as medical research, medication testing and donating idle computer time to perform scientific calculations. Then they explore Zooniverse, an interactive website that shows how research in areas from marine biology to astronomy leverage the power of the Internet to use the assistance of non-scientists to classify large amounts of data that is unclassifiable by machines for various reasons. To conclude, student groups act as engineering teams to brainstorm projects ideas for their own town that could benefit from community help, then design conceptual interactive websites that could organize and support the projects.

This activity helps student design and develop a front-end of a website, from wireframes through HTML/CSS/Javascript. It includes design questions for students, including the invocation of Ben Schneiderman's eight golden rules for interface design.

Note: this activity assumes prior knowledge of web development. Since this activity is designed for an HCI course, with a focus on interface design, students are not expected to create a back-end for it. This activity can obviously be modified for a full-stack experience.

Comments
Although this activity can be used in isolation, it is intended to be part of a series guiding students towards the creation of a front-end of a website. The series (all published as OER) consist of:

a) Needfinding
b) Personas, Scenarios and Storyboards
c) Front-end Website Design and Development
d) Accessibility Evaluation

In this lesson, designed for a heterogeneous group of students that includes English-language learners, students work together to plan a website based on their home knowledge. An introductory lesson outlines the structure and components of simple websites (home page, titles, headings, links). Students take home and complete a bilingual student and family interest survey, then work in groups of four or five to identify common themes among the responses. Each group makes a flow chart to think graphically about the contents of their planned website. Each student keeps a project notebook to record new ideas, summarize group work, and share the project with family members. The teacher can make the planned websites a reality using one of the online website-building platforms in the Resources list.

A checklist used by teachers to assess elementary students as they work on creating a website.

A rubric in student language written for elementary students to self-assess their writing of websites.