Web Design Essentials
– Media Technology Domain –
The ICT Web Design Essentials course focuses on fundamentals of designing Web sites. Students will:
- Learn to identify elements of a Web page, and will evaluate the aesthetics and functionality of Web sites
- Learn the steps in the Web design process, such as determining Web site purpose, goals and target audience, and planning the site content, structure and navigation
- Explore Web authoring tools
- Learn the technical aspects of the Internet and the World Wide Web
- Build a Web site using a GUI Web editor
- Create Web pages that include audio, video and animation
- Prepare their Web sites for publishing
- Learn about Web hosting services, domain names, uploading files, implementation issues (bandwidth, compression, streaming) and collaboration tools (wikis, blogs)
Course Table of Contents
Lesson 1: Principles of Web Design
LESSON SECTIONS
- Web Site Categories and Domains
- Aesthetic Web Design
- Functional and Usable Design
- Multimedia and Interactivity
SUGGESTED ACTIVITIES
- Matching Web Site Categories and Domains (Hands-on and Online)
- Searching Web Site Categories and Domains (Hands-on)
- Evaluating CARP Principles (Hands-on)
- Exploring the Meaning of Color (Teacher-Led)
- Using a Color Scheme Generator (Hands-on)
- Having Fun with Typography (Hands-on)
- Writing Effective Web Content (Hands-on)
- Evaluating Web Site Accessibility (Hands-on)
- Evaluating Web Site Usability (Hands-on)
- Analyzing Multimedia and Interactivity (Hands-on)
- Evaluating Best Practices (Hands-on)
LESSON 1 QUIZ
Lesson 2: Planning a Web Site
LESSON SECTIONS
- Web Site Planning Steps
- Using an HTML Text Editor or GUI Web Editor
- Using an Online Site Builder
- Using an Offline Site Builder
- Using a Content Management System (CMS)
SUGGESTED ACTIVITY
- Determining Web Site Purpose and Goals (Hands-on)
- Determining Target Audience (Hands-on)
- Creating a Mind Map (Teacher-Led)
- Describing Navigation Structures (Hands-on)
- Evaluating Web Tools (Hands-on)
- Reviewing Steps for Web Design Planning (Online)
- Searching for Web Terms (Hands-on)
- Putting It All Together to Plan a Web site (Hands-on)
CASE STUDY
- All About Me – Assignment 1
LESSON 2 QUIZ
Lesson 3: Creating a Web Site
LESSON SECTIONS
- The World Wide Web
- Introduction to HTML
- Elements of a Web Page
- Multimedia and Interactivity
- List of Basic HTML Tags
- List of Basic HTML Attributes
SUGGESTED ACTIVITY
- Using Meta Tags with W3Schools Try It Now (Hands-on)
- Putting HTML Code in the Correct Order (Online)
- Writing HTML Code with W3Schools Try It Now – Part 1 (Hands-on)
- Using Thimble to Create a KEEP CALM poster (Hands-on)
- Using Code Academy to Learn HTML and CSS (Hands-on)
- Writing HTML Code with W3Schools Try It Now – Part 2 (Hands-on)
- Writing HTML Code with W3Schools Try It Now – Part 3 (Hands-on)
- Using Thimble to Create a Meme (Hands-on)
- Filling in the Missing Code (Hands-on)
- Creating a Web page – Part 1 (Hands-on)
- Creating a Web page – Part 2 (Hands-on)
- Filling in the Missing Code – Advanced (Hands-on)
- Using Thimble to Create a Movie Poster (Hands-on)
- Creating an Animated Scrolling Text Box (Hands-on)
- Writing the Code Required to Insert a Video in a Web page (Hands-on)
- Creating a Video Tutorial (Hands-on)
- Creating a 3D Photo Slide Show (Hands-on)
CASE STUDY
- All About Me – Assignment 2
LESSON 3 QUIZ
Lesson 4: Publishing a Web Site
LESSON SECTIONS
- Collaboration
- Blogs
- Wikis
- Preparing to Publish
- Uploading Your Web Site
SUGGESTED ACTIVITIES
- Reviewing and Posting to a Blog (Teacher-Led)
- Creating a Blog (Hands-on)
- Comparing Wikis and Blogs (Hands-on)
- Being Legal and Fair (Hands-on)
- Validating a Web Site’s Code (Hands-on)
- Choosing a Domain Name (Hands-on)
- Encrypting and Decrypting Vocabulary Terms (Teacher-Led/Team)
CASE STUDY
- All About Me – Assignment 3