SlideShare a Scribd company logo
1 of 92
Download to read offline
http://bit.ly/J9REzG
http://flic.kr/p/6sbgQu
“              It is apparent to me that the possibilities
                of the aeroplane, which two or three
                years ago were thought to hold the
                solution to the [flying machine]
                problem, have been exhausted, and that
                we must turn elsewhere.
                Thomas Edison, 1895




http://flic.kr/p/6sbgQu
http://flic.kr/p/bgenU
“              Television won't last because people
                will soon get tired of staring at a
                plywood box every night.
                Daryl Zanuck, movie producer, 20th Century Fox, 1946




http://flic.kr/p/bgenU
We’re not good at
                         predicting the future



http://flic.kr/p/6e7uqr
“   We see the world through a rear-
    view mirror. We march
    backwards into the future.
    Marshall McLuhan
Pre-iPhone




      Post-iPhone



http://bit.ly/A6AhV1
“Moving pictures”
http://flic.kr/p/8j93Sm
Reading out loud




http://flic.kr/p/g4F5j
Radio with pictures
               http://flic.kr/p/5cZQTZ
Print is full of constraints
                       http://flic.kr/p/6vmzSp
...not shared by the web
 http://flic.kr/p/anLpJ5
http://www.lukew.com/ff/entry.asp?1506
http://www.lukew.com/ff/entry.asp?1506
http://www.lukew.com/ff/entry.asp?1506
http://www.lukew.com/ff/entry.asp?1506
http://www.lukew.com/ff/entry.asp?1506
Tablet sales
$49 billion by 2015




                      http://buswk.co/fK2Q9e
Global connected devices
30




20




10




   0
                               2011          2020


Source: http://bit.ly/KoRXS0
Global connected devices
30




20

       Over 50% non-mobile
10




   0
                               2011          2020


Source: http://bit.ly/KoRXS0
iCow




 http://flic.kr/p/y44Rv
http://flic.kr/p/8wwtH4
Different sizes
          http://flic.kr/p/7S5qAB
Different networks




                     http://flic.kr/p/3bqHYJ
Different hardware




http://flic.kr/p/anHsXT
Different support
http://flic.kr/p/a9GzWC
Different input

http://flic.kr/p/3eVaZ1
Different context


             http://flic.kr/p/2ynHaS
“   These examples are just the initial,
    telltale signs of a huge new wave of
    cheap devices about to invade our
    lives—a zombie apocalypse of
    electronics, if you will.
    Scott Jenson




    http://bit.ly/giroPy
Chaotic & confusing...




 http://flic.kr/p/6qi1eD
...but also awesome
http://flic.kr/p/6tTRT1
Just the start

http://flic.kr/p/3HE7Eq
Rant #1
Layout is not enough
Responsive experiences
Constellation of experiences
http://flic.kr/p/RJUvh
59%
http://yhoo.it/rSflAg
34%
http://yhoo.it/rSflAg
Contextual experiences

http://flic.kr/p/6e7uqr
Context is the key to moving
from a web that responds to
devices, to a web that
responds to people
Smarter defaults
“    Typically, masking passwords
     doesn't even increase security,
     but it does cost you business
     due to login failures
     Jakob Nielson




    http://bit.ly/9X3LAG
Hide
Capabilities
http://bit.ly/nJSlwX
http://bit.ly/nJSlwX
http://flic.kr/p/6e7uqr
Battery status
Contacts
HTML Media Capture
Media Capture
Network Information
Sensor
Vibration
Web Intents
Calendar
Menu
Geolocation
NFC
Do some research




  http://flic.kr/p/6e7uqr
“   If nothing else, it would be wise
    for us all to remember that, while
    our information technology may
    be digital in nature, the human
    beings interacting with it will
    always be infuriatingly and
    delightfully analog.
    Adam Greenfield




    Everyware: The Dawning Age of Ubiquitous Computing
We need all the tools
we can get


http://flic.kr/p/7MdW6A
Rant #2
No more dogma
UA detection
is evil!
UA detection
is evil!
Don’t blame the tools
for the craftsman


http://flic.kr/p/7MdW6A
There are bad
RWD sites
There are bad
separate sites
http://bit.ly/GH2nBe
http://flic.kr/p/6e7uqr
http://flic.kr/p/6e7uqr
http://flic.kr/p/6e7uqr
Hug it out
                         Hug it out




http://flic.kr/p/7cVEwZ
Use both!




http://flic.kr/p/81vbku
Bad UA detection
is evil!
Don’t exclude.
  http://flic.kr/p/6RtJPG
Don’t exclude. Enhance.
  http://flic.kr/p/6RtJPG
if ($device->getCapability('has_cellular_radio') ===
'true') {
!   if ($device->getCapability
('xhtml_make_phone_call_string') !== 'none') {
!   !   $wireless = true;
!   !   $method = $device->getCapability
('xhtml_make_phone_call_string');
!   } else {
!   !   $wireless = false;
!   }
} else {
!   $wireless = false;
}
if ($device->getCapability('has_cellular_radio') ===
'true') {
!   if ($device->getCapability
('xhtml_make_phone_call_string') !== 'none') {
!   !   $wireless = true;
!   !   $method = $device->getCapability
('xhtml_make_phone_call_string');
!   } else {
!   !   $wireless = false;
!   }
} else {
!   $wireless = false;
}
if ($device->getCapability('has_cellular_radio') ===
'true') {
!   if ($device->getCapability
('xhtml_make_phone_call_string') !== 'none') {
!   !   $wireless = true;
!   !   $method = $device->getCapability
('xhtml_make_phone_call_string');
!   } else {
!   !   $wireless = false;
!   }
} else {
!   $wireless = false;
}
<?php if ($wireless) { ?>
!   <p><a href="<?php echo $method; ?>
+18005555555">1-800-555-5555</a></p>
<?php } else { ?>
!   <p class="call">1-800-555-5555</p>
<?php } ?>
<?php if ($wireless) { ?>
!   <p><a href="<?php echo $method; ?>
+18005555555">1-800-555-5555</a></p>
<?php } else { ?>
!   <p class="call">1-800-555-5555</p>
<?php } ?>
<?php if ($wireless) { ?>
!   <p><a href="<?php echo $method; ?>
+18005555555">1-800-555-5555</a></p>
<?php } else { ?>
!   <p class="call">1-800-555-5555</p>
<?php } ?>
var width = window.innerWidth;
//set a cookie


<?php
$featureWidth = $_COOKIE[‘featureWidth’];
?>
http://flic.kr/p/5ox3ax
</rant>
http://www.ubuntu.com/devices/android
http://bit.ly/KuHXaH
http://breakoutjs.com/
http://jsdo.it/controller
http://jsdo.it/controller
“   Whatʼs holding smart devices
    back is our oh-so-human ability
    to misunderstand their potential.
    Scott Jenson




    http://bit.ly/HS0Jvs
Beware the rear-view mirror

http://flic.kr/p/6e7uqr
http://flic.kr/p/8wwtH4
thank you!



TIM KADLEC
WebVisions, May 2012

@tkadlec   timkadlec.com
responsiveenhancement.com
http://flic.kr/p/6e7uqr

More Related Content

Similar to Embracing the anywhere, everywhere web

Creating Responsive Experiences
Creating Responsive ExperiencesCreating Responsive Experiences
Creating Responsive ExperiencesTim Kadlec
 
IR Light vs HEV Light - OSDC.TW 2013 #osdctw
IR Light vs HEV Light - OSDC.TW 2013 #osdctwIR Light vs HEV Light - OSDC.TW 2013 #osdctw
IR Light vs HEV Light - OSDC.TW 2013 #osdctwYusuke Kawasaki
 
nullcon 2011 - No bullshit on underground crime: traces, trends, attribution,...
nullcon 2011 - No bullshit on underground crime: traces, trends, attribution,...nullcon 2011 - No bullshit on underground crime: traces, trends, attribution,...
nullcon 2011 - No bullshit on underground crime: traces, trends, attribution,...n|u - The Open Security Community
 
What if everything is awesome? Codemotion Madrid 2014
What if everything is awesome? Codemotion Madrid 2014What if everything is awesome? Codemotion Madrid 2014
What if everything is awesome? Codemotion Madrid 2014Christian Heilmann
 
Remixable Media Week 2 Seminar
Remixable Media Week 2 SeminarRemixable Media Week 2 Seminar
Remixable Media Week 2 SeminarMichela Ledwidge
 
Georgia library association 2011
Georgia library association 2011Georgia library association 2011
Georgia library association 2011Jason Griffey
 
Connecting The Digital To Analog - Brian Suda
Connecting The Digital To Analog - Brian SudaConnecting The Digital To Analog - Brian Suda
Connecting The Digital To Analog - Brian Sudabeyond tellerrand
 
AssetTouchAndTry-20180322
AssetTouchAndTry-20180322AssetTouchAndTry-20180322
AssetTouchAndTry-20180322Takashi Jona
 
Open Source Hardware at OTA11
Open Source Hardware at OTA11Open Source Hardware at OTA11
Open Source Hardware at OTA11Paul Downey
 
computer science project on movie booking system
computer science project on movie booking systemcomputer science project on movie booking system
computer science project on movie booking systemAnurag Yadav
 
Angular js活用事例:filydoc
Angular js活用事例:filydocAngular js活用事例:filydoc
Angular js活用事例:filydocKeiichi Kobayashi
 
60 Gadgets In 60 Minutes
60 Gadgets In 60 Minutes60 Gadgets In 60 Minutes
60 Gadgets In 60 MinutesVickie Kline
 
Responsive Web Design: A Deep-Dive Crash Course
Responsive Web Design: A Deep-Dive Crash CourseResponsive Web Design: A Deep-Dive Crash Course
Responsive Web Design: A Deep-Dive Crash CourseMatt Smith
 
Real time web (Orbited) at BCNE3
Real time web (Orbited) at BCNE3Real time web (Orbited) at BCNE3
Real time web (Orbited) at BCNE3Alex Kavanagh
 
Open Hardware and Libraries
Open Hardware and LibrariesOpen Hardware and Libraries
Open Hardware and LibrariesJason Griffey
 
Containerize vs Virtualize? NGDC 2009
Containerize vs Virtualize? NGDC 2009Containerize vs Virtualize? NGDC 2009
Containerize vs Virtualize? NGDC 2009Andy d
 

Similar to Embracing the anywhere, everywhere web (20)

Creating Responsive Experiences
Creating Responsive ExperiencesCreating Responsive Experiences
Creating Responsive Experiences
 
IR Light vs HEV Light - OSDC.TW 2013 #osdctw
IR Light vs HEV Light - OSDC.TW 2013 #osdctwIR Light vs HEV Light - OSDC.TW 2013 #osdctw
IR Light vs HEV Light - OSDC.TW 2013 #osdctw
 
nullcon 2011 - No bullshit on underground crime: traces, trends, attribution,...
nullcon 2011 - No bullshit on underground crime: traces, trends, attribution,...nullcon 2011 - No bullshit on underground crime: traces, trends, attribution,...
nullcon 2011 - No bullshit on underground crime: traces, trends, attribution,...
 
What if everything is awesome? Codemotion Madrid 2014
What if everything is awesome? Codemotion Madrid 2014What if everything is awesome? Codemotion Madrid 2014
What if everything is awesome? Codemotion Madrid 2014
 
Remixable Media Week 2 Seminar
Remixable Media Week 2 SeminarRemixable Media Week 2 Seminar
Remixable Media Week 2 Seminar
 
Georgia library association 2011
Georgia library association 2011Georgia library association 2011
Georgia library association 2011
 
Connecting The Digital To Analog - Brian Suda
Connecting The Digital To Analog - Brian SudaConnecting The Digital To Analog - Brian Suda
Connecting The Digital To Analog - Brian Suda
 
AssetTouchAndTry-20180322
AssetTouchAndTry-20180322AssetTouchAndTry-20180322
AssetTouchAndTry-20180322
 
Open Source Hardware at OTA11
Open Source Hardware at OTA11Open Source Hardware at OTA11
Open Source Hardware at OTA11
 
Xenforo
XenforoXenforo
Xenforo
 
computer science project on movie booking system
computer science project on movie booking systemcomputer science project on movie booking system
computer science project on movie booking system
 
Angular js活用事例:filydoc
Angular js活用事例:filydocAngular js活用事例:filydoc
Angular js活用事例:filydoc
 
60 Gadgets In 60 Minutes
60 Gadgets In 60 Minutes60 Gadgets In 60 Minutes
60 Gadgets In 60 Minutes
 
Responsive Web Design: A Deep-Dive Crash Course
Responsive Web Design: A Deep-Dive Crash CourseResponsive Web Design: A Deep-Dive Crash Course
Responsive Web Design: A Deep-Dive Crash Course
 
Simplicity
SimplicitySimplicity
Simplicity
 
Simplicity
SimplicitySimplicity
Simplicity
 
DEBUGGING THE MOBILE WEB
DEBUGGING THE MOBILE WEBDEBUGGING THE MOBILE WEB
DEBUGGING THE MOBILE WEB
 
Real time web (Orbited) at BCNE3
Real time web (Orbited) at BCNE3Real time web (Orbited) at BCNE3
Real time web (Orbited) at BCNE3
 
Open Hardware and Libraries
Open Hardware and LibrariesOpen Hardware and Libraries
Open Hardware and Libraries
 
Containerize vs Virtualize? NGDC 2009
Containerize vs Virtualize? NGDC 2009Containerize vs Virtualize? NGDC 2009
Containerize vs Virtualize? NGDC 2009
 

Recently uploaded

New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024BookNet Canada
 
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Mark Simos
 
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptxA Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptxLoriGlavin3
 
Unraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdfUnraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdfAlex Barbosa Coqueiro
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brandgvaughan
 
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024BookNet Canada
 
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek SchlawackFwdays
 
What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024Stephanie Beckett
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyAlfredo García Lavilla
 
Unleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubUnleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubKalema Edgar
 
unit 4 immunoblotting technique complete.pptx
unit 4 immunoblotting technique complete.pptxunit 4 immunoblotting technique complete.pptx
unit 4 immunoblotting technique complete.pptxBkGupta21
 
Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Mattias Andersson
 
"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr BaganFwdays
 
Developer Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLDeveloper Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLScyllaDB
 
SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024Lorenzo Miniero
 
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdfHyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdfPrecisely
 
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxMerck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxLoriGlavin3
 
From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .Alan Dix
 
Moving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdfMoving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdfLoriGlavin3
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Commit University
 

Recently uploaded (20)

New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
New from BookNet Canada for 2024: BNC CataList - Tech Forum 2024
 
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
Tampa BSides - Chef's Tour of Microsoft Security Adoption Framework (SAF)
 
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptxA Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
 
Unraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdfUnraveling Multimodality with Large Language Models.pdf
Unraveling Multimodality with Large Language Models.pdf
 
WordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your BrandWordPress Websites for Engineers: Elevate Your Brand
WordPress Websites for Engineers: Elevate Your Brand
 
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
New from BookNet Canada for 2024: Loan Stars - Tech Forum 2024
 
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
"Subclassing and Composition – A Pythonic Tour of Trade-Offs", Hynek Schlawack
 
What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024What's New in Teams Calling, Meetings and Devices March 2024
What's New in Teams Calling, Meetings and Devices March 2024
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easy
 
Unleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding ClubUnleash Your Potential - Namagunga Girls Coding Club
Unleash Your Potential - Namagunga Girls Coding Club
 
unit 4 immunoblotting technique complete.pptx
unit 4 immunoblotting technique complete.pptxunit 4 immunoblotting technique complete.pptx
unit 4 immunoblotting technique complete.pptx
 
Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?Are Multi-Cloud and Serverless Good or Bad?
Are Multi-Cloud and Serverless Good or Bad?
 
"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan"ML in Production",Oleksandr Bagan
"ML in Production",Oleksandr Bagan
 
Developer Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQLDeveloper Data Modeling Mistakes: From Postgres to NoSQL
Developer Data Modeling Mistakes: From Postgres to NoSQL
 
SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024SIP trunking in Janus @ Kamailio World 2024
SIP trunking in Janus @ Kamailio World 2024
 
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdfHyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
 
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptxMerck Moving Beyond Passwords: FIDO Paris Seminar.pptx
Merck Moving Beyond Passwords: FIDO Paris Seminar.pptx
 
From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .
 
Moving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdfMoving Beyond Passwords: FIDO Paris Seminar.pdf
Moving Beyond Passwords: FIDO Paris Seminar.pdf
 
Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!Nell’iperspazio con Rocket: il Framework Web di Rust!
Nell’iperspazio con Rocket: il Framework Web di Rust!
 

Embracing the anywhere, everywhere web