ICT Essentials Suite

Web Design Essentials
- Media Technology Domain -

ICT Web Design Essentilas

The ICT Web Design Essentials course focuses on fundamentals of designing websites. Students will learn to identify elements of a webpage, and will evaluate the aesthetics and functionality of websites. They will learn the steps in the web design process, such as determining website purpose, goals, and target audience, and planning the site content, structure and navigation. They will also explore web authoring tools. They will be introduced to the technical aspects of the Internet and the World Wide Web. Students will build a website using a GUI web editor, and they will create webpages that include audio, video, and animation. Finally, students will prepare their websites for publishing. They will learn about web hosting services, domain names, uploading files, implementation issues (bandwidth, compression, streaming) and collaboration tools (wikis, blogs).

After completing the ICT Web Design Essentials course, students will be able to:

  • Demonstrate understanding of webpage design principles, including domains, webpage components, aesthetic design, color use, functional design, usability and accessibility, and multimedia and interactivity.
  • Plan the design and development of an effective website, including website planning process, site navigation, HTML text and graphical editors, online and offline site builders, content management systems, and webpage templates.
  • Create webpages using basic HTML code and authoring tools, including HTML tags and terminology, HTML page structure elements, hyperlinks and images, Cascading Style Sheets (CSS) technology, animation and video files, and Dynamic HTML (DHTML).
  • Use collaborative web technologies in a web development or research project, including wikis, blogs, social media sites, and collaboration techniques.
  • Prepare webpages for publication (including webpage content review, copyright restrictions, metadata, webpage testing, HTML code validation), and publish a website to the Internet using appropriate tools (including network issues, site publishing with File Transfer Protocol [FTP], Web site security methods).

Course Table of Contents

Lesson 1: Principles of Web Design

BELL RINGERS

  • Website Categories and Domains
  • Aesthetic Web Design
  • Layout
  • Color
  • Graphics
  • Fonts and Typography
  • Functional and Usable Design
  • Human-Computer Interaction
  • Writing Web Content
  • Browser Compatibility
  • Accessibility
  • Multimedia and Interactivity

ACTIVITY:

  • Matching Website Categories and Domains
  • Searching Website Categories and Domains
  • Reviewing Web Design Principles
  • Matching Web Design Principles
  • Evaluating CARP Principles
  • Exploring the Meaning of Color
  • Using a Color Scheme Generator
  • Having Fun with Typography
  • Writing Effective Web Content
  • Evaluating Web Site Accessibility
  • Evaluating Web Site Usability
  • Evaluating Best Practices
  • Analyzing Multimedia and Interactivity
  • Lesson 1 QUIZ

Lesson 2: Planning a Website

BELL RINGERS

  • Website Planning Steps:
    • Step 1: Assessing Needs
    • Step 2: Determining Content Structure
    • Step 3: Determining Site Structure
    • Step 4: Determining the Navigation Structure
    • Step 5: Creating a Wireframe
    • Step 6: Selecting the Appropriate Tools
  • 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)

ACTIVITY:

  • Determining Website Purpose and Goals
  • Determining Target Audience
  • Creating a Mind Map
  • Describing Navigation Structures
  • Evaluating Web Tools
  • Reviewing Steps for Web Design Planning
  • Searching for Web Terms
  • Putting It All Together to Plan a website
  • Lesson 2 QUIZ

CASE STUDY:

  • All About Me – Assignment 1

Lesson 3: Creating a Web Site

BELL RINGERS

  • The World Wide Web
  • Introduction to HTML
  • Elements of a Webpage
  • Multimedia and Interactivity
  • List of Basic HTML Tags
  • List of Basic HTML Attributes

ACTIVITY:

  • Put the HTML Code in the Correct Order
  • Writing HTML Code with W3Schools - Part 1
  • Using Thimble to Create a  KEEP CALM Poster
  • Using Codecademy to Learn HTML and CSS
  • Writing HTML Code with W3Schools - Part 2
  • Writing HTML Code with W3Schools - Part 3
  • Using Thimble to Create a Meme
  • Filling in the Missing Code
  • Create a Webpage – Part 1
  • Create a Webpage – Part 2
  • Fill in the Missing Code — Advanced
  • Using Thimble to Create a Movie Poster
  • Creating an Animated Scrolling Text Box
  • Writing the Code Required to Insert a Video into a Webpage
  • Creating a Video Tutorial
  • Creating a 3D Photo Slide Show
  • Lesson 3 QUIZ

CASE STUDY:

  • All About Me - Assignment 2

Lesson 4: Publishing a Website

BELL RINGERS

  • Collaboration
  • Blogs
  • Wikis
  • Preparing to Publish
    • Step 1: Check Your Content
    • Step 2: Verify Copyright
    • Step 3: Test Site Pages
    • Step 4: Validate the Code
    • Step 5: Check for Compatibility
    • Step 6: Conduct a Usability Test
    • Step 7: Check File Names
    • Step 8: Choose a Domain Name
    • Step 9: Choose a Web Hosting Service
    • Step 10: Repeat Step 1 – Check Your Content
  • Uploading Your Website
  • File Transfer Protocol (FTP), FTPS and SFTP
  • Secure Sockets Layer (SSL)
  • Secure Shell (SSH)
  • Encryption
  • Streaming and Bandwidth

ACTIVITY:

  • Reviewing and Posting to a Blog
  • Creating a Blog
  • Comparing Wikis and Blogs
  • Being Legal and Fair
  • Using Meta Tags with W3Schools Try It Now
  • Validating a Website's Code
  • Choosing a Domain Name
  • Encrypting and Decrypting Vocabulary Terms
  • Lesson 4 QUIZ

CASE STUDY

  • All About Me - Assignment 3
Close Window
Previous
Next