Topic outline

  • Web Design

    Web Design Q1

    This course is designed to progress students' skills into the realm of Web design. Students will move from being simply web page creators to web site designers. We will dive into topics such as art theory, design principles, information architecture, usability, accessibility, and user interactivity. This course takes up where Web Essentials left off, pushing students who have a basic understanding of XHTML and CSS into advanced levels. This class will demonstrate to students what the Web design industry is like and if this field might be a good fit for them.


    Creative Commons License
    Web Design course materials created by the Open High School of Utah are licensed under a Creative Commons Attribution 3.0 Unported License. This course contains open educational resources produced by other organizations which may use a different open license. Please confirm the license status of these third-party resources before reusing them. See OpenCourseWare for additional information about licensing. 

    • Web Design Q1 Moodle Course Backup File

  • Topic 1

    • Course Resources

    • RESOURCES Page

    • Introduction

    • STANDARDS Page
    • RESOURCES Page
    • INTRODUCTION to Week 1 Page
    • STUDY GUIDE to All Weeks URL

    • Chapter 1.1 Syllabus

    • READ: Syllabus URL

    • Chapter 1.2 Intro to Web Design

    • READ: Introduction to Web Design Book
    • READ: Graphic vs. Visual Design Book

    • Chapter 1.3 Web Content Management (WCM)

    • READ: Web Content Management (WCM) Book

  • Topic 2

    •  

      Introduction

    • RESOURCES Page
    • INTRODUCTION to Week 2 Page

    • Chapter 2.1 Blogs

    • READ: Blogs Book

    • Chapter 2.2 The Internet

    • RESOURCES Page
    • READ: The Internet Book
    • READ/STUDY: Internet Terms Page

    • QUIZ: Chapter 1 and 2

  • Topic 3

  • Topic 4

    • Introduction

    • STANDARDS Page
    • RESOURCES Page
    • INTRODUCTION to Week 4 Page

    • Blog Entry

    • Chapter 4.1 Vector Editing Softare

    • READ: Vector Graphics Editor Page
    • READ/WATCH: What a Vector Program is Capable of Book

    • Chapter 4.2 Inkscape Basics

    • WATCH: Inkscape Bootcamp Part 1 Page
    • WATCH: Saving in Inkscape Page
    • WATCH: Inkscape Bootcamp Part 2 Page
    • WATCH: Inkscape Bootcamp Part 3 Page

    • Chapter 4.3 Slicing Images

    • READ: Slicing Images for the Web Book

    • QUIZ: Chapter 3 and 4

    • READ: Chapter 3 and 4 Study Guide URL

  • Topic 5

    • Introduction

    • STANDARDS Page
    • RESOURCES Page
    • RESOURCES Color Page
    • RESOURCES (TYPOGRAPHY) Page
    • INTRODUCTION to Week 5 Page

    • Chapter 5.1 Color

    • READ: Color Book
    • READ: Selecting a Color Palette Page
    • READ: The Art in Color Coordination Page
    • READ: Color Phsychology Book

    • Chapter 5.2 Typography

    • READ: Typography in Web Design Page
    • READ: Typography Book

    • Chapter 5.3 Sliced Images + (X)HTML

    • READ: Absolute and Relative Positioning Page
    • WATCH: Sliced Images + (X)HTML Page

  • Topic 6

    • Introduction

    • RESOURCES Page
    • STANDARDS Page

    • Chapter 6.1 Elements and Principles in Web Design

    • WATCH: Elements in Web Design Page
    • WATCH: Principles in Web Design Page

    • Chapter 6.2 Finding and Using Images

    • READ: Searching For Images Online Book
    • READ: Image Optimization Page

    • Chapter 6.3 Effective Communication

    • WATCH: Principles of Effective Communication Page
    • WATCH: Giving and Receiving Good Feedback Page

    • QUIZ: Chapter 5 and 6

  • Topic 7

    • Introduction

    • STANDARDS Page

    • Chapter 7.1 XHTML Review

    • READ: What is XHTML? Page
    • READ: Case Study Your Mom's Cards Page
    • READ: XHTML Basics H1, H2, H3, BR, P Page
    • READ: Requirements for Well-formedness Page
    • READ: XHTML Basics ADDRESS, Q, BLOCKQUOTE Page
    • READ: XHTML Basics UL, OL, LI Page
    • READ: XHTML Basics Comments and Character Entities Page
    • READ: Validating Your XHTML Page

    • Chapter 7.2 XHTML + CSS Review

    • READ: XHTML and CLASS Attributes Page
    • READ: What is CSS? Page
    • READ: Using CSS Selectors Page
    • READ: CSS Declarations Page
    • READ: Preparing for Style Page

    • Chapter 7.3 CSS for Basic Layouts Review

    • READ: Further Structuring with XHTML: DIV Page
    • READ: Block-Level Element and the Box Model Object Page
    • READ: Grouping Elements in a Selector Page
    • READ: Positioning Elements with CSS's Float Page
    • READ: 2-Column Layouts with Float Page
    • READ: Styling Navigation Lists Page
    • READ: Getting Creative Page

    • Chapter 7.4 Using Hyperlinks and External CSS Review

    • READ: Referencing and Linking to Files Page
    • READ: Naming Files and Organizing Folders Page
    • READ: Absolute vs. Relative Paths Page
    • READ: Hyperlinking Page
    • READ: Referencing an External CSS Page

    • Chapter 7.5 Images for Galleries and Backgrounds Review

    • READ: Introduction to Images Page
    • READ: Including Images Page
    • READ: Images as Backgrounds with CSS Page
    • READ: Image File Types for the Web Page

    • Chapter 7.6 Publishing to a Web Server with FTP

    • READ: Preparing to Publish Your Website Page
    • READ: FTP Overview Page

  • Topic 8

    • Introduction

    • STANDARDS Page
    • RESOURCES Page
    • INTRODUCTION to Week 8 Page

    • Blog Entry

    • Chapter 8.1 Banners

    • READ: Banner Colors Book
    • READ: Tips to Avoid Poor Color Choices for Websites Page
    • READ: Creating a Banner Using an Image as a Base for Color Palette Book

    • QUIZ: Chapter 7 and 8

    • READ: Chapter 7 and 8 Study Guide URL

  • Topic 9

    • Introduction

    • INTRODUCTION to Week 9 Page

    • Review

    • READ: Final Exam Study Guide URL

    • Final Exam