Adaptive Web Design: Crafting Rich Experiences with Progressive Enhancement (2e) : 9780134216140

Adaptive Web Design: Crafting Rich Experiences with Progressive Enhancement (2e)

 
Edition
 
2
ISBN
 
9780134216140
ISBN 10
 
0134216148
Published
 
20/11/2015
Published by
 
Pearson Higher Ed USA
Pages
 
264
Format
 
Available on demand
 
Title type
Book
$47.99
 
 
Title type
 
$28.49
 
 
Description
Adaptive Web Design, Second Edition will show students how to craft interfaces that work for any user and how each and every decision they make in a web project affects their end user. This second edition goes beyond the first edition to frame even more of the web design process in the lens of progressive enhancement. Students will learn how content strategy, UX, HTML, CSS, responsive web design, JavaScript, server-side programming, and performance optimization all come together in the service of users on whatever device they happen to use to access the Web.
Table of contents
  1. This is a Philosophy
  2. The promise of the Web: Write once, publish anywhere, for anyone
  3. Content First
  4. Markup as an Enhancement
  5. Design as an Enhancement
  6. Interaction as an Enhancement
  7. The Promise of the Web is Here…Embrace it
New to this edition

This is a Philosophy
- Universally Accessible
— Any Device (screen size, CPU, OS)
— Any Browser
— Any Interaction Method
— From the past or into the future

The promise of the Web: Write once, publish anywhere, for anyone
Future Friendly
Not about mobile, not about desktop, not about technology
Design as a continuum
Content out, mobile first


Content First
- Content is the reason we make websites
- Content is not just prose
- Content should be well-organized
- Content should be clear & well-written
- Content should be written for your audience
- Always come back to how the interface reads


Markup as an Enhancement
- Markup is the foundation
- Markup should be appropriate
— Buttons vs. links vs. Divs
— Lists
- Markup should enhance the content
— Attributes
— Microformats
— Schema.org & Open Graph
- Markup should have a purpose
— Hint at the JS creating JS markup bit
- Markup should help organize the page
— Organizational elements
— Figures, footnotes & anchors
— ARIA Landmarks
— Source order & navigation
- Markup should provide fallbacks (fault tolerance in CSS)
— Video & Audio
— Picture


Design as an Enhancement
- The purpose of design: to indicate
- Design should be a continuum
— Foundation: Enforce visual hierarchy
— Foundation: Enforce the brand identity
— Foundation: Ensure a good reading experience
- Native vs custom designs
— Shadow DOM
- CSS should be robust
— Colors
— backgrounds
— Auto-prefixer
— @supports
- CSS should be mobile-first and responsive
— Media queries
- CSS should be authored and organized for speed and maintainability
— Performance trade-offs
— Preprocessors and build scripts


Interaction as an enhancement
- Default interaction models
— HTTP & refresh
— Buttons & links
— Native Widgets
- Interaction should be possible without JavaScript
— Single-page apps
- Special markup required only for a JavaScript widget should be added via JavaScript
- CSS rules for a JavaScript widget should only be turned on when you know the widget can run
- JavaScript should be unobtrusive
— Test for JS method availability
— Test for DOM nodes
- Interactions requiring JavaScript should consider readability
— Hiding smartly
- Interactions requiring JavaScript must work with a keyboard
- Interactions with a single widget via 2 (or more) methods don’t need to behave identically as long as the desired outcome is achievable
- Offline-first?
- Web Components?


The Promise of the Web is Here… Embrace it
- Universal Accessibility/Availability
- Voice UX
- Content & UX Portability
- Be Ready for Anything


Progressive Enhancement Checklist

 

Features & benefits
• Simple, friendly guide explains how to use progressive enhancement to tackle any Web design challenge

• Students will learn how content strategy, UX, HTML, CSS, responsive web design, JavaScript, server-side programming, and performance optimization all come together in the service of users on whatever device they happen to use to access the Web

• Book uses code to help students understand how to apply the philosophy, but learning how to write code is not the focus

• When students have mastered the tenets and concepts in this book, they will see the Web in a whole new way and this will make them invaluable to an employer, their clients, and to the Web as a whole





Author biography
Aaron Gustafson has been working on the web for nearly 15 years and, in that time, has cultivated a love of web standards and an in-depth knowledge of website strategy and architecture, interface design, and numerous languages (including XHTML, CSS, JavaScript, and PHP). He is group manager of the Web Standards Project (WaSP) and serves as an Invited Expert to the World Wide Web Consortium's Open Web Education Alliance (OWEA). Gustafson lives and works in Chattanooga, TN.
Sample Pages