Workshop 2: Designing, Building and Skinning with Accessible Progressive Enhancement and the YUI Library - Nate Koechley

This workshop has something for everyone, and by the end you'll have hands-on experience across the design-to-implementation project life cycle.

We'll explore interesting moments in the design of a DHTML application -- as distinct from a static web page -- and look at tools and techniques to discover and communicate specifications and requirements that nowadays include a temporal axis.

We'll learn how to rapidly move from idea and concept to content structure with approachable tableless CSS page-layout techniques that work effortlessly across-browser. We'll explore how to maximize SEO at the template level while preserving device and browser independence.

In the presentation / CSS layer we'll practice skinning existing widgets for unique visual designs without modifying markup. We'll review which CSS hacks and filters are needed for today's crop of A-grade browsers, and we'll learn how to customize and extend code patterns and controls in a cross-browser and easy-to-manage way.

Finally, we'll use Unobtrusive JavaScript techniques to Progressively Enhance our project with rich DHTML widgets that put the user in control. Accessibility and optimizing site performance will be front and center throughout as we use open-source tools to bring static sites to life.

Attendees should be familiarity with HTLM, CSS and JavaScript, and should have a laptop with text editor and web browsers for this exercise-heavy workshop.

Nate Koechley

Nate Koechley is a Yahoo! frontend engineer and designer based in San Francisco’s Mission district. When he’s not helping design and build the open-source Yahoo! User Interface (YUI) Library he edits the YUIBlog, promotes accessibility, defines Yahoo! browser support policies, writes occasionally at his personal blog, and presents at conferences around the globe.

More info...

Ride back to the top