View
482
Download
0
Category
Preview:
DESCRIPTION
Introduction to Progressive Enhancement
Citation preview
ThoughtWorksJ A M E S C O O K / G A R E T H R O G E R S / K O R N Y S I E T S M A
Progressive
101Enhancement
Progressive Enhancement !
!
What is it?
Progressive enhancement is a strategy for building web things in a layered fashion that allows everyone to access the basic content and functionality, using any browser or connection, while also providing an enhanced version to those with more
advanced software or greater bandwidth.
Definition
Layer your interface
Layer your interface
Semantic markup HTML
Baseline styles CSS
Modern styles CSS
Behaviour Scripting
Content task or prose
Progressive Enhancement !
!
Why care?
Simplify your solution Reduce development time
Reduce bugs Ease maintenance
Improve performance Support the past
Future-proof Mobile-critical
You’ll build a better product
Think, design, build – iteratively
You don’t always know from where
your stuff will be accessed or by whom or on what
https://gds.blog.gov.uk/2013/10/21/how-many-people-are-missing-out-on-javascript-enhancement
We didn’t really have any idea how many people are experiencing UK government web services without the enhancement of JavaScript…
GDS JavaScript research
“
Temporary network errors DNS lookup failures
Server response failures Corporate & Government Firewalls
Network Provider filters Browser extensions
Progressive Enhancement !
!
How to do it
Key technology enablers Advanced CSS
Shared client/server view templates Shared client/server code
Nashorn! React / OM / What’s next?
• Aaron Gustafson’s series on A List Apart: Understanding Progressive Enhancement, Progressive Enhancement with CSS, and Progressive Enhancement with JavaScript.
• Progressive enhancement is still important, by Jake Archibald
• Progressive Enhancement: What It Is, And How To Use It? on Smashing Magazine
• Designing with Progressive Enhancement, by Filament Group
• Enough with the JavaScript Already, by Nicholoas Zakas
Further Reading…
http://slideshare.net/ohellojamesS L I D E S AT
Any discussion?
Recommended