Web Design Foundations Course Home

Welcome to the Web Design Foundations Course!

image of bill and mark

Bill Cullifer, Executive Director and Professor Mark DuBois, Director of Education

On behalf of the membership supported WebProfessionals.org and the SchoolofWeb.org we would like to welcome you to the Web Design Foundations Course. We hope you’ll have a wonderful experience studying with us.

To enhance your experience this course will include

* books (hard copy pdf’s and ebooks)
* general course and module advice sessions
* readings and tutorials including videos and blog post
* assignments
* test your thinking questions
* interaction with instructors
* an opportunity to post questions in the forum

If you need technical assistance for any reason, you may submit an online request via our contact us page or by contacting us by telephone at 916 989-2933.

Here is your first assignment:

* Review and listen to the Evolution of the Web

* Download Getting Stared with HTML and CSS book provided at the bottom of the “Getting Started with HTML” post

* Subscribe to the WebProfessionals.org blog and newsfeed

* Review Table of Contents and Introduction and let’s get started!

* Report back and what you’ve learned in week one.

Once you’ve completed your first assignment, please contact me at bill@webprofessionals.org and let me know how you’re doing ok?

That’s it for now. I look forward to following your progress.


bill cullifger head shot image
Bill Cullifer, Founder and Executive Director

Syllabus and Recommended Course Schedule
Please note: Since this course is designed to be self directed you can go at your own pace. Meaning that the following week schedule is designed for the average working professional or 3-9 hours per week. Students that plan on studying more full time can accelerate the schedule.

History and Evolution of the Web – Week One
Evolution of the Web of Web Design
Download the HTML and CSS Head First book
– Review table of contents and introduction HTML and CSS Head First book
– Report back to instructor what you’ve learned

History of the Internet – Week Two

Overview of the Internet
How does the Internet work?
– Review three (3) “Trends in the Web Profession for 2014” podcast series on the WebProfessionals.org Blog
– Read and complete Chapter One of HTML and CSS Head First book
– Report back to instructor what you’ve learned

Web Standards – Week Three
Introduction to the world of web standards
Why Web standards An Open Letter
– Read and complete Chapter Two of HTML and CSS Head First book
– Report back to instructor what you’ve learned

Web design concepts – Week Four
Information Architecture – planning out a web site
What does a good web page need?
Color Theory
– Read and complete Chapter Three of HTML and CSS Head First book
– Report back to instructor what you’ve learned

Web design concepts – Week Five and Six
Building up a site wireframe
Color schemes and design mockups
Typography on the Web
– Read and complete Chapter Five and Six of HTML and CSS Head First book
– Report back to instructor what you’ve learned

HTML beginnings – Week Seven and Eight

The basics of HTML
Doctypes and markup styles
The HTMLelement
More about the document
– Read and complete Chapter Seven and Eight of HTML and CSS Head First book
– Report back to instructor what you’ve learned

The HTML body – Week Nine, Ten and Eleven

Marking up textual content in HTML
HTML Lists
Images in HTML
HTML links — let’s build a web!
HTML tables
– Read and complete Nine and Ten of HTML and CSS Head First book
– Report back to instructor what you’ve learned

The HTML body – Week Twelve and Thirteen
HTML forms – the basics
HTML5 form additions
HTML structural elements
Creating multiple pages with navigation menus
Validating your HTML
– Read and complete Chapter Eleven and Twelve of HTML and CSS Head First book
– Report back to instructor what you’ve learned

Accessibility – Week Fourteen
Accessibility basics
– Read and complete Chapter Thirteen and Fourteen of HTML and CSS Head First book
– Report back to instructor what you’ve learned

Accessibility – Week Fifteen
Accessibility Testing

CSS Week Sixteen, Seventeen and Eighteen
– Review “Practical CSS3” Book provided and read Chapter One and Two
Introduction to CSS
Advanced CSS study

CSS Continued Week Nineteen
– Review “Practical CSS3” Book provided and read Chapter Three and Four
Inheritance and cascade
CSS text styling part 1
The CSS layout model – boxes, borders, margins, padding
CSS background images

CSS Continued Week Twenty
– Review “Practical CSS3” Book provided and read Chapter Four and Five
Styling lists and links
– Styling tables– Styling forms
Floats and clearing

CSS Continued Week Twenty One
– Review “Practical CSS3” Book provided and read Chapter Six and Seven
CSS static and relative positioning
CSS absolute and fixed positioning– Debugging CSS
– Report back to instructor what you’ve learned

CSS Continued Week Twenty Two
– Review “Practical CSS3” Book provided and read Chapter Eight and Nine

Javascript Week Twenty Three
* JavaScript core skills – Week Twenty Three and Twenty-Four
* Review JavaScript Quick Start Guide Table of Contents and complete the following assignments
Introduction to JavaScript
A Short History of JavaScript

Javascript Week Twenty Four
* Review JavaScript Chapters One, Two and Three Quick Start Guide and complete the following assignments
Programming – the real basics!
What can you do with JavaScript
Your first look at JavaScript

Javascript Week Twenty Five
* Review JavaScript Quick Start Guide Chapters Four, Five and Six and complete the following assignments
JavaScript best practices
The principles of unobtrusive JavaScript

Javascript Week Twenty Six
* Review JavaScript Quick Start Guide complete Chapters Seven, Eight and Nine and Six the following assignments
JavaScript functions
Objects in JavaScript

Javascript Week Twenty Seven
* Review JavaScript Quick Start Guide complete Chapters Eleven, Twelve, Thirteen and the following assignments- Traversing the DOM
Creating and modifying HTML
Dynamic style – manipulating CSS with JavaScript

Javascript Week Twenty Eight
* Review JavaScript Quick Start Guide complete Chapters Fifteen, Sixteen and the following assignments
Handling events with JavaScript
JavaScript animation
Graceful degradation versus progressive enhancement

SVG – Week Twenty Nine

What is SVG
SVG basics

Mobile Web Development – Week Thirty
– Introduction to the Mobil Web- Introduction to programming
– Introduction to programming techniques used on the web

Web Design Tools Week Thirty One
What is Dreamweaver
Introduction to Dreamweaver
Creating a New Web Page and Adding Meta Information

Introduction to Photoshop Week Thirty Two
What is Photoshop?
Introduction to Photoshop
Introductions to graphics

Photoshop Week Thirty Three
How to Launch the Files and Lessons
What Is Photoshop: Raster vs. Vector
What’s New in Photoshop CS6 (Overview)
The Photoshop Family
Touring the Interface and Managing Document Windows
The Window > Application Frame (Mac Only)
Zooming and Navigating
Advanced Zooming and Navigating
Creating, Opening, Editing, and Saving

Photoshop Week Thirty Four
Photoshop Project explorations
Using Multiple Undos and the History Brush Tool
Redesigned Mini Bridge
Adobe Bridge and Batch Renaming
Removing Unwanted Objects with Content-Aware Fill
Content-Aware Move, Patch, and History Brush Tools
Plug-ins a.k.a. Filters/Up in Smoke
Automatic Color Correction
Flawless Faces: Women
Flawless Faces: Men
Cropping and Straightening an Image
Content-Aware Scaling
Making Selections

Photoshop Week Thirty Five

Customizing Photoshop
Under the Hood: New Auto Recovery, Customizing the Interface, and Hidden Plug-ins (Filters)
Arranging Panels, Switching Screen Modes, and Saving a Custom Workspace
Customizing Keyboard Shortcuts
Customizing Photoshop’s Menus
Optimizing Photoshop’s Performance: GPU, CPU, RAM, VRAM and More
Rulers, Guides, and Grids

Photoshop Week Thirty Six

Image editing Concepts
Resolution, File Size, and Compression
Importing Camera Images
Reviewing and Rating Images
Organizing Your Image Library
Nondestructive Editing
Selections: Rectangular and Elliptical
Selections: The Lasso and Polygonal Lasso Tools
Selections: The Magic Wand Tool
Selections: The Quick Selection Tool and Refine Edge
Using Refine Edge for Image Extraction
Converting to Black-and-White

Photoshop Week Thirty Seven
Layers and Masks
Removing Solid Backgrounds
Overview of Layers
Adding New Layers
Merging Two Images for One Perfect Shot
Layer Masks, the Key to Flawless Retouching
Creating Special Effects with Layer Masks
Correcting Color and Contrast Using a Layer Mask
Using Layer Styles
Changing Colors Using Layers

Photoshop Week Thirty Eight
Photo retouching
Removing Red-Eye
Skin Perfection, Eye Brightening, and Double-Chin Removal
Creating “Hollywood” Skin
Realistic Retouching Using the History Panel
Dodging and Burning to draw Attention
Differences in the Primary Retouching Tools
Repairing Skin to New Layers
Did the Makeup Artist Go Too Far?
Drop 10 Pounds Without Dieting Using the Liquify Tool

Photoshop Week Thirty Nine

Creating Beautiful digital images with adobe Camera Raw
What Is Adobe Camera Raw and What Files Can It Correct?
Reading a Histogram and Using the Info Panel
Reading and Applying Metadata
Creating Metadata Templates
Removing Color Casts and Improving Contrast With ACR
Correcting a Series of Photos and the Image Processor
Cropping in Adobe Camera Raw
Boosting Color With Adobe Camera Raw
Selective Color in Adobe Camera Raw
Painting in Corrections with the Adjustment Brush
Using the Targeted Adjustment Tool

Photoshop Week Forty
Working with Type and Creating Mock-Ups
Typography in Photoshop
The Character Panel
The Paragraph Panel
Creating and Sharing Paragraph Styles
Character Styles
Creating Mobile Buttons
The Coolest Keyboard Shortcuts for Formatting Text
Using Guides and Layer Groups to Perfect the Layout
Advanced Blending Options for Type

Photoshop Week Forty One

3d and Video Editing
Making Text 3d
Creating a 3d Object
Creating a 3D Title Sequence
Video Editing in Photoshop
Adding Video Transitions

Photoshop Week Forty Two
10 Just for Fun
The “Tourist & Car” Remover
Creating Seamless Panoramic Images
“Cropiddy” Crop, Crop, Crop
Cropping to Ratios, Fixed Sizes, and Resolution
Perspective Crop Tool
Adaptive Wide Angle Correction
Blurring for Focus or Optical Illusion
Cool Lighting Effects
Warping Images
Puppet Warp
The Clone Stamp Tool
Merging High Dynamic Range Images
Vanishing Point
Using Blending Modes and Adding a Mask

Photoshop Week Forty Three
11 Outputting Your Images
Building a Web Photo Gallery
Creating a Contact Sheet
Saving Images for the Web
Color Settings
Preparing Press-Quality Images
Printing Images

Photoshop Week Forty Four
12 Artistic Expression and Special Effects
Turn Your Photo Into a Work of Art with Oil Paint
Creating Hand-Painted Artwork from a Photo with the Mixer Brush
Using Adobe Camera Raw for Painterly Effects
Creating Abstract Artwork with the Art History Brush
Using Actions for Special Effects
Record Your Hand-Drawn Painting
Create a Cartoon Avatar Using the Filter Gallery
Creating and Applying Patterns

Web Hosting – Forty Five
– How to choose a web host

File Transfer – Week Forty Six

– How to use FTP (File Transfer Protocol) to upload your pages to the server

Multimedia – Week Forty Seven
– Introduction to using multimedia in web pages

E commerce – Week Forty Eight
– An overview of how e-commerce works

Web Project Management – Week Forty Nine
The Project: Introduction
Before You Start
The Client
The Proposal: The Development Process
Estimating: Time and Resources
The Budget: Estimating by Hours
The Budget: Estimating by Task
Creative Brief:Defining Scope
Competitive Analysis: Informal Research
Forms & Worksheets: Blank Forms to Use\
Full Details

Leave a Reply