Elements of Web Design

Accelerated Technical Training for Web Authors

About this Course
  1. Overview
  2. Courseware
  3. Format
  4. Audience
  5. Prerequisites
  6. Outline
  7. Objectives
  8. Method
  9. Classroom Setup
  10. Site

Overview

 Building a website? Want to make the best use of graphics, color, page layout, image file formats (GIF and JPEG), and navigation aids? Care about the diversity of platforms (monitor resolution and color depth) your audience uses? Want to coax the best possible performance and download speeds out of limited bandwidth? Concerned about satisfying your audience and ensuring repeat visits?

This course is for design-conscious web authors. It teaches techniques for calculating and minimizing download times, choosing optimal file formats, and creating consistent, attractive, and usable web page layouts. Applying these techniques will enable you to build web sites that perform well, are intuitive for your audience and easy to navigate, and that will encourage repeat visits by satisfied viewers.

Courseware

 This is a Web-based class.
The training materials are at http://www.keller.com/lowband.

Format
    • One half-day.
    • Emphasis on practical skills.
    • Hands-on.
    • Instructor-led and classroom-based, with on-screen (web) materials.

Audience

 This course is for web authors who want to build websites that really work. Good page layout and functional site navigation are essential, as are performance and snappy download times for audience satisfaction.

Prerequisites

 Check the boxes for the prerequisites you satisfy.
You have a working knowledge of HTML including tables.
You have used Adobe Photoshop or PaintShop Pro at least a little.
You have ideas about what makes a good web site.
You need to create web pages that include both text and graphics.
You can edit a text file (with notepad, vi, etc.)
If you checked four boxes or more, you're well-equipped to get the most out of this class!

Outline
  1. The Concepts of Simple Text Layout
    • Structural Elements of Design
    • Building Page Layouts Using Tables
    • Building a Resource Folder
    • Logical Division of Text
    • Balance of Stylistic Elements

  2. Navigation
    • Style and placement of navigation aids
    • Site maps

  3. Image Compression
    • GIF Compression -- How It Works, Elements Influencing Compression Size
    • JPEG Compression -- How It Works, Quality Choices: High/Medium/Low
    • Choosing Between Compression Schemes

  4. The 216-Color Browser Palette
    • Defining a Palette
    • 216 Colors vs. 256 Colors
    • Dithering and How It Affects Images
    • Simple Color Conversion -- Using RGB/Index Mode, Using Hex

  5. Tricks and Traps
    • HTML Tags -- Defining Space, Image Size vs. File Size
    • Uses of "dotclear.gif"
    • Useful Websites and Online Resources

Objectives

 You will practice and learn to:
  • Organize your materials
  • Calculate download times
  • Minimize graphics file sizes
  • Structure your information into digestible chunks
  • Choose JPEG or GIF compression
  • Use the common 216-color browser palette
  • Design pages with style, balance, and legibility

Method

 The course is a series of five modules, each consisting of:
  • A set of design principles
  • The skills for applying these principles
  • Hands-on labs to reinforce understanding and skills

Classroom Setup

 Delivery of this course requires a classroom equipped with:
  • an overhead projector
  • a PC or workstation for each student
  • a PC or workstation for the instructor
  • a projector for the instructor's computer screen
  • connection to the internet
  • a local web server (optional)

Site

 The course can be taught in your classroom, anywhere in the world. Travel outside the San Francisco Bay Area requires reimbursement of the instructor's travel expense.

Copyright © 2020

Dan Keller Technical Services
2248 International Blvd., Oakland
California, USA 94606
tel: 415 / 861-4500