SlideShare a Scribd company logo
Adaptation
                                             why responsive design actually begins on the server...




http://creativecommons.org/licenses/by/2.0                       http://www.flickr.com/photos/newsbiepix/4113886275
the tech media loves
a good story...




        TechCrunch

                       http://www.flickr.com/photos/scobleizer/4694051328
200 million iOS devices




                            and life on the
                          bleeding edge...




                          http://www.flickr.com/photos/scobleizer/3553486766
1/3
                      *

of the US has a
 smartphone




                             ge
               statistics rane'll
      *current            –w
      fro m 25% to 50%licity...
                        p
       u se 1/3 for sim

                      *please note

                                     http://www.flickr.com/photos/scobleizer/4694051328

Recommended for you

Mobile Web vs. Native Apps | Design4Mobile
Mobile Web vs. Native Apps | Design4MobileMobile Web vs. Native Apps | Design4Mobile
Mobile Web vs. Native Apps | Design4Mobile

This document provides an overview of a presentation on native mobile apps versus mobile web apps. It includes slides on why developers were fighting over the two approaches, Apple's announcement allowing third-party apps on the iPhone, and the surprise success of the iPhone App Store. It also discusses factors that contributed to the App Store's success like its openness, revenue split, and fewer restrictions compared to mobile carriers. The document debates questions around whether apps create platform lock-in, if app stores are essential to a platform's success, and challenges of developing for multiple mobile platforms. It suggests that HTML5 and WebKit may become the dominant mobile platform.

mobilewebnativeappsdesign4mobile
Designing for multiple devices - GA London, 19 Nov 2012
Designing for multiple devices - GA London, 19 Nov 2012Designing for multiple devices - GA London, 19 Nov 2012
Designing for multiple devices - GA London, 19 Nov 2012

Slides from my class on November 19th 2012 at General Assembly in London about designing for multiple devices. ABSTRACT The rise in mobiles and tablets have changed the way we consume and interact with content, but also the way we design and what we base our design approach on. This class will teach you about the shift in user expectations, behaviour- and consumption patterns and what that means for designing products that will be used on multiple devices. Coming out of it you'll be equipped with guiding principles and tools to tackle the multiple device jungle.

user experience designresponsive designux
Understanding UX: Designing for multiple devices - GA London, 18 Jan 2013
Understanding UX: Designing for multiple devices - GA London, 18 Jan 2013Understanding UX: Designing for multiple devices - GA London, 18 Jan 2013
Understanding UX: Designing for multiple devices - GA London, 18 Jan 2013

Slides from my 1 hour class on January 18th at General Assembly in London during the Understanding UX day. ABSTRACT The rise in mobiles and tablets have changed the way we consume and interact with content, but also the way we design and what we base our design approach on. This class will teach you about the shift in user expectations, behaviour- and consumption patterns and what that means for designing products that will be used on multiple devices. Coming out of it you'll be equipped with guiding principles and tools to tackle the multiple device jungle.

user experience designresponsive designux
1/3
of the US has a
                         ...um, so 2/3 of the US
                  does not have a smartphone?!

 smartphone




                               http://www.flickr.com/photos/scobleizer/4694051328
or if you're a fanboy
                                              feel free to use this math*...



1/2
of the US has a
                                        and
                                              1/2
                                                does not...
 smartphone




                                 n't
                  t percentage ishe
      *the exac rtant for t
        terribly impo presentation...
                      is
     purposes of th


                                                        http://www.flickr.com/photos/abasketofpups/2662225972
will save us all!




                    http://www.flickr.com/photos/scobleizer/4694051328
but it's really only kinda useable
on few high-end devices...

                                     will save us all!




                                        http://www.flickr.com/photos/scobleizer/4694051328

Recommended for you

UCD14 Talk - Anna Dahlstrom - Device Agnostic Design: How to get your content...
UCD14 Talk - Anna Dahlstrom - Device Agnostic Design: How to get your content...UCD14 Talk - Anna Dahlstrom - Device Agnostic Design: How to get your content...
UCD14 Talk - Anna Dahlstrom - Device Agnostic Design: How to get your content...

The document discusses device agnostic design, which aims to create content that can be accessed and displayed well on any device. It emphasizes building with reusable modular components rather than bespoke designs for each device. The key aspects are understanding content stacking strategies across screens, using content-based rather than device-based breakpoints, and designing interactive elements that work for both touch and non-touch interfaces. The goal is to provide users with a continuous experience regardless of the device they use.

anna dahlstromhow totablet
SparkUp 2010 Mobile UX 101
SparkUp 2010 Mobile UX 101SparkUp 2010 Mobile UX 101
SparkUp 2010 Mobile UX 101

This document discusses improving mobile user experiences. It notes that mobile is the primary way people access the internet in some countries. Constraints on mobile like form factor and battery life must be considered. Simple interfaces work best for mobile. Native apps have advantages over mobile web, but the line is blurring. Windows Mobile was replaced by Windows Phone 7 which improved the user experience. The document emphasizes understanding user behaviors and focusing on usability.

mobile ux poland sparkup 2010
Live streaming: Designing For Multiple Devices - GA, New York, 14 March 2013
Live streaming: Designing For Multiple Devices - GA, New York, 14 March 2013Live streaming: Designing For Multiple Devices - GA, New York, 14 March 2013
Live streaming: Designing For Multiple Devices - GA, New York, 14 March 2013

Slides from my 1 hour live streaming class on March 14th at GA in New York ABSTRACT The rise in mobiles and tablets have changed the way we consume and interact with content, but also the way we design and what we base our design approach on. This class will teach you about the shift in user expectations, behaviour- and consumption patterns and what that means for designing products that will be used on multiple devices. Coming out of it you'll be equipped with guiding principles and tools to tackle the multiple device jungle.

user experience designresponsive designux
the "tech industry"
...and are we making
promises we can't keep?


     htc Magic
     Android 1.6




                                         must
                   the " bleeding edge" e of
                     ha ve Android devic stop...
                                      r
                   200 9 is now a doo




                                                   http://www.flickr.com/photos/whatleydude/3547624583
the bleeding edge...
original
the iPhone
     2007
iPhone 3G
iPhone

 2007     2008

Recommended for you

SIUI - Libraries & the Post-PC Era
SIUI - Libraries & the Post-PC EraSIUI - Libraries & the Post-PC Era
SIUI - Libraries & the Post-PC Era

The document summarizes a presentation about how libraries need to adapt to changes brought about by new mobile and portable computing devices. It notes that library visitors and website traffic increasingly come from mobile devices rather than traditional computers. It also discusses the shift to touch interfaces and how wearable technologies may become more prevalent in the future. The presentation argues that libraries need mobile-first strategies, should look outside themselves for trends, and prepare for an influx of digital information as more services move online.

Best of GA: Designing For Multiple Devices - Google Campus, 26 Feb 2013
Best of GA: Designing For Multiple Devices - Google Campus, 26 Feb 2013Best of GA: Designing For Multiple Devices - Google Campus, 26 Feb 2013
Best of GA: Designing For Multiple Devices - Google Campus, 26 Feb 2013

Slides from my 1 hour class on February 26th at Google Campus in London during the 'Best of GA' event. ABSTRACT The rise in mobiles and tablets have changed the way we consume and interact with content, but also the way we design and what we base our design approach on. This class will teach you about the shift in user expectations, behaviour- and consumption patterns and what that means for designing products that will be used on multiple devices. Coming out of it you'll be equipped with guiding principles and tools to tackle the multiple device jungle.

user experience designresponsive designux
Designing for multiple devices - GA London, 14 Jan 2013
Designing for multiple devices - GA London, 14 Jan 2013Designing for multiple devices - GA London, 14 Jan 2013
Designing for multiple devices - GA London, 14 Jan 2013

Slides from my class on January 14 at General Assembly in London about designing for multiple devices. ABSTRACT The rise in mobiles and tablets have changed the way we consume and interact with content, but also the way we design and what we base our design approach on. This class will teach you about the shift in user expectations, behaviour- and consumption patterns and what that means for designing products that will be used on multiple devices. Coming out of it you'll be equipped with guiding principles and tools to tackle the multiple device jungle.

user experience designresponsive designux
iPhone 3GS
iPhone   3G

2007     2008    2009
iPhone 4
iPhone   3G     3GS

2007     2008   2009     2010
3G     3GS     4

2008   2009   2010   2011
                            iPhone 5...
side effect n.
a peripheral or secondary effect,
especially an undesirable one...




                           http://www.thefreedictionary.com/side+effect

Recommended for you

Designing For Multiple Devices - GA New York, 6 March 2013
Designing For Multiple Devices - GA New York, 6 March 2013Designing For Multiple Devices - GA New York, 6 March 2013
Designing For Multiple Devices - GA New York, 6 March 2013

The document discusses designing for multiple devices. It covers device usage patterns, implications for design, and different approaches like responsive design versus bespoke mobile sites versus apps. It provides statistics on mobile usage and analyzes usage patterns across devices. It also discusses responsive design techniques like defining grids and content stacking strategies. Considerations for native apps on Android versus iOS are also reviewed.

user experience designresponsive designux
GA London - Designing for multiple devices, 28may2012
GA London - Designing for multiple devices, 28may2012GA London - Designing for multiple devices, 28may2012
GA London - Designing for multiple devices, 28may2012

Slides from my class on May 28 2012 at General Assembly London on designing for multiple devices. ABSTRACT The rise in mobiles and tablets have changed the way we consume and interact with content, but also the way we design and what we base our design approach on. This class will teach you about the shift in user expectations, behaviour- and consumption patterns and what that means for designing products that will be used on multiple devices. Coming out of it you'll be equipped with guiding principles and tools to tackle the multiple device jungle.

user experience designuser experiencemobile
Designing For Multiple Devices - GA London, 04 Mar 2013
Designing For Multiple Devices - GA London,  04 Mar 2013Designing For Multiple Devices - GA London,  04 Mar 2013
Designing For Multiple Devices - GA London, 04 Mar 2013

Slides from my class on the 4th of March at General Assembly in London. ABSTRACT The rise in mobiles and tablets have changed the way we consume and interact with content, but also the way we design and what we base our design approach on. This class will teach you about the shift in user expectations, behaviour- and consumption patterns and what that means for designing products that will be used on multiple devices. Coming out of it you'll be equipped with guiding principles and tools to tackle the multiple device jungle.

user experience designresponsive designux
the smartphone
                 era begins...


 original
the iPhone
     2007
brings touch, gestures
                         and the real web...


   web
 touch
         iPhone 3G
iPhone

 2007     2008
native apps and
                                the rise of Android...


         android
           apps



                   iPhone 3GS
iPhone       3G

2007         2008     2009
whither feature phones,
                               and the further rise of Android...

                htc
              g-five
          samsung
         web os
                             iPhone 4
iPhone   3G           3GS

2007     2008         2009     2010

Recommended for you

Learning Futures
Learning FuturesLearning Futures
Learning Futures

What will education and teaching look like in the future. Emerging technologies, changing pedagogies, new literacies and digital learners. This presentation is produced for teachers and trainers.

educationtraininingteachers
Designing for multiple devices - GA, New York 08 Oct 2012
Designing for multiple devices - GA, New York 08 Oct 2012Designing for multiple devices - GA, New York 08 Oct 2012
Designing for multiple devices - GA, New York 08 Oct 2012

The document discusses designing for multiple devices. It notes that mobile device usage is increasing dramatically and surpassing the global population. People use their mobile devices in many contexts throughout the day for a variety of tasks. As a result, designers must consider how to provide equal and continuous experiences across different devices. Approaches include responsive design, which adapts content based on screen size, and apps, which are focused on specific platforms. The document also highlights important differences to consider between designing for Android versus iOS.

user experience designresponsive designux
Imagination and Innovation in IT
Imagination and Innovation in ITImagination and Innovation in IT
Imagination and Innovation in IT

The document discusses how imagination led to important innovations in information technology like the Internet, World Wide Web, smartphones, and search engines. It argues that without imagination, there would be no digital revolution as we know it today and provides examples of pioneering technologies that emerged from imaginative ideas including the Internet, Web browsers, Google, iPod, and iPhone.

itgoogle searchinnovation
blackberry
                   kindle
                                      devices go mainstream
                    nook            with great expectations...


                   htc
                   LG
              samsung
              motorola
                            iPhone 5...
3G     3GS         4

2008   2009       2010       2011
we're now in that
 big grey area...
or from a different perspective...
the bleeding edge...

Recommended for you

Your browser can see and hear and ...
Your browser can see and hear and ...Your browser can see and hear and ...
Your browser can see and hear and ...

New sensor based Web Standards developments have punched a hole in the web that is letting the real world leak into the browser. The getUserMedia API now lets us access cameras and microphones and JSARToolkit and javascript based Natural Feature Tracking like the examples from ICG Graz University have shown that browsers can now be taught to perceive the world around them. Combine this with the <canvas> and WebGL and you have a real working model for a Web Standards based Augmented Reality. On top of this we also have OGCs Sensor Web Enablement and new developments like the Sensor API and the rapid spread of networked sensors and wireless Arduino-ised devices. Massively distributed dynamic immersive visualisation is now the new structural form for the modern web.

augmented realityweb3ar
e is for everywhere - Interactive Mobile Web Presentation
e is for everywhere - Interactive Mobile Web Presentatione is for everywhere - Interactive Mobile Web Presentation
e is for everywhere - Interactive Mobile Web Presentation

This presentation at Web Directions South 2007 captures the screens from an interactive poll held during the presentation. 67 people in the audience joined in and a dynamic profile of their phones, browsers, operating system and network providers is also include. A more involved analysis of the results will be available soon...

Build your own reality
Build your own realityBuild your own reality
Build your own reality

A presentation on the history of buildAR.com, Augmented Reality, Virtual Reality and Wearables for the Australian Department of Communications.

aweaugmented realityar
the bleeding edge...



                       +   'ish via China




opportunity
but we still can't see
the forest for the trees...




         http://www.flickr.com/photos/clairity/1449248189
2/3
            *


  of the US does not
have a smartphone...
                                               e
                              *or 1/2 if you'r
                                 a fanboy...




    http://www.flickr.com/photos/centralasian/3239065547
last year we
asked a simple question...




           http://www.flickr.com/photos/fpat/3692425154

Recommended for you

Divergence - what happens after Convergence
Divergence - what happens after ConvergenceDivergence - what happens after Convergence
Divergence - what happens after Convergence

Convergence is the verb that everyone is focused upon. Divergence is the noun at the end of that process. This presentation lays out some foundation ideas for mobile strategy development.

Mobiles Can Make Your Business Fly
Mobiles Can Make Your Business FlyMobiles Can Make Your Business Fly
Mobiles Can Make Your Business Fly

The document discusses mobile trends and how businesses can develop mobile strategies. It notes that over 1.7 billion people use internet on PCs while over 4.1 billion use mobile phones. Further, over 1 million iPhones have been sold in Australia in less than 2 years and iPhone users frequently upgrade the operating system. The document suggests that the key difference mobile brings is context, contact and community and asks how these mobile trends impact a business' model and value chain. It recommends that a mobile strategy focus on context, contact and community.

integratedbusinessinternet
The future of media queries?
The future of media queries?The future of media queries?
The future of media queries?

A brief exploration of proposed Level 4 Media Queries and some thoughts about the future of the web. Presented at Responsive Day Out in Brighton on June 27 2014.

future of the webmobilew3c
welcome to the
  mobile web
I asked this a year ago,
i'm not sure anything's
changed!!




                                    if you want to use the web
                           on a mobile device, is the purchase
                               of an iPhone the cost of entry?



                                              http://www.flickr.com/photos/sketch22/1127556671
to infinity and beyond...




     well over
by 2015 50% of web traffic is expected
        to come from mobile devices




                 http://www.netmagazine.com/news/uk-sees-huge-mobile-web-traffic-growth-111340
let me rephrase the question...
still the only
                            device where
                             the Web
                           actually works




                        this is rhetorical, and absurd...


  in 2015, if you want to use the web
on a mobile device, will the purchase
       of an iPhone be mandatory...?

                    http://www.flickr.com/photos/dantaylor/2161663267

Recommended for you

Designing for diversity - how to stop worrying and embrace the Android revol...
Designing for diversity -  how to stop worrying and embrace the Android revol...Designing for diversity -  how to stop worrying and embrace the Android revol...
Designing for diversity - how to stop worrying and embrace the Android revol...

It took 16 years for smartphone penetration to reach 1 billion people. Analysts believe it will take only 3 years to reach the next billion. The devices these consumers buy will be incredibly diverse, yet many will run on Android; a platform that now sees more than 1.5 million activations per day. In this presentation, we explore the fascinating rise of Android around the globe. From dual SIM phones in Indonesia, to dual screen e-ink devices in Russia and crowd-sourced platform modifications in China, we will discover the role open source has played in Android's popularity and how to design for such a diverse environment.

appsresponsive designmediatek
Exploring the physical web
Exploring the physical webExploring the physical web
Exploring the physical web

Today’s 'smart devices' are a product of the technology and mental models of our past. From a connected lightbulb to a robot vacuum, using most of these devices requires a native app. This in turn greatly limits their contexts of use. Can we really expect users to download an app to interact with a random ’thing’ they encounter at the mall, a space they explore for an hour at the museum, or a city they will only visit for a day? What devices could we build, what 'smart' environments could we enable if users could simply discover, “walk up and use”(and then if needed, abandon) these objects and environments as they do a web site? This workshop will discuss two new technologies--Physical Web and Web Bluetooth--that can enable on-demand interaction with physical things and spaces using no more than a browser.

bluetooth lemobile marketingbluetooth
Most Beautiful Women Of The World
Most Beautiful Women Of The WorldMost Beautiful Women Of The World
Most Beautiful Women Of The World

The document contains several quotes about beauty, charm, and sexuality from various sources. It discusses the idea that charm is more important than other qualities, that trying too hard to appear sexy can be unattractive, and that true beauty comes from within and being confident in oneself.

femalegirlswoman
gotta get 'em all...




                                                      or even want
                many of us cannot afford to
purchase every shiny new device released...




                               http://www.flickr.com/photos/bytemarks/4732726333
especially in the light of
        recent events...




       http://www.flickr.com/photos/wagnertc/3217859975
http://www.flickr.com/photos/chiacomo/3805139360
most folks have much more
       pressing concerns...




            http://www.flickr.com/photos/bobolink/4706580

Recommended for you

Everything old is new again
Everything old is new againEverything old is new again
Everything old is new again

Presentation by Stephanie Rieger of Yiibu at the MobX Conference in Berlin, Germany November 17, 2012.

historymobxberlin
Letting Go
Letting GoLetting Go
Letting Go

The document discusses the challenges of designing products in today's environment of rapid technological disruption and change. It notes that the adoption of new technologies is happening at an unprecedented pace, and that users now expect to cocreate and modify products. This shifting landscape requires designers to create more adaptable and loosely defined products that can evolve with input from many actors in the ecosystem. Orchestrating tightly controlled experiences becomes difficult as products spread online and are influenced by diverse perspectives.

designdisruption
Responsive Design
Responsive DesignResponsive Design
Responsive Design

Websites are all about content. People can access your content many different ways and formats with mobile devices, iPads, phones, etc. The questions are: how can we maintain control over the display of our content and keep our brand consistent? How can we try to provide the best user experience on any platform? Enter Responsive Web Design. Many experts are not leaning on one static design but on structured content that adapts to its given environment. In this talk, we are going to take a look at responsive web design techniques out there including: progressive enhancement, flexible grids, media queries, flexible images & video, & other methods of implementation.

mobile firstadaptive designweb design
and far
higher priorities...



  http://www.flickr.com/photos/ilamont/4329364198
which often result in very
different purchasing decisions...




                 http://www.flickr.com/photos/timstock/535259176
however...
as lots of Android devices are
now available for less than $200*....




                    or very close to it...
                   ...*free is also becoming a popular option!

                                             http://www.flickr.com/photos/cambodia4kidsorg/5253151186

Recommended for you

Designing for conversation
Designing for conversationDesigning for conversation
Designing for conversation

The document discusses the current state of conversational interfaces such as chatbots and voice assistants, noting that while early versions were limited, recent advances in artificial intelligence, data availability, and user expectations have created new opportunities for conversational interfaces to become more useful. However, conversational interfaces still have limitations and work best when focused on simple, well-defined tasks rather than attempting to replace more complex interactions or functions better suited to humans. Designing effective conversational interfaces requires keeping interactions simple, clearly setting user expectations, and in some cases, involving human assistance.

interaction designartificial intelligencebots
iMentor Steve Jobs
iMentor Steve JobsiMentor Steve Jobs
iMentor Steve Jobs

This document provides 10 lessons learned from Steve Jobs as described by the author's "iMentor", Steve Jobs. The lessons are: follow your heart, make a dent in the universe, think different, sell dreams not products, make products for yourself, say no to 1,000 things, keep it simple, go for excellence, break the rules, and that you only live once. The author reflects on how Steve Jobs impacted their principles at work and home through the mentorship and inspiration of Jobs, though they never directly met.

imentorsteve jobsresignation
Travel Tips Learned from Japan! - #japan #traveltips
Travel Tips Learned from Japan! - #japan #traveltipsTravel Tips Learned from Japan! - #japan #traveltips
Travel Tips Learned from Japan! - #japan #traveltips

Ohaiyogozaimasu! This presentation was crafted to help those traveling to Japan for the first time, providing priceless tips that will help navigate and experience Japan to the fullest! Enjoy! : ) www.empoweredpresentations.com @empoweredpres

empowered presentationspowerpointcontest
and some feature phones aimed at
                            the next billion now include WebKit
        ooh, touch...
                                            and a touch screen...




                      ype
Nokia  C3 Touch & T
   S  eries 40 device




                                                http://www.flickr.com/photos/yoggy0/5380738918
every phone is now (essentially)
                                                   a smartphone*...
                                                                        or soon will be




                        ns of
       ctual definitioy - but to
     *a
                ill var
 'smartphone' wey are all magic...
normal folks th
                                                      http://www.flickr.com/photos/tanj/4432327487
camera, video,
                                         3G connectivity
                                                                            music player, etc.

                                 large, colour
                                 touch sensitive screen
                                                                          a modern web
                                                                          browser (not WAP)




(often) a real, update-able
operating system                loaded with everything we've come
                                    to expect from a smartphone...


                    QWERTY keyboard
                    and/or trackball




                                                           http://www.flickr.com/photos/free_programmer/4371778263
less vibrant screens

                                                less responsive
                                                touch screens
limited or no data
plan bundled



                                                 lower spec RAM
                                                 and/or CPU/GPU




                                                few or no OEM
                                                OS updates



                               but not every smartphone
                                       is created equal...


                                         http://www.flickr.com/photos/nechbi/3841765925

Recommended for you

The Emerging Global Web
The Emerging Global WebThe Emerging Global Web
The Emerging Global Web

The web was first conceived 25 years ago, by an Englishman. Fifteen years later, as the first crop of dot.coms were going bust, close to 60% of its users (and all Alexa "top 20" sites) came from developed nations. Fast forward to today, and the picture is strikingly different. Almost half the Alexa "top 20" now comes from emerging economies. Economies where close to 3 billion people have yet to use the web, but thanks to mobile--won't have to wait much longer to discover it. This presentation will introduce you to fascinating and innovative services that are re-shaping the web to serve the consumers of tomorrow. Driven by mobile, the power of personal relationships, and the breakneck pace of globalisation, these services provide a glimpse into the business models, opportunities and challenges we will face, when growing a truly global web.

appsomnichannelqr code
Its about people, not devices
Its about people, not devicesIts about people, not devices
Its about people, not devices

The document discusses the diversity of mobile devices globally and how this diversity is likely to persist. It notes that while some designers may choose to only design for the newest, most powerful platforms, an inclusive approach is needed to provide accessibility while still ensuring a great user experience across a wide range of contexts, inputs, and users. Context, attention, and usability have changed as mobile devices have become more capable and integrated into more aspects of our lives.

yiibu
The trouble with context
The trouble with contextThe trouble with context
The trouble with context

The document discusses how the context in which mobile devices are used has become increasingly complex and unpredictable. Guidelines from a few years ago around mobile design being context-driven are now outdated, as mobile and Internet-connected devices have proliferated and their uses have diversified. Over 5 billion people now own mobile devices, which for many are their primary or only means of Internet access. This shift has dramatically changed user behavior and expectations.

yiibu
UNDESIRABLE
              this inequality creates diversity
                   and (often) "undesirables"...

                              http://www.flickr.com/photos/handwrite/3460075040
"Android WebKit is the closest thing to
being the IE6 of mobile development for me."
- @dalmaer via http://functionsource.com/post/a-day-in-the-life-of-android-webkit-dealings



                                                        http://www.flickr.com/photos/blank22763/4089926742
this thinking creates...
an optimal experience for
    for a privileged few...


         http://www.flickr.com/photos/carbonnyc/5140154965

Recommended for you

Rethinking the mobile web
Rethinking the mobile webRethinking the mobile web
Rethinking the mobile web

This document discusses creating an accessible and inclusive mobile experience. It begins by noting that while some devices like the iPhone are popular, they only represent a small portion of the overall mobile device market and user population. It then examines the need to make the mobile web accessible to all users, not just those with certain devices, and provides examples of how usage and capabilities vary greatly across the global mobile landscape. The document advocates for an adaptive approach that considers all mobile contexts rather than targeting specific devices or browsers.

mobileweb design and development
Beyond the mobile web
Beyond the mobile webBeyond the mobile web
Beyond the mobile web

The document discusses how the internet and mobile technology have become integrated into everyday life. Key points include: - The internet is no longer an activity confined to desktop computers, but something that people access constantly through mobile devices. - There are now over 5 billion mobile subscribers globally, and mobile phones are becoming as powerful as computers were a few years ago. - People use their mobile devices to engage in many activities like chatting, scheduling, shopping, and following up on things looked up on other devices. - Mobile internet usage is shifting from just short activities to complementing and facilitating longer tasks like research, transactions, and important decisions.

Beyond The Mobile Web By Yiibu 110412113255 Phpapp01
Beyond The Mobile Web By Yiibu 110412113255 Phpapp01Beyond The Mobile Web By Yiibu 110412113255 Phpapp01
Beyond The Mobile Web By Yiibu 110412113255 Phpapp01

Mobile internet access is becoming ubiquitous, with over 1.3 billion people now using their mobile devices to access the internet. Context for how the internet is accessed has changed dramatically, with people now commonly using their phones, tablets, and other devices to engage in many online activities both brief and extended. This has disrupted traditional models of web design which focused on desktop access with predictable contexts. A new approach is needed to create engaging mobile content in this environment of tremendous diversity and unpredictability.

and a missed opportunity
for many more...

           linkedin HTML5 webapp disappointment




                                                                                    must
                                                                     leeding edge" f 2009
                                                              the "b              o
                                                            have A ndroid device r stop...
                                                                              doo
                                                             is once again a
                                                  http://www.flickr.com/photos/dumbledad/3400708183
2 year old, state-of-the-art
    your smartphone is obsolete,
           please upgrade now...


                               http://www.flickr.com/photos/herval/2050815997
um...
for most folks these
are not "higher priorities"...


            http://www.flickr.com/photos/aaronpk/5328338679

Recommended for you

Beyond The Mobile Web By Yiibu
Beyond The Mobile Web By YiibuBeyond The Mobile Web By Yiibu
Beyond The Mobile Web By Yiibu

The document discusses how the internet and mobile technology have become integrated into everyday life. Key points include: - The internet is no longer an activity confined to desktop computers, but something that people access constantly through mobile devices. - There are now over 5 billion mobile subscribers globally, and mobile phones are becoming as powerful as computers were a few years ago. - People use their mobile devices to engage in many activities like chatting, scheduling, shopping, and following up on things looked up on other devices. - Mobile internet usage is shifting from just short activities to complementing and facilitating longer tasks like research, transactions, and important decisions.

paymentsdigital commercemobile
Yiibu goingmobile2010-100818120505-phpapp01
Yiibu goingmobile2010-100818120505-phpapp01Yiibu goingmobile2010-100818120505-phpapp01
Yiibu goingmobile2010-100818120505-phpapp01

Mobile devices have seen tremendous growth over the past decade. What began as voice-only devices are now powerful computers that are highly personal, accessible through many operating systems and manufacturers, and support a vast array of applications and services. However, designing for mobile introduces unique constraints around limited screens, battery life, and varied contexts of use. The most popular uses of mobile today include social networking, games, photos, messaging and information searching, though there is opportunity for applications that enhance people's lives in meaningful ways by supporting tasks, learning, self-improvement and quality of life. Successful mobile design focuses on the user, iterates quickly, and views limitations as opportunities rather than barriers.

technologypeople and societymobile
Mobile mapping w3g
Mobile mapping w3gMobile mapping w3g
Mobile mapping w3g

This document discusses lessons learned about developing cross-platform mobile maps. It notes that mobile usage has greatly increased over desktop in recent years. Effective cross-platform mapping requires supporting major mobile browsers out of the box while being optimized for slower 3G connections by reducing accuracy, limiting interactivity, breaking content into smaller pieces, and handling disruptions gracefully. User location detection is also important but poses challenges. Code samples are provided at the given URL.

w3g cross platform mobile mapping
welcome to
the real world...


http://www.flickr.com/photos/slemmon/3971197662
where we learn to
adapt as required...


   http://www.flickr.com/photos/kalleboo/3536493996
craftivism




             where simply learning to knit
                   can change your life...



                         http://www.flickr.com/photos/bosstweed/152159981
from your local library
                                                                          where borrowing books for free
                                                                           is beating paying for ebooks...




Times Are Tough, Libraries Are Thriving
http://www.nytimes.com/2009/03/15/nyregion/long-island/15libraryli.html                 http://www.flickr.com/photos/ccacnorthlib/3553821229/

Recommended for you

Mobxbeyondthehamburgermenu13sep2014 140916040153-phpapp01
Mobxbeyondthehamburgermenu13sep2014 140916040153-phpapp01Mobxbeyondthehamburgermenu13sep2014 140916040153-phpapp01
Mobxbeyondthehamburgermenu13sep2014 140916040153-phpapp01

The document discusses designing experiences for multiple devices. It notes that users now own and switch between multiple devices throughout the day, from phones to tablets to wearables. As such, designers must consider how to provide equal, continuous experiences across different platforms and prioritize building modular content that can be adapted for any device or input method. Navigation and usability must work seamlessly regardless of screen size or input type.

anna dahlström
Beyond The Hamburger Menu - MOBX, 13 Sep 2014
Beyond The Hamburger Menu - MOBX, 13 Sep 2014Beyond The Hamburger Menu - MOBX, 13 Sep 2014
Beyond The Hamburger Menu - MOBX, 13 Sep 2014

The document discusses designing experiences for multiple devices. It notes that users now own and switch between multiple devices throughout the day, from phones to tablets to wearables. As such, designers must consider how to provide equal, continuous experiences across different platforms and prioritize building modular content that can be adapted for any device or input method. Navigation and usability must work seamlessly regardless of device.

multiple devicesmobilewearables
Adapting to Input — Smashing Conference NYC
Adapting to Input — Smashing Conference NYCAdapting to Input — Smashing Conference NYC
Adapting to Input — Smashing Conference NYC

Input is constantly evolving and expanding beyond traditional keyboard and mouse. The document discusses 7 principles for adapting web design to different inputs: 1. Design for the largest target by default. 2. Design for modes of interaction instead of specific inputs. 3. Make designs accessible to all inputs. 4. Support multiple concurrent inputs. 5. Abstract baseline inputs like tap, click, and point. 6. Progressively enhance with new inputs like gestures and sensors. 7. Include different inputs in testing plans. The key message is that input cannot be detected, is a continuum, and is always changing. Web design needs to be adaptable and not assume certain inputs based on device properties.

web developmentweb designinput
where Hulu, iTunes and sports bars
      are replacing cable services...
                               expensive




           http://www.businessinsider.com/2008/3/hulu-household-why-i-got-rid-of-cable
and which led @grigs
to pick up those clippers...




          http://www.flickr.com/photos/kdnewton/2691125617
but...
the iPhone inspired everyone
to expect more from their devices...




                  http://www.flickr.com/photos/tom_ruaat/5540148158

Recommended for you

Beyond Progressive Enhancement by yiibu
Beyond Progressive Enhancement by yiibuBeyond Progressive Enhancement by yiibu
Beyond Progressive Enhancement by yiibu

The document discusses how technology is increasingly woven into everyday life and the physical world. It describes several new technologies like smart connected objects, self-driving cars that collect data, smart forks that track eating habits and communicate with apps. It argues that the web needs to embrace these new technologies and find ways to connect physical systems to provide more seamless experiences, rather than trying to compete with native apps. The future may involve the web enabling discovery of physical objects and powering connections between various systems and technologies.

technologyfuturefood and related products
A Mobile Introductory
A Mobile IntroductoryA Mobile Introductory
A Mobile Introductory

A mobile introduction: covering native and cross platform development, fragmentation, UI and UX and some projects ive worked on.

mobilecross platformuser experience
The effects of digital devices
The effects of digital devicesThe effects of digital devices
The effects of digital devices

The document discusses the effects of digital devices on customers and their lives. It notes that phones demand too much attention taking away from real experiences. It also discusses how analog metaphors make less sense with digital devices and new paradigms are needed for experiencing media like text on screens. Finally, it talks about how all information feeds into something larger than individuals, like a superorganism or colony of digital information, and how greater internet thought is now manifesting locally through events like the Arab Spring.

digitalmarketingstrategy
"...yeah, but people don't actually use
those undesirable devices?"




                                          http://www.flickr.com/photos/misterian/4084280385
yup
...have you actually
offered them anything yet?
                                        re
                         logs, chances aail...
            check your in the long t
           you'll find them




            http://www.flickr.com/photos/zoetnet/4669800101/
small
                                    a few companies
                                 most certainly have...




             twitter indonesia


0.facebook

                                  OperaMini
                                      http://www.flickr.com/photos/nseika/5848996146

Recommended for you

Mobile Web Vs Mobile Apps
Mobile Web Vs Mobile AppsMobile Web Vs Mobile Apps
Mobile Web Vs Mobile Apps

From the 2010 Internet Usability Conference, how to best determine whether to use the Web or build your own app for mobile devices.

appsandroidapplications
Native vs. Mobile Web vs. Hybrid Apps for Mobile Development
Native vs. Mobile Web vs. Hybrid Apps for Mobile DevelopmentNative vs. Mobile Web vs. Hybrid Apps for Mobile Development
Native vs. Mobile Web vs. Hybrid Apps for Mobile Development

Examining the landscape of the mobile development, the hidden challenges of the iPhone app store, and the middle way provided by hybrid applications.

phonegapandroidiphone
Mobile UX 101 @ Flash Camp Manchester
Mobile UX 101 @ Flash Camp ManchesterMobile UX 101 @ Flash Camp Manchester
Mobile UX 101 @ Flash Camp Manchester

An overview of the current state of Mobile UX, presented to attendees of Flash Camp Manchester by Jerome and Antony from Ribot

behavioursuxtrends
us humans are amazing when it comes
                           to adapting to new circumstances...




...do we still really
   need the dogs?




                                            http://www.flickr.com/photos/thenationalguard/3251277781
the web was actually built
   on similar principles...




           http://www.flickr.com/photos/tanaka/3212373419
"The primary design principle underlying the Web's
usefulness and growth is universality.

The Web should be usable by people with disabilities.
It must work with any form of information, be it a
document or a point of data, and information of any
quality–from a silly tweet to a scholarly paper.

And it should be accessible from any kind of hardware
than can connect to the internet: stationary or mobile,
small screen or large."
                                                                                            ...
                                                                    as seen b efore @bdconf
Tim Berners-Lee

Long Live the Web
http://www.scientificamerican.com/article.cfm?id=long-live-the-web




                                                                           http://www.flickr.com/photos/lonelyfox/2939757714
unfortunately, our current
mental models started back here...

                 http://www.flickr.com/photos/blakespot/2343395804

Recommended for you

Yiibu rethinkingthemobileweb-100910074556-phpapp01
Yiibu rethinkingthemobileweb-100910074556-phpapp01Yiibu rethinkingthemobileweb-100910074556-phpapp01
Yiibu rethinkingthemobileweb-100910074556-phpapp01

The document discusses designing mobile web experiences. It begins by noting that while some devices like the iPhone are popular, the overall penetration of smartphones remains relatively low globally. It then examines the diversity of mobile devices and browsers in use. The document argues for an adaptive approach that works across different browsers and devices, using techniques like responsive design with media queries. It provides guidelines for mobile-friendly development, such as using semantic HTML, limiting animations for performance, and structuring CSS to deliver the right styles for each device type. The goal is to make the mobile web accessible to all users, not just those with specific devices.

Casting Off Our Desktop Shackles
Casting Off Our Desktop ShacklesCasting Off Our Desktop Shackles
Casting Off Our Desktop Shackles

No matter how much we try to put ourselves into a mobile first mentality, it is hard for us to do so fully. Our access to PCs prevents us from experiencing mobile the way many in the world do. We're currently fighting for parity among experiences. We're arguing that the mobile version shouldn't be a dumbed down version of the desktop site. But we've set our sights too low. In a true Mobile First world, the mobile version should be the best experience. Mobile shouldn't just match the desktop experience, it should exceed it.

mobilewebwebvisionswvpdx
Mobile experiences
Mobile experiencesMobile experiences
Mobile experiences

A talk I gave in november 2011 for our internal Web Developer Network at EVRY. Inspirational slides, tweets and flickr photos are credited with links to the sources. Thanks!

responsivemobile experienceweb design
The Era of mobile dominance is beginning




                            which did not prepare us for a world
paul rouget taiwan africa
                              dominated by devices like these...

                                                          http://www.flickr.com/photos/whiteafrican/2594981758
“The best, most solid way out of a crisis
in a changing market is through
experiment and adaptation.”
Richard Branson
Business Stripped Bare – Adventures of a Global Entrepreneur




                                                               http://www.flickr.com/photos/jedibfa/5146867827
<diversion>
          http://www.flickr.com/photos/y_i/2330044065
short
     a tale of clients
       and servers...




http://www.flickr.com/photos/richardberg/2135409739

Recommended for you

20240702 QFM021 Machine Intelligence Reading List June 2024
20240702 QFM021 Machine Intelligence Reading List June 202420240702 QFM021 Machine Intelligence Reading List June 2024
20240702 QFM021 Machine Intelligence Reading List June 2024

Everything that I found interesting about machines behaving intelligently during June 2024

quantumfaxmachine
20240702 Présentation Plateforme GenAI.pdf
20240702 Présentation Plateforme GenAI.pdf20240702 Présentation Plateforme GenAI.pdf
20240702 Présentation Plateforme GenAI.pdf

Support en anglais diffusé lors de l'événement 100% IA organisé dans les locaux parisiens d'Iguane Solutions, le mardi 2 juillet 2024 : - Présentation de notre plateforme IA plug and play : ses fonctionnalités avancées, telles que son interface utilisateur intuitive, son copilot puissant et des outils de monitoring performants. - REX client : Cyril Janssens, CTO d’ easybourse, partage son expérience d’utilisation de notre plateforme IA plug & play.

genaicloudrgpd
The Increasing Use of the National Research Platform by the CSU Campuses
The Increasing Use of the National Research Platform by the CSU CampusesThe Increasing Use of the National Research Platform by the CSU Campuses
The Increasing Use of the National Research Platform by the CSU Campuses

CIO Council Cal Poly Humboldt September 22, 2023

national research platformdistributed supercomputerdistributed systems
pastrami on rye...   a client makes a request
                                to a server...




                              http://www.flickr.com/photos/_ppo/2393063853
other unique clients make
                                                                similar requests...
                                                                          yet not identical




                          Rueben...
turkey                                             chilli dog...
         grilled cheese               brisket...

                                                               corned beef...




                                                                         http://www.flickr.com/photos/_ppo/2393063853
Rueben...


chilli dog...




                a method to track each client
                        request is required...


                              http://www.flickr.com/photos/mrgarin/3476714113
as each client request
                                                                  is received...


tra pickle...                         no pickle...     Rueben...
           pastrami on rye... turkey                               chilli dog...
  Rueben...                        Rueben...
                 grilled cheese                      brisket...                corned beef...




                                                                    http://www.flickr.com/photos/_ppo/2393063853

Recommended for you

Manual | Product | Research Presentation
Manual | Product | Research PresentationManual | Product | Research Presentation
Manual | Product | Research Presentation

Manual Method of Product Research | Helium10 | MBS RETRIEVER

product researchhelium10 | mbs retriever
Research Directions for Cross Reality Interfaces
Research Directions for Cross Reality InterfacesResearch Directions for Cross Reality Interfaces
Research Directions for Cross Reality Interfaces

An invited talk given by Mark Billinghurst on Research Directions for Cross Reality Interfaces. This was given on July 2nd 2024 as part of the 2024 Summer School on Cross Reality in Hagenberg, Austria (July 1st - 7th)

augmented realitycross realityvirtual reality
Comparison Table of DiskWarrior Alternatives.pdf
Comparison Table of DiskWarrior Alternatives.pdfComparison Table of DiskWarrior Alternatives.pdf
Comparison Table of DiskWarrior Alternatives.pdf

To help you choose the best DiskWarrior alternative, we've compiled a comparison table summarizing the features, pros, cons, and pricing of six alternatives.

data recoverydatadiskwarrior
the server tailors each request
                                                           to each client...
                                320, hold the pickle...
                                                              one more 320...
                        150, pastrami...              210 to go...



tracking (ticketing, bills, etc)
analytics (what works, what doesn't)
preparation (vs just-in-time)
tacit knowledge




                                                                  http://www.flickr.com/photos/_ppo/2393063853
ensuring they get exactly
       what they need...




        http://www.flickr.com/photos/the_junes/2134127618
rather than everything they
          might not want...




         http://www.flickr.com/photos/86624586@N00/10176570
<diversion/>




          http://www.flickr.com/photos/alper/3257406961

Recommended for you

Pigging Solutions Sustainability brochure.pdf
Pigging Solutions Sustainability brochure.pdfPigging Solutions Sustainability brochure.pdf
Pigging Solutions Sustainability brochure.pdf

Sustainability requires ingenuity and stewardship. Did you know Pigging Solutions pigging systems help you achieve your sustainable manufacturing goals AND provide rapid return on investment. How? Our systems recover over 99% of product in transfer piping. Recovering trapped product from transfer lines that would otherwise become flush-waste, means you can increase batch yields and eliminate flush waste. From raw materials to finished product, if you can pump it, we can pig it.

pigging solutionsprocess piggingproduct transfers
Measuring the Impact of Network Latency at Twitter
Measuring the Impact of Network Latency at TwitterMeasuring the Impact of Network Latency at Twitter
Measuring the Impact of Network Latency at Twitter

Widya Salim and Victor Ma will outline the causal impact analysis, framework, and key learnings used to quantify the impact of reducing Twitter's network latency.

Best Practices for Effectively Running dbt in Airflow.pdf
Best Practices for Effectively Running dbt in Airflow.pdfBest Practices for Effectively Running dbt in Airflow.pdf
Best Practices for Effectively Running dbt in Airflow.pdf

As a popular open-source library for analytics engineering, dbt is often used in combination with Airflow. Orchestrating and executing dbt models as DAGs ensures an additional layer of control over tasks, observability, and provides a reliable, scalable environment to run dbt models. This webinar will cover a step-by-step guide to Cosmos, an open source package from Astronomer that helps you easily run your dbt Core projects as Airflow DAGs and Task Groups, all with just a few lines of code. We’ll walk through: - Standard ways of running dbt (and when to utilize other methods) - How Cosmos can be used to run and visualize your dbt projects in Airflow - Common challenges and how to address them, including performance, dependency conflicts, and more - How running dbt projects in Airflow helps with cost optimization Webinar given on 9 July 2024

apache airflowdbtdbt-core
...but what does this
have to do with mobile?




     http://www.flickr.com/photos/mikeycordedda/5328343979
accomplish great things together
  working client and server can...




                http://www.flickr.com/photos/maladjusted/2341398753
client
http://domain.org




client




                     yet unknown
                   a client makes
            a request to a server...

Recommended for you

WhatsApp Image 2024-03-27 at 08.19.52_bfd93109.pdf
WhatsApp Image 2024-03-27 at 08.19.52_bfd93109.pdfWhatsApp Image 2024-03-27 at 08.19.52_bfd93109.pdf
WhatsApp Image 2024-03-27 at 08.19.52_bfd93109.pdf

Profile portofolio

What’s New in Teams Calling, Meetings and Devices May 2024
What’s New in Teams Calling, Meetings and Devices May 2024What’s New in Teams Calling, Meetings and Devices May 2024
What’s New in Teams Calling, Meetings and Devices May 2024

This is a powerpoint that features Microsoft Teams Devices and everything that is new including updates to its software and devices for May 2024

microsoft teamsmicrosoft
Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...
Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...
Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...

Slide of the tutorial entitled "Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Emerging Trends" held at UMAP'24: 32nd ACM Conference on User Modeling, Adaptation and Personalization (July 1, 2024 | Cagliari, Italy)

user modelinguser profilinguser model
http://domain.org




     server
clouds are hip these days...




      server
http://domain.org
...profile please?




      server
http://domain.org




              server then asks the client
                  for it's profile cookie...
yeah, you're going to need a profile...



                             server
                       http://domain.org




                           if a client doesn't have a profile
                      cookie the server creates one for it...

Recommended for you

Transcript: Details of description part II: Describing images in practice - T...
Transcript: Details of description part II: Describing images in practice - T...Transcript: Details of description part II: Describing images in practice - T...
Transcript: Details of description part II: Describing images in practice - T...

This presentation explores the practical application of image description techniques. Familiar guidelines will be demonstrated in practice, and descriptions will be developed “live”! If you have learned a lot about the theory of image description techniques but want to feel more confident putting them into practice, this is the presentation for you. There will be useful, actionable information for everyone, whether you are working with authors, colleagues, alone, or leveraging AI as a collaborator. Link to presentation recording and slides: https://bnctechforum.ca/sessions/details-of-description-part-ii-describing-images-in-practice/ Presented by BookNet Canada on June 25, 2024, with support from the Department of Canadian Heritage.

a11yaccessibilityalt text
WPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide DeckWPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide Deck

YOUR RELIABLE WEB DESIGN & DEVELOPMENT TEAM — FOR LASTING SUCCESS WPRiders is a web development company specialized in WordPress and WooCommerce websites and plugins for customers around the world. The company is headquartered in Bucharest, Romania, but our team members are located all over the world. Our customers are primarily from the US and Western Europe, but we have clients from Australia, Canada and other areas as well. Some facts about WPRiders and why we are one of the best firms around: More than 700 five-star reviews! You can check them here. 1500 WordPress projects delivered. We respond 80% faster than other firms! Data provided by Freshdesk. We’ve been in business since 2015. We are located in 7 countries and have 22 team members. With so many projects delivered, our team knows what works and what doesn’t when it comes to WordPress and WooCommerce. Our team members are: - highly experienced developers (employees & contractors with 5 -10+ years of experience), - great designers with an eye for UX/UI with 10+ years of experience - project managers with development background who speak both tech and non-tech - QA specialists - Conversion Rate Optimisation - CRO experts They are all working together to provide you with the best possible service. We are passionate about WordPress, and we love creating custom solutions that help our clients achieve their goals. At WPRiders, we are committed to building long-term relationships with our clients. We believe in accountability, in doing the right thing, as well as in transparency and open communication. You can read more about WPRiders on the About us page.

web development agencywpriderswordpress development
Coordinate Systems in FME 101 - Webinar Slides
Coordinate Systems in FME 101 - Webinar SlidesCoordinate Systems in FME 101 - Webinar Slides
Coordinate Systems in FME 101 - Webinar Slides

If you’ve ever had to analyze a map or GPS data, chances are you’ve encountered and even worked with coordinate systems. As historical data continually updates through GPS, understanding coordinate systems is increasingly crucial. However, not everyone knows why they exist or how to effectively use them for data-driven insights. During this webinar, you’ll learn exactly what coordinate systems are and how you can use FME to maintain and transform your data’s coordinate systems in an easy-to-digest way, accurately representing the geographical space that it exists within. During this webinar, you will have the chance to: - Enhance Your Understanding: Gain a clear overview of what coordinate systems are and their value - Learn Practical Applications: Why we need datams and projections, plus units between coordinate systems - Maximize with FME: Understand how FME handles coordinate systems, including a brief summary of the 3 main reprojectors - Custom Coordinate Systems: Learn how to work with FME and coordinate systems beyond what is natively supported - Look Ahead: Gain insights into where FME is headed with coordinate systems in the future Don’t miss the opportunity to improve the value you receive from your coordinate system data, ultimately allowing you to streamline your data analysis and maximize your time. See you there!

{
  	
  	
  width:{
  	
  	
  	
  	
  screen:240,
  	
  	
  	
  	
  document:240
  	
  	
  }
  }
                                       let's start with the 'default' profile...

 default profile

*defining a 'default' baseline
profile depends on your
project requirements...
                                          server
                                    http://domain.org




                                                                            or default*

notice that this makes the
                                           begin with a baseline profile
assumption that basic = default   that covers the very basic experience...
(in other words "mobile first")
eww....
                               then...grab the client user agent string
                            (trust me, it's more useful than you think)




                                              server
                                        http://domain.org

...oh yes, user-agent please?




Mozilla/5.0	
  (Linux;	
  U;	
  Android	
  2.1-­‐update1;	
  en-­‐gb;	
  Nexus	
  One	
  Build/ERE27)	
  
AppleWebKit/530.17	
  (KHTML,	
  like	
  Gecko)	
  Version/4.0	
  Mobile	
  Safari/530.17
Mozilla/5.0	
  (Linux;	
  U;	
  Android	
  2.1-­‐update1;	
  en-­‐gb;	
  Nexus	
  One	
  Build/ERE27)	
  
       AppleWebKit/530.17	
  (KHTML,	
  like	
  Gecko)	
  Version/4.0	
  Mobile	
  Safari/530.17




hey DeviceAtlas, wanna check this UA for me?



                                                     server
                                               http://domain.org




                                           query the user agent string against
                                      a device database such as DeviceAtlas...
                                                                                                        ...or WURFL
Mozilla/5.0	
  (Linux;	
  U;	
  Android	
  2.1-­‐update1;	
  en-­‐gb;	
  Nexus	
  One	
  Build/ERE27)	
  
    AppleWebKit/530.17	
  (KHTML,	
  like	
  Gecko)	
  Version/4.0	
  Mobile	
  Safari/530.17




{
	
  width:480,                                                ...found it, here it comes!
	
  height:480,
	
  color-­‐depth:8,
	
  touch:true,
	
  cookie:true,
	
  ...
}
                                         http://deviceatlas.com
DeviceAtlas profile

Recommended for you

RPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptx
RPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptxRPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptx
RPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptx

Your comprehensive guide to RPA in healthcare for 2024. Explore the benefits, use cases, and emerging trends of robotic process automation. Understand the challenges and prepare for the future of healthcare automation

rpa in healthcarerpa in healthcare usarpa in healthcare industry
Mitigating the Impact of State Management in Cloud Stream Processing Systems
Mitigating the Impact of State Management in Cloud Stream Processing SystemsMitigating the Impact of State Management in Cloud Stream Processing Systems
Mitigating the Impact of State Management in Cloud Stream Processing Systems

Stream processing is a crucial component of modern data infrastructure, but constructing an efficient and scalable stream processing system can be challenging. Decoupling compute and storage architecture has emerged as an effective solution to these challenges, but it can introduce high latency issues, especially when dealing with complex continuous queries that necessitate managing extra-large internal states. In this talk, we focus on addressing the high latency issues associated with S3 storage in stream processing systems that employ a decoupled compute and storage architecture. We delve into the root causes of latency in this context and explore various techniques to minimize the impact of S3 latency on stream processing performance. Our proposed approach is to implement a tiered storage mechanism that leverages a blend of high-performance and low-cost storage tiers to reduce data movement between the compute and storage layers while maintaining efficient processing. Throughout the talk, we will present experimental results that demonstrate the effectiveness of our approach in mitigating the impact of S3 latency on stream processing. By the end of the talk, attendees will have gained insights into how to optimize their stream processing systems for reduced latency and improved cost-efficiency.

TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-InTrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In

Six months into 2024, and it is clear the privacy ecosystem takes no days off!! Regulators continue to implement and enforce new regulations, businesses strive to meet requirements, and technology advances like AI have privacy professionals scratching their heads about managing risk. What can we learn about the first six months of data privacy trends and events in 2024? How should this inform your privacy program management for the rest of the year? Join TrustArc, Goodwin, and Snyk privacy experts as they discuss the changes we’ve seen in the first half of 2024 and gain insight into the concrete, actionable steps you can take to up-level your privacy program in the second half of the year. This webinar will review: - Key changes to privacy regulations in 2024 - Key themes in privacy and data governance in 2024 - How to maximize your privacy program in the second half of 2024

data privacyprivacy complianceai
{
	
  	
  width:{
	
  	
  	
  	
  screen:240,
	
  	
  	
  	
  document:240
	
  	
  }
}
default profile
                               ...hmm, I think I've seen this before?

                                               server
{
	
  width:480,                           http://domain.org
	
  height:480,
	
  color-­‐depth:8,
	
  touch:true,
	
  cookie:true,
	
  ...
}

DeviceAtlas profile                now query the user agent string against
                                any tacit knowledge you have collected...
                                                                        may
 	
  	
  	
   "profile":{"width":"240"}
	
  	
  	
  },
	
  	
  	
  "desktop":	
  {
	
  	
  	
  	
   "match":"#windows|macintosh|linux#i",
	
  	
  	
  	
   "profile":{"width":"800"}                        tacit data
	
  	
  	
  },
	
  	
  	
  "iphone":	
  {
	
  	
  	
  	
   "match":"#iphone#i",
	
  	
  	
  	
   "profile":{"ios":"1",	
  "width":"320",	
  "svg":true,	
  "canvas":true}
	
  	
  	
  },
	
  	
  	
  "ipad":	
  {
	
  	
  	
  	
   "match":"#ipad#i",
	
  	
  	
  	
   "profile":{"ios":"1",	
  "width":"768",	
  "svg":true,	
  "canvas":true}
	
  	
  	
  },
	
  	
  "android":	
  {
	
  	
  	
  	
   "match":"#android#i",
	
  	
  	
  	
   "profile":{"droid":"1",	
  "width":"320",	
  "flash":true,	
  "canvas":true,	
  "video":true}
	
  	
  	
  },
	
  	
  	
  "symbian^3":	
  {
                                                                                         Tacit (or known) profile
	
  	
  	
  	
   "match":"#symbian/3#i",
	
  	
  	
  	
   "profile":{"sym3":"1",	
  "width":"360"}
	
  	
  	
  },
	
  	
  	
  "symbian9.4":	
  {
	
  	
  	
  	
   "match":"#symbianos/9.4#i",
	
  	
  	
  	
   "profile":{"sym94":"1",	
  "width":"360"}
	
  	
  	
  },
	
  	
  	
  "symbian9.3":	
  {
	
  	
  	
  	
   "match":"#symbianos/9.3#i",
	
  	
  	
  	
   "profile":{"sym93":"1",	
  "width":"360"}
                                                               partial profiles are matched via
	
  	
  	
  },
	
  	
  	
  "n73":	
  {                                                 UA string fragments...
	
  	
  	
  	
   "match":"#N73#i",
	
  	
  	
  	
   "profile":{"sym91":"1",	
  "width":"240"}
	
  	
  	
  },
	
  	
  	
  "series602.x":	
  {
	
  	
  	
  	
   "match":"#series60/2.8|{series60/2.9}#i",
{
	
  	
  width:{                          tacit data
	
  	
  	
  	
  screen:240,
	
  	
  	
  	
  document:240
	
  	
  }
}
default profile

{
	
  width:320,
	
  droid:1,                   yeah, I've seen this before...
	
  canvas:true,
	
  flash:true,
	
  video:true,                            server
	
  ...                              http://domain.org
}

Tacit (or known) profile


{
	
  width:480,
	
  height:480,                         this tacit knowledge is gathered
	
  color-­‐depth:8,
	
  touch:true,                    over time from other device profiles...
	
  cookie:true,
	
  ...                                                         ...or through knowledge
}                                                               gained during testing
DeviceAtlas profile
{
	
  	
  width:{
	
  	
  	
  	
  screen:320,
	
  	
  	
  	
  document:320
	
  	
  },
	
  	
  xhr:true,
	
  	
  canvas:true,
	
  	
  flash:false,
	
  	
  video:true,
	
  	
  formats:{                              server
	
  	
  h264:probably,                   http://domain.org
	
  	
  ogg:false,
	
  	
  webm:false
	
  	
  },
	
  	
  offline:true
}
Client profile
                                      merge the baseline data, with the data
                               returned from queries into the client profile...

Recommended for you

DealBook of Ukraine: 2024 edition
DealBook of Ukraine: 2024 editionDealBook of Ukraine: 2024 edition
DealBook of Ukraine: 2024 edition

The DealBook is our annual overview of the Ukrainian tech investment industry. This edition comprehensively covers the full year 2023 and the first deals of 2024.

Quality Patents: Patents That Stand the Test of Time
Quality Patents: Patents That Stand the Test of TimeQuality Patents: Patents That Stand the Test of Time
Quality Patents: Patents That Stand the Test of Time

Is your patent a vanity piece of paper for your office wall? Or is it a reliable, defendable, assertable, property right? The difference is often quality. Is your patent simply a transactional cost and a large pile of legal bills for your startup? Or is it a leverageable asset worthy of attracting precious investment dollars, worth its cost in multiples of valuation? The difference is often quality. Is your patent application only good enough to get through the examination process? Or has it been crafted to stand the tests of time and varied audiences if you later need to assert that document against an infringer, find yourself litigating with it in an Article 3 Court at the hands of a judge and jury, God forbid, end up having to defend its validity at the PTAB, or even needing to use it to block pirated imports at the International Trade Commission? The difference is often quality. Quality will be our focus for a good chunk of the remainder of this season. What goes into a quality patent, and where possible, how do you get it without breaking the bank? ** Episode Overview ** In this first episode of our quality series, Kristen Hansen and the panel discuss: ⦿ What do we mean when we say patent quality? ⦿ Why is patent quality important? ⦿ How to balance quality and budget ⦿ The importance of searching, continuations, and draftsperson domain expertise ⦿ Very practical tips, tricks, examples, and Kristen’s Musts for drafting quality applications https://www.aurorapatents.com/patently-strategic-podcast.html

patentspatent applicationpatent prosecution
cookie

{
	
  	
  width:{                   document
	
  	
  	
  	
  screen:320,
	
  	
  	
  	
  document:320
	
  	
  },
	
  	
  xhr:true,                             response
	
  	
  canvas:true,
	
  	
  flash:false,
	
  	
  video:true,
	
  	
  formats:{                           server
	
  	
  h264:probably,                http://domain.org
	
  	
  ogg:false,
	
  	
  webm:false
	
  	
  },
	
  	
  offline:true
}
Client profile
                               write the profile cookie to the doc header
                                     which will be returned to the client...
{
	
  	
  width:{
	
  	
  	
  	
  screen:320,
	
  	
  	
  	
  document:320
	
  	
  },
	
  	
  xhr:true,                  response
	
  	
  canvas:true,                               profile
	
  	
  flash:false,
	
  	
  video:true,
	
  	
  formats:{                    server
	
  	
  h264:probably,         http://domain.org
	
  	
  ogg:false,
	
  	
  webm:false
	
  	
  },
	
  	
  offline:true
}
                                                            for this client
Client profile
                                     server now has a usable profile
                                                 and can continue...
media queries are not a means                           using Javascript to modify
of adapting content contained                            significant portions of the
within the DOM on the client...                       DOM will impact performance
                                                                on mobile devices...



                                      response
                                   filter
                                        server
                                  http://domain.org




                                                               and adapt
                       the server now begins to filter the content
                     based on the properties in the client profile...
Adaptation Rules
ensure all images are
appropriately sized for
client display
replace any images that
contain fine details or text
replace Flash media with
an appropriate alternative         response
where not supported
remove unnecessary
markup, scripts, etc.                server
                               http://domain.org




                                                              or app
                        adaptation 'rules' will vary from site to site,
                          but adapting <img>'s is most common...

Recommended for you

Adaptation Rules
ensure all images are
appropriately sized for
client display
replace any images that
contain fine details or text
replace Flash media with
an appropriate alternative         response
where not supported
remove unnecessary
markup, scripts, etc.                server
                               http://domain.org
adapt large tables as
required, link to data
serve appropriate video
format, codec and size
adapt DOM components
including scripts and styles       <video>, <table> and other DOM
                                  structures also require adaptation
                                                   may
Adaptation Rules                                     Resource Bundles
ensure all images are                                         alternate content
appropriately sized for                                   appropriate for context
client display
                                                       alternate DOM templates,
replace any images that                               components & fragments
contain fine details or text
                                                     alternate sized, formatted +
replace Flash media with                              encoded video as required
an appropriate alternative         response
where not supported                                         alternate images for
                                                            required breakpoints
remove unnecessary
markup, scripts, etc.                server            alternate scripts + styles
                               http://domain.org       for required client profiles
adapt large tables as
required, link to data
serve appropriate video
format, codec and size
adapt DOM components
including scripts and styles                       you will often require
                                                        new resources
    "pinch-­‐zoom":{
	
     	
   "0-­‐320":"resources/images/meego/pinch-­‐zoom@240.png",
	
     	
   "320-­‐720":"resources/images/meego/pinch-­‐zoom@320.png",        Resource Bundles
	
     	
   "720-­‐9999":"resources/images/meego/pinch-­‐zoom.png"
	
     },                                                                              alternate content
	
     "typing":{
	
     	
   "0-­‐320":"resources/images/meego/typing@240.png",
                                                                                   appropriate for context
	
     	
   "320-­‐720":"resources/images/meego/typing@320.png",
	
     	
   "720-­‐9999":"resources/images/meego/typing.png"                    alternate DOM templates,
	
     },                                                                      components & fragments
	
     "stay-­‐safe":{
	
     	
   "0-­‐320":"resources/images/meego/stay-­‐safe@240.png",           alternate sized, formatted +
	
     	
   "320-­‐720":"resources/images/meego/stay-­‐safe@320.png",          encoded video as required
	
     	
   "720-­‐9999":"resources/images/meego/stay-­‐safe.png"
	
     },                                                                            alternate images for
	
     "swipe-­‐more":{                                                              required breakpoints
	
     	
   "0-­‐320":"resources/images/meego/swipe@240.jpg",
	
     	
   "320-­‐640":"resources/images/meego/swipe@320.jpg",
	
     	
   "640-­‐9999":"resources/images/meego/swipe.jpg"                     alternate scripts + styles
	
     },                                                                       for required client profiles
	
     "pinch-­‐zoom-­‐more":{
	
     	
   "0-­‐320":"resources/images/meego/pinch-­‐zoom@240.png",
	
     	
   "320-­‐720":"resources/images/meego/pinch-­‐zoom@320.png",
	
     	
   "720-­‐9999":"resources/images/meego/pinch-­‐zoom.png"
	
     },
	
     "typing-­‐more":{
	
     	
   "0-­‐320":"resources/images/meego/typing@240.png",
	
  
	
  
       	
   "320-­‐720":"resources/images/meego/typing@320.png",
       	
   "720-­‐9999":"resources/images/meego/typing.png"             which can be defined in
	
  
	
  
       },
       "stay-­‐safe-­‐more":{                                             any number of ways...
	
     	
   "0-­‐320":"resources/images/meego/stay-­‐safe@240.png",
	
     	
   "320-­‐720":"resources/images/meego/stay-­‐safe@320.png",
	
     	
   "720-­‐9999":"resources/images/meego/stay-­‐safe.png"
	
     },
	
     "location":{
video
                      data



                               images




      response


        server
  http://domain.org




these resources can be static, cached
    or even dynamically generated...
                        which would make them
                         even more responsive

Recommended for you

response


      server
http://domain.org




                all content adaptation is
               performed on the server...
                               before the page is
                                  downloaded
response


                server
          http://domain.org




                                        on the client
alternate resources that may later be required
              are then bundled as references...
{}
             response


               server
         http://domain.org




                                  feature detection
                an additional profile <script>
is also included in the response to the client...
{}

Recommended for you

Adaptation: Why responsive design actually begins on the server
server
http://domain.org
client
{
	
  	
  width:{
	
  	
  	
  	
  screen:480,
	
  	
  	
  	
  document:480
	
  	
  },
	
  	
  xhr:true,
	
  	
  canvas:true,
	
  	
  flash:true,
	
  	
  video:true,
	
  	
  formats:{
	
  	
  h264:probably,
	
  	
  ogg:true,
	
  	
  webm:false
	
  	
  },
	
  	
  offline:true
}
Client profile
                                                     feature detection
                                    the client executes its profile <script>
                               and updates its profile cookie accordingly...

Recommended for you

Adaptation: Why responsive design actually begins on the server
or screen resize
on an orientation change
    the script fires again...
images


{
	
  	
  width:{                updated
	
  	
  	
  	
  screen:800,
	
  	
  	
  	
  document:800
	
  	
  },
	
  	
  xhr:true,
	
  	
  canvas:true,
	
  	
  flash:true,
	
  	
  video:true,
	
  	
  formats:{
	
  	
  h264:probably,
	
  	
  ogg:true,
	
  	
  webm:false
	
  	
  },
	
  	
  offline:true
}
Client profile
                                         and if needed, additional resources
                                                          are downloaded...
                                                                 based on the pre-
                                                                 bundled references
http://domain.org/fava-beans/chianti




                            known
                      a client makes
           a new request to a server...

Recommended for you

...profile please?



      server
http://domain.org




             server then asks the client
                 for it's profile cookie...
{
	
  	
  width:{
                               ...ah, wonderful you've filled in the rest!
	
  	
  	
  	
  screen:800,
	
  	
  	
  	
  document:800
	
  	
  },
	
  	
  xhr:true,
	
  	
  canvas:true,
	
  	
  flash:true,
	
  	
  video:true,
	
  	
  formats:{                            server
	
  	
  h264:probably,                 http://domain.org
	
  	
  ogg:true,
	
  	
  webm:false
	
  	
  },
	
  	
  offline:true
}
Client profile
                                                     which now accurately
                                           represents the requesting client...
tacit data




            server
      http://domain.org




         server captures the client-tested
profile properties for later dB integration...
let me get that for you...
                             response


                             server
                       http://domain.org




                                                 and adapt
                        server then begins to filter content
                                based on the client profile...

Recommended for you

response


      server
http://domain.org




                              on the client
            any resources required are
         then bundled as references...
{}
Adaptation: Why responsive design actually begins on the server
server
http://domain.org

Recommended for you

client




         ...ta da!
and repeat as
   required...
Adaptation: Why responsive design actually begins on the server
Adaptation: Why responsive design actually begins on the server

Recommended for you

all in preparation for the coming
            zombie apocalypse...
            @scottjenson zombie frog




                 http://www.flickr.com/photos/digitalsextant/3624030270
benefits of this
       approach...




http://www.flickr.com/photos/sarahreido/3120877348
known
                              focus on the features,
                                    not the device...




                        OperaMini



ceçi n'est plus un iphone
                                    http://www.flickr.com/photos/jane_garratt/5377694159
browser
 accepts that features
   are rarely binary...



just because it's 'supported', doesn't mean
it works as intended (or works at all)...


                               http://html5test.com/

Recommended for you

tweaks for "important" devices
(e.g. client-specific requests,
business goal-specific, partners,
high-traffic edge cases etc.)



                                   tacit data enables you to
create custom properties needed
for your specific project              fine tune the profiles...



override false positives




                                            http://www.flickr.com/photos/mujitra/2559447601
handling
which makes edge cases
         much easier...




   http://twitter.com/#!/stephanierieger/status/113604185857069056
all heavy lifting occurs
        on the server...

      http://www.flickr.com/photos/mackarus/4289960218
folks and their
supports a broader range of devices
where client-side-only approaches
can be unreliable...




                                          http://www.flickr.com/photos/mackarus/3022623866

Recommended for you

embrace the future of
"unknown unknowns"...




        http://www.flickr.com/photos/jgoforth/87176920
a few thoughts
  for tomorrow...




http://www.flickr.com/photos/slemmon/3971195778
the <img> tag...
          was an after thought




http://diveintomark.org/archives/2009/11/02/why-do-we-have-an-img-element
...perhaps it's finally time
                                                                       to rethink it?


<image	
  alt="butterfly">
  <source	
  src="butterfly-­‐small.png"	
  width="100"	
  height="80"	
  />
  <source	
  src="butterfly.png"	
  width="200"	
  height="160"	
  />
  <source	
  src="butterfly-­‐large.svg"	
  width="400"	
  height="400"
  	
  media="min-­‐device-­‐width:320px"	
  />
</image>
                       this of course does not exist,
                       and is simply wishful thinking...

Recommended for you

<html>
                                         ...media queries for the DOM?
...                                                    ie: conditional content
@media	
  all	
  (max-­‐device-­‐width:320px)	
  {
	
  	
  <img	
  src="butterfly-­‐small.png"	
  width="100"	
  height="80"	
  />
}

@media	
  all	
  (min-­‐device-­‐width:320px)	
  {
	
  	
  <img	
  src="butterfly.png"	
  width="200"	
  height="160"	
  />
}

@media	
  all	
  (min-­‐device-­‐width:320px)	
  and	
  (svg:true)	
  {
	
  	
  <img	
  src="butterfly.svg"	
  width="400"	
  height="400"	
  />
}
                                        this of course does not exist, and is
...                                     only the simplest form of an idea...
</html>
rethinking (and extending)
    content negotiation...




           http://en.wikipedia.org/wiki/Content_negotiation
and maybe even go back and
                                          revisit UA strings...
Andrea Trasatti sorting user agent strings out


                                                      ee
                               for so me thoughts...srting
                              Andrea  Trasatti's "So ut"
                                                    O
                               User  Agent Strings




                                                       http://en.wikipedia.org/wiki/User_agent
"The wise adapt themselves to circumstances,
    as the water moulds itself to the pitcher."
                                             Chinese Proverb




                              http://www.flickr.com/photos/theowl84/3045227001

Recommended for you

@yiibu
please
say
         hi hello@yiibu.com


                                                                       thank you



    the font we
    use is
             Museo
             http://www.exljbris.com/museo.html


         many thanks to the
         amazing photographers
         on

             http://www.flickr.com/creativecommons/by-2.0


         licensed under

             http://creativecommons.org/licenses/by/2.0


             available on
             http://www.slideshare.net/yiibu/adaptation




                                                           http://www.flickr.com/photos/kwl/4171367373

More Related Content

What's hot

Imagining the physical web
Imagining the physical webImagining the physical web
Imagining the physical web
yiibu
 
Why You Should Make Mobile Your Career | Clark College
Why You Should Make Mobile Your Career | Clark CollegeWhy You Should Make Mobile Your Career | Clark College
Why You Should Make Mobile Your Career | Clark College
Jason Grigsby
 
Rethinking the Mobile Web by Yiibu
Rethinking the Mobile Web by YiibuRethinking the Mobile Web by Yiibu
Rethinking the Mobile Web by Yiibu
Bryan Rieger
 
Mobile Web vs. Native Apps | Design4Mobile
Mobile Web vs. Native Apps | Design4MobileMobile Web vs. Native Apps | Design4Mobile
Mobile Web vs. Native Apps | Design4Mobile
Jason Grigsby
 
Designing for multiple devices - GA London, 19 Nov 2012
Designing for multiple devices - GA London, 19 Nov 2012Designing for multiple devices - GA London, 19 Nov 2012
Designing for multiple devices - GA London, 19 Nov 2012
Anna Dahlström
 
Understanding UX: Designing for multiple devices - GA London, 18 Jan 2013
Understanding UX: Designing for multiple devices - GA London, 18 Jan 2013Understanding UX: Designing for multiple devices - GA London, 18 Jan 2013
Understanding UX: Designing for multiple devices - GA London, 18 Jan 2013
Anna Dahlström
 
UCD14 Talk - Anna Dahlstrom - Device Agnostic Design: How to get your content...
UCD14 Talk - Anna Dahlstrom - Device Agnostic Design: How to get your content...UCD14 Talk - Anna Dahlstrom - Device Agnostic Design: How to get your content...
UCD14 Talk - Anna Dahlstrom - Device Agnostic Design: How to get your content...
UCD UK Ltd
 
SparkUp 2010 Mobile UX 101
SparkUp 2010 Mobile UX 101SparkUp 2010 Mobile UX 101
SparkUp 2010 Mobile UX 101
Antony Ribot
 
Live streaming: Designing For Multiple Devices - GA, New York, 14 March 2013
Live streaming: Designing For Multiple Devices - GA, New York, 14 March 2013Live streaming: Designing For Multiple Devices - GA, New York, 14 March 2013
Live streaming: Designing For Multiple Devices - GA, New York, 14 March 2013
Anna Dahlström
 
SIUI - Libraries & the Post-PC Era
SIUI - Libraries & the Post-PC EraSIUI - Libraries & the Post-PC Era
SIUI - Libraries & the Post-PC Era
Jason Griffey
 
Best of GA: Designing For Multiple Devices - Google Campus, 26 Feb 2013
Best of GA: Designing For Multiple Devices - Google Campus, 26 Feb 2013Best of GA: Designing For Multiple Devices - Google Campus, 26 Feb 2013
Best of GA: Designing For Multiple Devices - Google Campus, 26 Feb 2013
Anna Dahlström
 
Designing for multiple devices - GA London, 14 Jan 2013
Designing for multiple devices - GA London, 14 Jan 2013Designing for multiple devices - GA London, 14 Jan 2013
Designing for multiple devices - GA London, 14 Jan 2013
Anna Dahlström
 
Designing For Multiple Devices - GA New York, 6 March 2013
Designing For Multiple Devices - GA New York, 6 March 2013Designing For Multiple Devices - GA New York, 6 March 2013
Designing For Multiple Devices - GA New York, 6 March 2013
Anna Dahlström
 
GA London - Designing for multiple devices, 28may2012
GA London - Designing for multiple devices, 28may2012GA London - Designing for multiple devices, 28may2012
GA London - Designing for multiple devices, 28may2012
Anna Dahlström
 
Designing For Multiple Devices - GA London, 04 Mar 2013
Designing For Multiple Devices - GA London,  04 Mar 2013Designing For Multiple Devices - GA London,  04 Mar 2013
Designing For Multiple Devices - GA London, 04 Mar 2013
Anna Dahlström
 
Learning Futures
Learning FuturesLearning Futures
Learning Futures
GrahamAttwell
 
Designing for multiple devices - GA, New York 08 Oct 2012
Designing for multiple devices - GA, New York 08 Oct 2012Designing for multiple devices - GA, New York 08 Oct 2012
Designing for multiple devices - GA, New York 08 Oct 2012
Anna Dahlström
 
Imagination and Innovation in IT
Imagination and Innovation in ITImagination and Innovation in IT
Imagination and Innovation in IT
Kanda Runapongsa Saikaew
 

What's hot (18)

Imagining the physical web
Imagining the physical webImagining the physical web
Imagining the physical web
 
Why You Should Make Mobile Your Career | Clark College
Why You Should Make Mobile Your Career | Clark CollegeWhy You Should Make Mobile Your Career | Clark College
Why You Should Make Mobile Your Career | Clark College
 
Rethinking the Mobile Web by Yiibu
Rethinking the Mobile Web by YiibuRethinking the Mobile Web by Yiibu
Rethinking the Mobile Web by Yiibu
 
Mobile Web vs. Native Apps | Design4Mobile
Mobile Web vs. Native Apps | Design4MobileMobile Web vs. Native Apps | Design4Mobile
Mobile Web vs. Native Apps | Design4Mobile
 
Designing for multiple devices - GA London, 19 Nov 2012
Designing for multiple devices - GA London, 19 Nov 2012Designing for multiple devices - GA London, 19 Nov 2012
Designing for multiple devices - GA London, 19 Nov 2012
 
Understanding UX: Designing for multiple devices - GA London, 18 Jan 2013
Understanding UX: Designing for multiple devices - GA London, 18 Jan 2013Understanding UX: Designing for multiple devices - GA London, 18 Jan 2013
Understanding UX: Designing for multiple devices - GA London, 18 Jan 2013
 
UCD14 Talk - Anna Dahlstrom - Device Agnostic Design: How to get your content...
UCD14 Talk - Anna Dahlstrom - Device Agnostic Design: How to get your content...UCD14 Talk - Anna Dahlstrom - Device Agnostic Design: How to get your content...
UCD14 Talk - Anna Dahlstrom - Device Agnostic Design: How to get your content...
 
SparkUp 2010 Mobile UX 101
SparkUp 2010 Mobile UX 101SparkUp 2010 Mobile UX 101
SparkUp 2010 Mobile UX 101
 
Live streaming: Designing For Multiple Devices - GA, New York, 14 March 2013
Live streaming: Designing For Multiple Devices - GA, New York, 14 March 2013Live streaming: Designing For Multiple Devices - GA, New York, 14 March 2013
Live streaming: Designing For Multiple Devices - GA, New York, 14 March 2013
 
SIUI - Libraries & the Post-PC Era
SIUI - Libraries & the Post-PC EraSIUI - Libraries & the Post-PC Era
SIUI - Libraries & the Post-PC Era
 
Best of GA: Designing For Multiple Devices - Google Campus, 26 Feb 2013
Best of GA: Designing For Multiple Devices - Google Campus, 26 Feb 2013Best of GA: Designing For Multiple Devices - Google Campus, 26 Feb 2013
Best of GA: Designing For Multiple Devices - Google Campus, 26 Feb 2013
 
Designing for multiple devices - GA London, 14 Jan 2013
Designing for multiple devices - GA London, 14 Jan 2013Designing for multiple devices - GA London, 14 Jan 2013
Designing for multiple devices - GA London, 14 Jan 2013
 
Designing For Multiple Devices - GA New York, 6 March 2013
Designing For Multiple Devices - GA New York, 6 March 2013Designing For Multiple Devices - GA New York, 6 March 2013
Designing For Multiple Devices - GA New York, 6 March 2013
 
GA London - Designing for multiple devices, 28may2012
GA London - Designing for multiple devices, 28may2012GA London - Designing for multiple devices, 28may2012
GA London - Designing for multiple devices, 28may2012
 
Designing For Multiple Devices - GA London, 04 Mar 2013
Designing For Multiple Devices - GA London,  04 Mar 2013Designing For Multiple Devices - GA London,  04 Mar 2013
Designing For Multiple Devices - GA London, 04 Mar 2013
 
Learning Futures
Learning FuturesLearning Futures
Learning Futures
 
Designing for multiple devices - GA, New York 08 Oct 2012
Designing for multiple devices - GA, New York 08 Oct 2012Designing for multiple devices - GA, New York 08 Oct 2012
Designing for multiple devices - GA, New York 08 Oct 2012
 
Imagination and Innovation in IT
Imagination and Innovation in ITImagination and Innovation in IT
Imagination and Innovation in IT
 

Viewers also liked

Your browser can see and hear and ...
Your browser can see and hear and ...Your browser can see and hear and ...
Your browser can see and hear and ...
Rob Manson
 
e is for everywhere - Interactive Mobile Web Presentation
e is for everywhere - Interactive Mobile Web Presentatione is for everywhere - Interactive Mobile Web Presentation
e is for everywhere - Interactive Mobile Web Presentation
Rob Manson
 
Build your own reality
Build your own realityBuild your own reality
Build your own reality
Rob Manson
 
Divergence - what happens after Convergence
Divergence - what happens after ConvergenceDivergence - what happens after Convergence
Divergence - what happens after Convergence
Rob Manson
 
Mobiles Can Make Your Business Fly
Mobiles Can Make Your Business FlyMobiles Can Make Your Business Fly
Mobiles Can Make Your Business Fly
Rob Manson
 
The future of media queries?
The future of media queries?The future of media queries?
The future of media queries?
yiibu
 
Designing for diversity - how to stop worrying and embrace the Android revol...
Designing for diversity -  how to stop worrying and embrace the Android revol...Designing for diversity -  how to stop worrying and embrace the Android revol...
Designing for diversity - how to stop worrying and embrace the Android revol...
yiibu
 
Exploring the physical web
Exploring the physical webExploring the physical web
Exploring the physical web
yiibu
 
Most Beautiful Women Of The World
Most Beautiful Women Of The WorldMost Beautiful Women Of The World
Most Beautiful Women Of The World
Juan De Flandes
 
Everything old is new again
Everything old is new againEverything old is new again
Everything old is new again
yiibu
 
Letting Go
Letting GoLetting Go
Letting Go
yiibu
 
Responsive Design
Responsive DesignResponsive Design
Responsive Design
Sara Cannon
 
Designing for conversation
Designing for conversationDesigning for conversation
Designing for conversation
yiibu
 
iMentor Steve Jobs
iMentor Steve JobsiMentor Steve Jobs
iMentor Steve Jobs
Tomas Bay
 
Travel Tips Learned from Japan! - #japan #traveltips
Travel Tips Learned from Japan! - #japan #traveltipsTravel Tips Learned from Japan! - #japan #traveltips
Travel Tips Learned from Japan! - #japan #traveltips
Empowered Presentations
 
The Emerging Global Web
The Emerging Global WebThe Emerging Global Web
The Emerging Global Web
yiibu
 

Viewers also liked (16)

Your browser can see and hear and ...
Your browser can see and hear and ...Your browser can see and hear and ...
Your browser can see and hear and ...
 
e is for everywhere - Interactive Mobile Web Presentation
e is for everywhere - Interactive Mobile Web Presentatione is for everywhere - Interactive Mobile Web Presentation
e is for everywhere - Interactive Mobile Web Presentation
 
Build your own reality
Build your own realityBuild your own reality
Build your own reality
 
Divergence - what happens after Convergence
Divergence - what happens after ConvergenceDivergence - what happens after Convergence
Divergence - what happens after Convergence
 
Mobiles Can Make Your Business Fly
Mobiles Can Make Your Business FlyMobiles Can Make Your Business Fly
Mobiles Can Make Your Business Fly
 
The future of media queries?
The future of media queries?The future of media queries?
The future of media queries?
 
Designing for diversity - how to stop worrying and embrace the Android revol...
Designing for diversity -  how to stop worrying and embrace the Android revol...Designing for diversity -  how to stop worrying and embrace the Android revol...
Designing for diversity - how to stop worrying and embrace the Android revol...
 
Exploring the physical web
Exploring the physical webExploring the physical web
Exploring the physical web
 
Most Beautiful Women Of The World
Most Beautiful Women Of The WorldMost Beautiful Women Of The World
Most Beautiful Women Of The World
 
Everything old is new again
Everything old is new againEverything old is new again
Everything old is new again
 
Letting Go
Letting GoLetting Go
Letting Go
 
Responsive Design
Responsive DesignResponsive Design
Responsive Design
 
Designing for conversation
Designing for conversationDesigning for conversation
Designing for conversation
 
iMentor Steve Jobs
iMentor Steve JobsiMentor Steve Jobs
iMentor Steve Jobs
 
Travel Tips Learned from Japan! - #japan #traveltips
Travel Tips Learned from Japan! - #japan #traveltipsTravel Tips Learned from Japan! - #japan #traveltips
Travel Tips Learned from Japan! - #japan #traveltips
 
The Emerging Global Web
The Emerging Global WebThe Emerging Global Web
The Emerging Global Web
 

Similar to Adaptation: Why responsive design actually begins on the server

Its about people, not devices
Its about people, not devicesIts about people, not devices
Its about people, not devices
Alexander Anikin
 
The trouble with context
The trouble with contextThe trouble with context
The trouble with context
Alexander Anikin
 
Rethinking the mobile web
Rethinking the mobile webRethinking the mobile web
Rethinking the mobile web
Alexander Anikin
 
Beyond the mobile web
Beyond the mobile webBeyond the mobile web
Beyond the mobile web
Alexander Anikin
 
Beyond The Mobile Web By Yiibu 110412113255 Phpapp01
Beyond The Mobile Web By Yiibu 110412113255 Phpapp01Beyond The Mobile Web By Yiibu 110412113255 Phpapp01
Beyond The Mobile Web By Yiibu 110412113255 Phpapp01
Therese Kokot
 
Beyond The Mobile Web By Yiibu
Beyond The Mobile Web By YiibuBeyond The Mobile Web By Yiibu
Beyond The Mobile Web By Yiibu
Jim Porter
 
Yiibu goingmobile2010-100818120505-phpapp01
Yiibu goingmobile2010-100818120505-phpapp01Yiibu goingmobile2010-100818120505-phpapp01
Yiibu goingmobile2010-100818120505-phpapp01
Gustavo Luveira
 
Mobile mapping w3g
Mobile mapping w3gMobile mapping w3g
Mobile mapping w3g
earthwarebrian
 
Mobxbeyondthehamburgermenu13sep2014 140916040153-phpapp01
Mobxbeyondthehamburgermenu13sep2014 140916040153-phpapp01Mobxbeyondthehamburgermenu13sep2014 140916040153-phpapp01
Mobxbeyondthehamburgermenu13sep2014 140916040153-phpapp01
Victor Minuesa
 
Beyond The Hamburger Menu - MOBX, 13 Sep 2014
Beyond The Hamburger Menu - MOBX, 13 Sep 2014Beyond The Hamburger Menu - MOBX, 13 Sep 2014
Beyond The Hamburger Menu - MOBX, 13 Sep 2014
Anna Dahlström
 
Adapting to Input — Smashing Conference NYC
Adapting to Input — Smashing Conference NYCAdapting to Input — Smashing Conference NYC
Adapting to Input — Smashing Conference NYC
Jason Grigsby
 
Beyond Progressive Enhancement by yiibu
Beyond Progressive Enhancement by yiibuBeyond Progressive Enhancement by yiibu
Beyond Progressive Enhancement by yiibu
AdRoll
 
A Mobile Introductory
A Mobile IntroductoryA Mobile Introductory
A Mobile Introductory
University of Central Lancashire
 
The effects of digital devices
The effects of digital devicesThe effects of digital devices
The effects of digital devices
Greg Dillon
 
Mobile Web Vs Mobile Apps
Mobile Web Vs Mobile AppsMobile Web Vs Mobile Apps
Mobile Web Vs Mobile Apps
Joe Hass
 
Native vs. Mobile Web vs. Hybrid Apps for Mobile Development
Native vs. Mobile Web vs. Hybrid Apps for Mobile DevelopmentNative vs. Mobile Web vs. Hybrid Apps for Mobile Development
Native vs. Mobile Web vs. Hybrid Apps for Mobile Development
Jason Grigsby
 
Mobile UX 101 @ Flash Camp Manchester
Mobile UX 101 @ Flash Camp ManchesterMobile UX 101 @ Flash Camp Manchester
Mobile UX 101 @ Flash Camp Manchester
Antony Ribot
 
Yiibu rethinkingthemobileweb-100910074556-phpapp01
Yiibu rethinkingthemobileweb-100910074556-phpapp01Yiibu rethinkingthemobileweb-100910074556-phpapp01
Yiibu rethinkingthemobileweb-100910074556-phpapp01
Raymond Morin
 
Casting Off Our Desktop Shackles
Casting Off Our Desktop ShacklesCasting Off Our Desktop Shackles
Casting Off Our Desktop Shackles
Jason Grigsby
 
Mobile experiences
Mobile experiencesMobile experiences
Mobile experiences
Jonas Päckos
 

Similar to Adaptation: Why responsive design actually begins on the server (20)

Its about people, not devices
Its about people, not devicesIts about people, not devices
Its about people, not devices
 
The trouble with context
The trouble with contextThe trouble with context
The trouble with context
 
Rethinking the mobile web
Rethinking the mobile webRethinking the mobile web
Rethinking the mobile web
 
Beyond the mobile web
Beyond the mobile webBeyond the mobile web
Beyond the mobile web
 
Beyond The Mobile Web By Yiibu 110412113255 Phpapp01
Beyond The Mobile Web By Yiibu 110412113255 Phpapp01Beyond The Mobile Web By Yiibu 110412113255 Phpapp01
Beyond The Mobile Web By Yiibu 110412113255 Phpapp01
 
Beyond The Mobile Web By Yiibu
Beyond The Mobile Web By YiibuBeyond The Mobile Web By Yiibu
Beyond The Mobile Web By Yiibu
 
Yiibu goingmobile2010-100818120505-phpapp01
Yiibu goingmobile2010-100818120505-phpapp01Yiibu goingmobile2010-100818120505-phpapp01
Yiibu goingmobile2010-100818120505-phpapp01
 
Mobile mapping w3g
Mobile mapping w3gMobile mapping w3g
Mobile mapping w3g
 
Mobxbeyondthehamburgermenu13sep2014 140916040153-phpapp01
Mobxbeyondthehamburgermenu13sep2014 140916040153-phpapp01Mobxbeyondthehamburgermenu13sep2014 140916040153-phpapp01
Mobxbeyondthehamburgermenu13sep2014 140916040153-phpapp01
 
Beyond The Hamburger Menu - MOBX, 13 Sep 2014
Beyond The Hamburger Menu - MOBX, 13 Sep 2014Beyond The Hamburger Menu - MOBX, 13 Sep 2014
Beyond The Hamburger Menu - MOBX, 13 Sep 2014
 
Adapting to Input — Smashing Conference NYC
Adapting to Input — Smashing Conference NYCAdapting to Input — Smashing Conference NYC
Adapting to Input — Smashing Conference NYC
 
Beyond Progressive Enhancement by yiibu
Beyond Progressive Enhancement by yiibuBeyond Progressive Enhancement by yiibu
Beyond Progressive Enhancement by yiibu
 
A Mobile Introductory
A Mobile IntroductoryA Mobile Introductory
A Mobile Introductory
 
The effects of digital devices
The effects of digital devicesThe effects of digital devices
The effects of digital devices
 
Mobile Web Vs Mobile Apps
Mobile Web Vs Mobile AppsMobile Web Vs Mobile Apps
Mobile Web Vs Mobile Apps
 
Native vs. Mobile Web vs. Hybrid Apps for Mobile Development
Native vs. Mobile Web vs. Hybrid Apps for Mobile DevelopmentNative vs. Mobile Web vs. Hybrid Apps for Mobile Development
Native vs. Mobile Web vs. Hybrid Apps for Mobile Development
 
Mobile UX 101 @ Flash Camp Manchester
Mobile UX 101 @ Flash Camp ManchesterMobile UX 101 @ Flash Camp Manchester
Mobile UX 101 @ Flash Camp Manchester
 
Yiibu rethinkingthemobileweb-100910074556-phpapp01
Yiibu rethinkingthemobileweb-100910074556-phpapp01Yiibu rethinkingthemobileweb-100910074556-phpapp01
Yiibu rethinkingthemobileweb-100910074556-phpapp01
 
Casting Off Our Desktop Shackles
Casting Off Our Desktop ShacklesCasting Off Our Desktop Shackles
Casting Off Our Desktop Shackles
 
Mobile experiences
Mobile experiencesMobile experiences
Mobile experiences
 

Recently uploaded

20240702 QFM021 Machine Intelligence Reading List June 2024
20240702 QFM021 Machine Intelligence Reading List June 202420240702 QFM021 Machine Intelligence Reading List June 2024
20240702 QFM021 Machine Intelligence Reading List June 2024
Matthew Sinclair
 
20240702 Présentation Plateforme GenAI.pdf
20240702 Présentation Plateforme GenAI.pdf20240702 Présentation Plateforme GenAI.pdf
20240702 Présentation Plateforme GenAI.pdf
Sally Laouacheria
 
The Increasing Use of the National Research Platform by the CSU Campuses
The Increasing Use of the National Research Platform by the CSU CampusesThe Increasing Use of the National Research Platform by the CSU Campuses
The Increasing Use of the National Research Platform by the CSU Campuses
Larry Smarr
 
Manual | Product | Research Presentation
Manual | Product | Research PresentationManual | Product | Research Presentation
Manual | Product | Research Presentation
welrejdoall
 
Research Directions for Cross Reality Interfaces
Research Directions for Cross Reality InterfacesResearch Directions for Cross Reality Interfaces
Research Directions for Cross Reality Interfaces
Mark Billinghurst
 
Comparison Table of DiskWarrior Alternatives.pdf
Comparison Table of DiskWarrior Alternatives.pdfComparison Table of DiskWarrior Alternatives.pdf
Comparison Table of DiskWarrior Alternatives.pdf
Andrey Yasko
 
Pigging Solutions Sustainability brochure.pdf
Pigging Solutions Sustainability brochure.pdfPigging Solutions Sustainability brochure.pdf
Pigging Solutions Sustainability brochure.pdf
Pigging Solutions
 
Measuring the Impact of Network Latency at Twitter
Measuring the Impact of Network Latency at TwitterMeasuring the Impact of Network Latency at Twitter
Measuring the Impact of Network Latency at Twitter
ScyllaDB
 
Best Practices for Effectively Running dbt in Airflow.pdf
Best Practices for Effectively Running dbt in Airflow.pdfBest Practices for Effectively Running dbt in Airflow.pdf
Best Practices for Effectively Running dbt in Airflow.pdf
Tatiana Al-Chueyr
 
WhatsApp Image 2024-03-27 at 08.19.52_bfd93109.pdf
WhatsApp Image 2024-03-27 at 08.19.52_bfd93109.pdfWhatsApp Image 2024-03-27 at 08.19.52_bfd93109.pdf
WhatsApp Image 2024-03-27 at 08.19.52_bfd93109.pdf
ArgaBisma
 
What’s New in Teams Calling, Meetings and Devices May 2024
What’s New in Teams Calling, Meetings and Devices May 2024What’s New in Teams Calling, Meetings and Devices May 2024
What’s New in Teams Calling, Meetings and Devices May 2024
Stephanie Beckett
 
Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...
Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...
Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...
Erasmo Purificato
 
Transcript: Details of description part II: Describing images in practice - T...
Transcript: Details of description part II: Describing images in practice - T...Transcript: Details of description part II: Describing images in practice - T...
Transcript: Details of description part II: Describing images in practice - T...
BookNet Canada
 
WPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide DeckWPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide Deck
Lidia A.
 
Coordinate Systems in FME 101 - Webinar Slides
Coordinate Systems in FME 101 - Webinar SlidesCoordinate Systems in FME 101 - Webinar Slides
Coordinate Systems in FME 101 - Webinar Slides
Safe Software
 
RPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptx
RPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptxRPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptx
RPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptx
SynapseIndia
 
Mitigating the Impact of State Management in Cloud Stream Processing Systems
Mitigating the Impact of State Management in Cloud Stream Processing SystemsMitigating the Impact of State Management in Cloud Stream Processing Systems
Mitigating the Impact of State Management in Cloud Stream Processing Systems
ScyllaDB
 
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-InTrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
TrustArc
 
DealBook of Ukraine: 2024 edition
DealBook of Ukraine: 2024 editionDealBook of Ukraine: 2024 edition
DealBook of Ukraine: 2024 edition
Yevgen Sysoyev
 
Quality Patents: Patents That Stand the Test of Time
Quality Patents: Patents That Stand the Test of TimeQuality Patents: Patents That Stand the Test of Time
Quality Patents: Patents That Stand the Test of Time
Aurora Consulting
 

Recently uploaded (20)

20240702 QFM021 Machine Intelligence Reading List June 2024
20240702 QFM021 Machine Intelligence Reading List June 202420240702 QFM021 Machine Intelligence Reading List June 2024
20240702 QFM021 Machine Intelligence Reading List June 2024
 
20240702 Présentation Plateforme GenAI.pdf
20240702 Présentation Plateforme GenAI.pdf20240702 Présentation Plateforme GenAI.pdf
20240702 Présentation Plateforme GenAI.pdf
 
The Increasing Use of the National Research Platform by the CSU Campuses
The Increasing Use of the National Research Platform by the CSU CampusesThe Increasing Use of the National Research Platform by the CSU Campuses
The Increasing Use of the National Research Platform by the CSU Campuses
 
Manual | Product | Research Presentation
Manual | Product | Research PresentationManual | Product | Research Presentation
Manual | Product | Research Presentation
 
Research Directions for Cross Reality Interfaces
Research Directions for Cross Reality InterfacesResearch Directions for Cross Reality Interfaces
Research Directions for Cross Reality Interfaces
 
Comparison Table of DiskWarrior Alternatives.pdf
Comparison Table of DiskWarrior Alternatives.pdfComparison Table of DiskWarrior Alternatives.pdf
Comparison Table of DiskWarrior Alternatives.pdf
 
Pigging Solutions Sustainability brochure.pdf
Pigging Solutions Sustainability brochure.pdfPigging Solutions Sustainability brochure.pdf
Pigging Solutions Sustainability brochure.pdf
 
Measuring the Impact of Network Latency at Twitter
Measuring the Impact of Network Latency at TwitterMeasuring the Impact of Network Latency at Twitter
Measuring the Impact of Network Latency at Twitter
 
Best Practices for Effectively Running dbt in Airflow.pdf
Best Practices for Effectively Running dbt in Airflow.pdfBest Practices for Effectively Running dbt in Airflow.pdf
Best Practices for Effectively Running dbt in Airflow.pdf
 
WhatsApp Image 2024-03-27 at 08.19.52_bfd93109.pdf
WhatsApp Image 2024-03-27 at 08.19.52_bfd93109.pdfWhatsApp Image 2024-03-27 at 08.19.52_bfd93109.pdf
WhatsApp Image 2024-03-27 at 08.19.52_bfd93109.pdf
 
What’s New in Teams Calling, Meetings and Devices May 2024
What’s New in Teams Calling, Meetings and Devices May 2024What’s New in Teams Calling, Meetings and Devices May 2024
What’s New in Teams Calling, Meetings and Devices May 2024
 
Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...
Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...
Paradigm Shifts in User Modeling: A Journey from Historical Foundations to Em...
 
Transcript: Details of description part II: Describing images in practice - T...
Transcript: Details of description part II: Describing images in practice - T...Transcript: Details of description part II: Describing images in practice - T...
Transcript: Details of description part II: Describing images in practice - T...
 
WPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide DeckWPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide Deck
 
Coordinate Systems in FME 101 - Webinar Slides
Coordinate Systems in FME 101 - Webinar SlidesCoordinate Systems in FME 101 - Webinar Slides
Coordinate Systems in FME 101 - Webinar Slides
 
RPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptx
RPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptxRPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptx
RPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptx
 
Mitigating the Impact of State Management in Cloud Stream Processing Systems
Mitigating the Impact of State Management in Cloud Stream Processing SystemsMitigating the Impact of State Management in Cloud Stream Processing Systems
Mitigating the Impact of State Management in Cloud Stream Processing Systems
 
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-InTrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
 
DealBook of Ukraine: 2024 edition
DealBook of Ukraine: 2024 editionDealBook of Ukraine: 2024 edition
DealBook of Ukraine: 2024 edition
 
Quality Patents: Patents That Stand the Test of Time
Quality Patents: Patents That Stand the Test of TimeQuality Patents: Patents That Stand the Test of Time
Quality Patents: Patents That Stand the Test of Time
 

Adaptation: Why responsive design actually begins on the server

  • 1. Adaptation why responsive design actually begins on the server... http://creativecommons.org/licenses/by/2.0 http://www.flickr.com/photos/newsbiepix/4113886275
  • 2. the tech media loves a good story... TechCrunch http://www.flickr.com/photos/scobleizer/4694051328
  • 3. 200 million iOS devices and life on the bleeding edge... http://www.flickr.com/photos/scobleizer/3553486766
  • 4. 1/3 * of the US has a smartphone ge statistics rane'll *current –w fro m 25% to 50%licity... p u se 1/3 for sim *please note http://www.flickr.com/photos/scobleizer/4694051328
  • 5. 1/3 of the US has a ...um, so 2/3 of the US does not have a smartphone?! smartphone http://www.flickr.com/photos/scobleizer/4694051328
  • 6. or if you're a fanboy feel free to use this math*... 1/2 of the US has a and 1/2 does not... smartphone n't t percentage ishe *the exac rtant for t terribly impo presentation... is purposes of th http://www.flickr.com/photos/abasketofpups/2662225972
  • 7. will save us all! http://www.flickr.com/photos/scobleizer/4694051328
  • 8. but it's really only kinda useable on few high-end devices... will save us all! http://www.flickr.com/photos/scobleizer/4694051328
  • 9. the "tech industry" ...and are we making promises we can't keep? htc Magic Android 1.6 must the " bleeding edge" e of ha ve Android devic stop... r 200 9 is now a doo http://www.flickr.com/photos/whatleydude/3547624583
  • 13. iPhone 3GS iPhone 3G 2007 2008 2009
  • 14. iPhone 4 iPhone 3G 3GS 2007 2008 2009 2010
  • 15. 3G 3GS 4 2008 2009 2010 2011 iPhone 5...
  • 16. side effect n. a peripheral or secondary effect, especially an undesirable one... http://www.thefreedictionary.com/side+effect
  • 17. the smartphone era begins... original the iPhone 2007
  • 18. brings touch, gestures and the real web... web touch iPhone 3G iPhone 2007 2008
  • 19. native apps and the rise of Android... android apps iPhone 3GS iPhone 3G 2007 2008 2009
  • 20. whither feature phones, and the further rise of Android... htc g-five samsung web os iPhone 4 iPhone 3G 3GS 2007 2008 2009 2010
  • 21. blackberry kindle devices go mainstream nook with great expectations... htc LG samsung motorola iPhone 5... 3G 3GS 4 2008 2009 2010 2011
  • 22. we're now in that big grey area...
  • 23. or from a different perspective...
  • 25. the bleeding edge... + 'ish via China opportunity
  • 26. but we still can't see the forest for the trees... http://www.flickr.com/photos/clairity/1449248189
  • 27. 2/3 * of the US does not have a smartphone... e *or 1/2 if you'r a fanboy... http://www.flickr.com/photos/centralasian/3239065547
  • 28. last year we asked a simple question... http://www.flickr.com/photos/fpat/3692425154
  • 29. welcome to the mobile web I asked this a year ago, i'm not sure anything's changed!! if you want to use the web on a mobile device, is the purchase of an iPhone the cost of entry? http://www.flickr.com/photos/sketch22/1127556671
  • 30. to infinity and beyond... well over by 2015 50% of web traffic is expected to come from mobile devices http://www.netmagazine.com/news/uk-sees-huge-mobile-web-traffic-growth-111340
  • 31. let me rephrase the question...
  • 32. still the only device where the Web actually works this is rhetorical, and absurd... in 2015, if you want to use the web on a mobile device, will the purchase of an iPhone be mandatory...? http://www.flickr.com/photos/dantaylor/2161663267
  • 33. gotta get 'em all... or even want many of us cannot afford to purchase every shiny new device released... http://www.flickr.com/photos/bytemarks/4732726333
  • 34. especially in the light of recent events... http://www.flickr.com/photos/wagnertc/3217859975
  • 36. most folks have much more pressing concerns... http://www.flickr.com/photos/bobolink/4706580
  • 37. and far higher priorities... http://www.flickr.com/photos/ilamont/4329364198
  • 38. which often result in very different purchasing decisions... http://www.flickr.com/photos/timstock/535259176
  • 40. as lots of Android devices are now available for less than $200*.... or very close to it... ...*free is also becoming a popular option! http://www.flickr.com/photos/cambodia4kidsorg/5253151186
  • 41. and some feature phones aimed at the next billion now include WebKit ooh, touch... and a touch screen... ype Nokia C3 Touch & T S eries 40 device http://www.flickr.com/photos/yoggy0/5380738918
  • 42. every phone is now (essentially) a smartphone*... or soon will be ns of ctual definitioy - but to *a ill var 'smartphone' wey are all magic... normal folks th http://www.flickr.com/photos/tanj/4432327487
  • 43. camera, video, 3G connectivity music player, etc. large, colour touch sensitive screen a modern web browser (not WAP) (often) a real, update-able operating system loaded with everything we've come to expect from a smartphone... QWERTY keyboard and/or trackball http://www.flickr.com/photos/free_programmer/4371778263
  • 44. less vibrant screens less responsive touch screens limited or no data plan bundled lower spec RAM and/or CPU/GPU few or no OEM OS updates but not every smartphone is created equal... http://www.flickr.com/photos/nechbi/3841765925
  • 45. UNDESIRABLE this inequality creates diversity and (often) "undesirables"... http://www.flickr.com/photos/handwrite/3460075040
  • 46. "Android WebKit is the closest thing to being the IE6 of mobile development for me." - @dalmaer via http://functionsource.com/post/a-day-in-the-life-of-android-webkit-dealings http://www.flickr.com/photos/blank22763/4089926742
  • 48. an optimal experience for for a privileged few... http://www.flickr.com/photos/carbonnyc/5140154965
  • 49. and a missed opportunity for many more... linkedin HTML5 webapp disappointment must leeding edge" f 2009 the "b o have A ndroid device r stop... doo is once again a http://www.flickr.com/photos/dumbledad/3400708183
  • 50. 2 year old, state-of-the-art your smartphone is obsolete, please upgrade now... http://www.flickr.com/photos/herval/2050815997
  • 51. um...
  • 52. for most folks these are not "higher priorities"... http://www.flickr.com/photos/aaronpk/5328338679
  • 53. welcome to the real world... http://www.flickr.com/photos/slemmon/3971197662
  • 54. where we learn to adapt as required... http://www.flickr.com/photos/kalleboo/3536493996
  • 55. craftivism where simply learning to knit can change your life... http://www.flickr.com/photos/bosstweed/152159981
  • 56. from your local library where borrowing books for free is beating paying for ebooks... Times Are Tough, Libraries Are Thriving http://www.nytimes.com/2009/03/15/nyregion/long-island/15libraryli.html http://www.flickr.com/photos/ccacnorthlib/3553821229/
  • 57. where Hulu, iTunes and sports bars are replacing cable services... expensive http://www.businessinsider.com/2008/3/hulu-household-why-i-got-rid-of-cable
  • 58. and which led @grigs to pick up those clippers... http://www.flickr.com/photos/kdnewton/2691125617
  • 60. the iPhone inspired everyone to expect more from their devices... http://www.flickr.com/photos/tom_ruaat/5540148158
  • 61. "...yeah, but people don't actually use those undesirable devices?" http://www.flickr.com/photos/misterian/4084280385
  • 62. yup
  • 63. ...have you actually offered them anything yet? re logs, chances aail... check your in the long t you'll find them http://www.flickr.com/photos/zoetnet/4669800101/
  • 64. small a few companies most certainly have... twitter indonesia 0.facebook OperaMini http://www.flickr.com/photos/nseika/5848996146
  • 65. us humans are amazing when it comes to adapting to new circumstances... ...do we still really need the dogs? http://www.flickr.com/photos/thenationalguard/3251277781
  • 66. the web was actually built on similar principles... http://www.flickr.com/photos/tanaka/3212373419
  • 67. "The primary design principle underlying the Web's usefulness and growth is universality. The Web should be usable by people with disabilities. It must work with any form of information, be it a document or a point of data, and information of any quality–from a silly tweet to a scholarly paper. And it should be accessible from any kind of hardware than can connect to the internet: stationary or mobile, small screen or large." ... as seen b efore @bdconf Tim Berners-Lee Long Live the Web http://www.scientificamerican.com/article.cfm?id=long-live-the-web http://www.flickr.com/photos/lonelyfox/2939757714
  • 68. unfortunately, our current mental models started back here... http://www.flickr.com/photos/blakespot/2343395804
  • 69. The Era of mobile dominance is beginning which did not prepare us for a world paul rouget taiwan africa dominated by devices like these... http://www.flickr.com/photos/whiteafrican/2594981758
  • 70. “The best, most solid way out of a crisis in a changing market is through experiment and adaptation.” Richard Branson Business Stripped Bare – Adventures of a Global Entrepreneur http://www.flickr.com/photos/jedibfa/5146867827
  • 71. <diversion> http://www.flickr.com/photos/y_i/2330044065
  • 72. short a tale of clients and servers... http://www.flickr.com/photos/richardberg/2135409739
  • 73. pastrami on rye... a client makes a request to a server... http://www.flickr.com/photos/_ppo/2393063853
  • 74. other unique clients make similar requests... yet not identical Rueben... turkey chilli dog... grilled cheese brisket... corned beef... http://www.flickr.com/photos/_ppo/2393063853
  • 75. Rueben... chilli dog... a method to track each client request is required... http://www.flickr.com/photos/mrgarin/3476714113
  • 76. as each client request is received... tra pickle... no pickle... Rueben... pastrami on rye... turkey chilli dog... Rueben... Rueben... grilled cheese brisket... corned beef... http://www.flickr.com/photos/_ppo/2393063853
  • 77. the server tailors each request to each client... 320, hold the pickle... one more 320... 150, pastrami... 210 to go... tracking (ticketing, bills, etc) analytics (what works, what doesn't) preparation (vs just-in-time) tacit knowledge http://www.flickr.com/photos/_ppo/2393063853
  • 78. ensuring they get exactly what they need... http://www.flickr.com/photos/the_junes/2134127618
  • 79. rather than everything they might not want... http://www.flickr.com/photos/86624586@N00/10176570
  • 80. <diversion/> http://www.flickr.com/photos/alper/3257406961
  • 81. ...but what does this have to do with mobile? http://www.flickr.com/photos/mikeycordedda/5328343979
  • 82. accomplish great things together working client and server can... http://www.flickr.com/photos/maladjusted/2341398753
  • 84. http://domain.org client yet unknown a client makes a request to a server...
  • 86. clouds are hip these days... server http://domain.org
  • 87. ...profile please? server http://domain.org server then asks the client for it's profile cookie...
  • 88. yeah, you're going to need a profile... server http://domain.org if a client doesn't have a profile cookie the server creates one for it...
  • 89. {    width:{        screen:240,        document:240    } } let's start with the 'default' profile... default profile *defining a 'default' baseline profile depends on your project requirements... server http://domain.org or default* notice that this makes the begin with a baseline profile assumption that basic = default that covers the very basic experience... (in other words "mobile first")
  • 90. eww.... then...grab the client user agent string (trust me, it's more useful than you think) server http://domain.org ...oh yes, user-agent please? Mozilla/5.0  (Linux;  U;  Android  2.1-­‐update1;  en-­‐gb;  Nexus  One  Build/ERE27)   AppleWebKit/530.17  (KHTML,  like  Gecko)  Version/4.0  Mobile  Safari/530.17
  • 91. Mozilla/5.0  (Linux;  U;  Android  2.1-­‐update1;  en-­‐gb;  Nexus  One  Build/ERE27)   AppleWebKit/530.17  (KHTML,  like  Gecko)  Version/4.0  Mobile  Safari/530.17 hey DeviceAtlas, wanna check this UA for me? server http://domain.org query the user agent string against a device database such as DeviceAtlas... ...or WURFL
  • 92. Mozilla/5.0  (Linux;  U;  Android  2.1-­‐update1;  en-­‐gb;  Nexus  One  Build/ERE27)   AppleWebKit/530.17  (KHTML,  like  Gecko)  Version/4.0  Mobile  Safari/530.17 {  width:480, ...found it, here it comes!  height:480,  color-­‐depth:8,  touch:true,  cookie:true,  ... } http://deviceatlas.com DeviceAtlas profile
  • 93. {    width:{        screen:240,        document:240    } } default profile ...hmm, I think I've seen this before? server {  width:480, http://domain.org  height:480,  color-­‐depth:8,  touch:true,  cookie:true,  ... } DeviceAtlas profile now query the user agent string against any tacit knowledge you have collected... may
  • 94.         "profile":{"width":"240"}      },      "desktop":  {         "match":"#windows|macintosh|linux#i",         "profile":{"width":"800"} tacit data      },      "iphone":  {         "match":"#iphone#i",         "profile":{"ios":"1",  "width":"320",  "svg":true,  "canvas":true}      },      "ipad":  {         "match":"#ipad#i",         "profile":{"ios":"1",  "width":"768",  "svg":true,  "canvas":true}      },    "android":  {         "match":"#android#i",         "profile":{"droid":"1",  "width":"320",  "flash":true,  "canvas":true,  "video":true}      },      "symbian^3":  { Tacit (or known) profile         "match":"#symbian/3#i",         "profile":{"sym3":"1",  "width":"360"}      },      "symbian9.4":  {         "match":"#symbianos/9.4#i",         "profile":{"sym94":"1",  "width":"360"}      },      "symbian9.3":  {         "match":"#symbianos/9.3#i",         "profile":{"sym93":"1",  "width":"360"} partial profiles are matched via      },      "n73":  { UA string fragments...         "match":"#N73#i",         "profile":{"sym91":"1",  "width":"240"}      },      "series602.x":  {         "match":"#series60/2.8|{series60/2.9}#i",
  • 95. {    width:{ tacit data        screen:240,        document:240    } } default profile {  width:320,  droid:1, yeah, I've seen this before...  canvas:true,  flash:true,  video:true, server  ... http://domain.org } Tacit (or known) profile {  width:480,  height:480, this tacit knowledge is gathered  color-­‐depth:8,  touch:true, over time from other device profiles...  cookie:true,  ... ...or through knowledge } gained during testing DeviceAtlas profile
  • 96. {    width:{        screen:320,        document:320    },    xhr:true,    canvas:true,    flash:false,    video:true,    formats:{ server    h264:probably, http://domain.org    ogg:false,    webm:false    },    offline:true } Client profile merge the baseline data, with the data returned from queries into the client profile...
  • 97. cookie {    width:{ document        screen:320,        document:320    },    xhr:true, response    canvas:true,    flash:false,    video:true,    formats:{ server    h264:probably, http://domain.org    ogg:false,    webm:false    },    offline:true } Client profile write the profile cookie to the doc header which will be returned to the client...
  • 98. {    width:{        screen:320,        document:320    },    xhr:true, response    canvas:true, profile    flash:false,    video:true,    formats:{ server    h264:probably, http://domain.org    ogg:false,    webm:false    },    offline:true } for this client Client profile server now has a usable profile and can continue...
  • 99. media queries are not a means using Javascript to modify of adapting content contained significant portions of the within the DOM on the client... DOM will impact performance on mobile devices... response filter server http://domain.org and adapt the server now begins to filter the content based on the properties in the client profile...
  • 100. Adaptation Rules ensure all images are appropriately sized for client display replace any images that contain fine details or text replace Flash media with an appropriate alternative response where not supported remove unnecessary markup, scripts, etc. server http://domain.org or app adaptation 'rules' will vary from site to site, but adapting <img>'s is most common...
  • 101. Adaptation Rules ensure all images are appropriately sized for client display replace any images that contain fine details or text replace Flash media with an appropriate alternative response where not supported remove unnecessary markup, scripts, etc. server http://domain.org adapt large tables as required, link to data serve appropriate video format, codec and size adapt DOM components including scripts and styles <video>, <table> and other DOM structures also require adaptation may
  • 102. Adaptation Rules Resource Bundles ensure all images are alternate content appropriately sized for appropriate for context client display alternate DOM templates, replace any images that components & fragments contain fine details or text alternate sized, formatted + replace Flash media with encoded video as required an appropriate alternative response where not supported alternate images for required breakpoints remove unnecessary markup, scripts, etc. server alternate scripts + styles http://domain.org for required client profiles adapt large tables as required, link to data serve appropriate video format, codec and size adapt DOM components including scripts and styles you will often require new resources
  • 103.   "pinch-­‐zoom":{     "0-­‐320":"resources/images/meego/pinch-­‐zoom@240.png",     "320-­‐720":"resources/images/meego/pinch-­‐zoom@320.png", Resource Bundles     "720-­‐9999":"resources/images/meego/pinch-­‐zoom.png"   }, alternate content   "typing":{     "0-­‐320":"resources/images/meego/typing@240.png", appropriate for context     "320-­‐720":"resources/images/meego/typing@320.png",     "720-­‐9999":"resources/images/meego/typing.png" alternate DOM templates,   }, components & fragments   "stay-­‐safe":{     "0-­‐320":"resources/images/meego/stay-­‐safe@240.png", alternate sized, formatted +     "320-­‐720":"resources/images/meego/stay-­‐safe@320.png", encoded video as required     "720-­‐9999":"resources/images/meego/stay-­‐safe.png"   }, alternate images for   "swipe-­‐more":{ required breakpoints     "0-­‐320":"resources/images/meego/swipe@240.jpg",     "320-­‐640":"resources/images/meego/swipe@320.jpg",     "640-­‐9999":"resources/images/meego/swipe.jpg" alternate scripts + styles   }, for required client profiles   "pinch-­‐zoom-­‐more":{     "0-­‐320":"resources/images/meego/pinch-­‐zoom@240.png",     "320-­‐720":"resources/images/meego/pinch-­‐zoom@320.png",     "720-­‐9999":"resources/images/meego/pinch-­‐zoom.png"   },   "typing-­‐more":{     "0-­‐320":"resources/images/meego/typing@240.png",       "320-­‐720":"resources/images/meego/typing@320.png",   "720-­‐9999":"resources/images/meego/typing.png" which can be defined in     }, "stay-­‐safe-­‐more":{ any number of ways...     "0-­‐320":"resources/images/meego/stay-­‐safe@240.png",     "320-­‐720":"resources/images/meego/stay-­‐safe@320.png",     "720-­‐9999":"resources/images/meego/stay-­‐safe.png"   },   "location":{
  • 104. video data images response server http://domain.org these resources can be static, cached or even dynamically generated... which would make them even more responsive
  • 105. response server http://domain.org all content adaptation is performed on the server... before the page is downloaded
  • 106. response server http://domain.org on the client alternate resources that may later be required are then bundled as references...
  • 107. {} response server http://domain.org feature detection an additional profile <script> is also included in the response to the client...
  • 108. {}
  • 111. client
  • 112. {    width:{        screen:480,        document:480    },    xhr:true,    canvas:true,    flash:true,    video:true,    formats:{    h264:probably,    ogg:true,    webm:false    },    offline:true } Client profile feature detection the client executes its profile <script> and updates its profile cookie accordingly...
  • 114. or screen resize on an orientation change the script fires again...
  • 115. images {    width:{ updated        screen:800,        document:800    },    xhr:true,    canvas:true,    flash:true,    video:true,    formats:{    h264:probably,    ogg:true,    webm:false    },    offline:true } Client profile and if needed, additional resources are downloaded... based on the pre- bundled references
  • 116. http://domain.org/fava-beans/chianti known a client makes a new request to a server...
  • 117. ...profile please? server http://domain.org server then asks the client for it's profile cookie...
  • 118. {    width:{ ...ah, wonderful you've filled in the rest!        screen:800,        document:800    },    xhr:true,    canvas:true,    flash:true,    video:true,    formats:{ server    h264:probably, http://domain.org    ogg:true,    webm:false    },    offline:true } Client profile which now accurately represents the requesting client...
  • 119. tacit data server http://domain.org server captures the client-tested profile properties for later dB integration...
  • 120. let me get that for you... response server http://domain.org and adapt server then begins to filter content based on the client profile...
  • 121. response server http://domain.org on the client any resources required are then bundled as references...
  • 122. {}
  • 125. client ...ta da!
  • 126. and repeat as required...
  • 129. all in preparation for the coming zombie apocalypse... @scottjenson zombie frog http://www.flickr.com/photos/digitalsextant/3624030270
  • 130. benefits of this approach... http://www.flickr.com/photos/sarahreido/3120877348
  • 131. known focus on the features, not the device... OperaMini ceçi n'est plus un iphone http://www.flickr.com/photos/jane_garratt/5377694159
  • 132. browser accepts that features are rarely binary... just because it's 'supported', doesn't mean it works as intended (or works at all)... http://html5test.com/
  • 133. tweaks for "important" devices (e.g. client-specific requests, business goal-specific, partners, high-traffic edge cases etc.) tacit data enables you to create custom properties needed for your specific project fine tune the profiles... override false positives http://www.flickr.com/photos/mujitra/2559447601
  • 134. handling which makes edge cases much easier... http://twitter.com/#!/stephanierieger/status/113604185857069056
  • 135. all heavy lifting occurs on the server... http://www.flickr.com/photos/mackarus/4289960218
  • 136. folks and their supports a broader range of devices where client-side-only approaches can be unreliable... http://www.flickr.com/photos/mackarus/3022623866
  • 137. embrace the future of "unknown unknowns"... http://www.flickr.com/photos/jgoforth/87176920
  • 138. a few thoughts for tomorrow... http://www.flickr.com/photos/slemmon/3971195778
  • 139. the <img> tag... was an after thought http://diveintomark.org/archives/2009/11/02/why-do-we-have-an-img-element
  • 140. ...perhaps it's finally time to rethink it? <image  alt="butterfly"> <source  src="butterfly-­‐small.png"  width="100"  height="80"  /> <source  src="butterfly.png"  width="200"  height="160"  /> <source  src="butterfly-­‐large.svg"  width="400"  height="400"  media="min-­‐device-­‐width:320px"  /> </image> this of course does not exist, and is simply wishful thinking...
  • 141. <html> ...media queries for the DOM? ... ie: conditional content @media  all  (max-­‐device-­‐width:320px)  {    <img  src="butterfly-­‐small.png"  width="100"  height="80"  /> } @media  all  (min-­‐device-­‐width:320px)  {    <img  src="butterfly.png"  width="200"  height="160"  /> } @media  all  (min-­‐device-­‐width:320px)  and  (svg:true)  {    <img  src="butterfly.svg"  width="400"  height="400"  /> } this of course does not exist, and is ... only the simplest form of an idea... </html>
  • 142. rethinking (and extending) content negotiation... http://en.wikipedia.org/wiki/Content_negotiation
  • 143. and maybe even go back and revisit UA strings... Andrea Trasatti sorting user agent strings out ee for so me thoughts...srting Andrea Trasatti's "So ut" O User Agent Strings http://en.wikipedia.org/wiki/User_agent
  • 144. "The wise adapt themselves to circumstances, as the water moulds itself to the pitcher." Chinese Proverb http://www.flickr.com/photos/theowl84/3045227001
  • 145. @yiibu please say hi hello@yiibu.com thank you the font we use is Museo http://www.exljbris.com/museo.html many thanks to the amazing photographers on http://www.flickr.com/creativecommons/by-2.0 licensed under http://creativecommons.org/licenses/by/2.0 available on http://www.slideshare.net/yiibu/adaptation http://www.flickr.com/photos/kwl/4171367373