1. Introduction to Web Authoring
Ellen Cushman
Introduction to Web Authoring
Class mtg. #11
our syllabus
new class page

2. Web Tech UA: schedule Dates of interest for the UA project:
2/11 - Introduction to assignment #3 & Teams
2/13 - UA Background & Principles
2/18 - Semantic Principles of User Assistance
2/21 - UA Storyboard
2/25 - UA Walkthrough
2/27 - Workshop Dreamweaver: CSS
3/3-3/5 - Spring Break
03/10 –Workshop:Dreamweaver CSS
03/12– Workshop:User Feedback & Revision Plans
03/17 – Final Versions Posted

3. Today’s Agenda | Next Class
Information Design for Storyboarding Task-Oriented Communication
examining tutorials to derive structure
- try out a tutorial
Preparing to design your own tutorial: do the task!
Update your project log!
UA Storyboard
PowerPoint workshop/screen-shots.

4. Tutorials: Semantic Structure
Look at the source code and design of the youTube sample tutorial on the class page.
Describe the “semantic structure” of a tutorial (see Zeldman) based on this example*.
There are some cues on the “structure” slides ahead…remember those?
*Bonus: express the structure using actual references to html elements and file structures

5. Why Semantic Structure?
Let’s review: Why semantic structure? How does this relate to file management & site architecture?

6. What’s In a UA tutorial? “Chunks”
title <h1>
local navigation (within the tutorial itself) <ul></ul>
global navigation (from tutorial to other tutorials) <ul></ul>
authors
table of contents
What URL does this page have? What file structure does this indicate to you on the writer’s afs space?

7. What’s In a UA tutorial? “Chunks,”cont.’
overview
summary (what you will learn)
pre-requisites (what you need to do the tutorial)
rationale (why what the tutorial teaches is useful)

8. What’s In a UA tutorial? “Chunks,”cont.’
task task title task description step image, process <img> image, outcome <img> example (e.g. code snippets) description of task outcome (a.k.a. “success condition” and/or “failure condition”) error recovery

9. What’s In a UA tutorial? “Chunks,”cont.’
finished product (description? Image?)
Big so what?!! What outcome might the user expect?

10. Storyboarding: Preparing for Next Time
Do the task you are trying to teach
For each step, draw the “scene”…for most of the tutorials, this will be what’s on the desktop of the user’s computer
…or…take a screenshot!
We’ll make storyboards of your task using screenshots & powerpoint.