SlideShare une entreprise Scribd logo
1  sur  37
Télécharger pour lire hors ligne
THE FUTURE OF
ADAPTIVE CONTENT
RESPONSIVE VS. ADAPTIVE
I need more than a responsive site, 

I need it to be adaptive.
https://medium.com/@livlab/responsive-versus-adaptive-is-not-a-thing-b712eefaf313
WHAT IS ADAPTIVE?
Build a separate mobile site
Send users who need more
info to the desktop site
✘
✘
Cut features and content not
core to the mobile use case ✘
NO FORKING WAY.
ADAPTIVE CONTENT

Structured content that can be targeted by device type or
personalized by context (i.e. time, location, user data)
ADAPTIVE LAYOUTS

Different layouts for different device types, including “not
fully responsive” designs that “snap” to sizes
ADAPTIVE
LAYOUTS
RESPONSIVE 

LAYOUTS
CLIENT SIDE
versus
SERVER SIDE
“Responsive design is client-side, meaning
the whole page is delivered to the device
browser (the client), and the browser then
changes how the page appears in relation
to the dimensions of the browser window.
http://www.huffingtonpost.com/garrett-goodman/adaptive-design_b_2344569.html
“Adaptive design is server-side, meaning
before the page is even delivered, the
server detects the attributes of the device,
and loads a version of the [content] that is
optimized for its dimensions and native
features.
http://www.huffingtonpost.com/garrett-goodman/adaptive-design_b_2344569.html
RESPONSIVE DESIGN
+
IDENTICAL CONTENT
There is no Mobile Web. 

There is only The Web, 

which we view in different ways. 

There is also no Desktop Web. 

Or Tablet Web. Thank you.
—Stephen Hay
ADAPTIVE LAYOUTS
+
IDENTICAL CONTENT
ADAPTIVE LAYOUTS
+
ADAPTIVE CONTENT
COPE: Create Once, Publish Everywhere
COPE:
CREATE ONCE,
PUBLISH EVERYWHERE
RESPONSIVE LAYOUTS
+
ADAPTIVE CONTENT
RESPONSIVE LAYOUTS
+
ADAPTIVE LAYOUTS
If we go responsive, can we serve 

a different homepage?
ADAPTIVE LAYOUTS + CONTENT
Adaptive content is:
_Structured: Chunked content with a finer grain of granularity
_Targeted: Alternate forms of content served based on
“contextual” triggers: time, location, personalization, device)
Adaptive layouts are:
_Different layouts that “snap” at different breakpoints; or
_Different layouts for specific pages or templates; or
_Different layouts for specific features
WHEN ARE ADAPTIVE LAYOUTS
NECESSARY?
WHEN IS ADAPTIVE CONTENT
NECESSARY?
The Future of Adaptive Content

Contenu connexe

Tendances

Tendances (20)

Hackers guide to UX
Hackers guide to UXHackers guide to UX
Hackers guide to UX
 
Responsive Webdesign
Responsive WebdesignResponsive Webdesign
Responsive Webdesign
 
Designing for The Modern Web
Designing for The Modern WebDesigning for The Modern Web
Designing for The Modern Web
 
HTML and Responsive Design
HTML and Responsive Design HTML and Responsive Design
HTML and Responsive Design
 
One Web To Rule Them All
One Web To Rule Them AllOne Web To Rule Them All
One Web To Rule Them All
 
Specialise or cross-skill
Specialise or cross-skillSpecialise or cross-skill
Specialise or cross-skill
 
Uxperts mobi 2013 soa & challenges
Uxperts mobi 2013   soa & challengesUxperts mobi 2013   soa & challenges
Uxperts mobi 2013 soa & challenges
 
Ready to go Mobile? Today's Mobile Landscape: Responsive, Adaptive, Hybrid, a...
Ready to go Mobile? Today's Mobile Landscape: Responsive, Adaptive, Hybrid, a...Ready to go Mobile? Today's Mobile Landscape: Responsive, Adaptive, Hybrid, a...
Ready to go Mobile? Today's Mobile Landscape: Responsive, Adaptive, Hybrid, a...
 
Progressive web apps
Progressive web appsProgressive web apps
Progressive web apps
 
WordPress & User Experience - WordCamp London
WordPress & User Experience - WordCamp LondonWordPress & User Experience - WordCamp London
WordPress & User Experience - WordCamp London
 
Mobile first: A future friendly approach to UX design
Mobile first: A future friendly approach to UX designMobile first: A future friendly approach to UX design
Mobile first: A future friendly approach to UX design
 
Problems in Mobile Development
Problems in Mobile DevelopmentProblems in Mobile Development
Problems in Mobile Development
 
Angela Frucci Portfolio
Angela Frucci PortfolioAngela Frucci Portfolio
Angela Frucci Portfolio
 
Web design and development trends
Web design and development  trendsWeb design and development  trends
Web design and development trends
 
Responsive web design
Responsive web designResponsive web design
Responsive web design
 
RESPONSIVE WEB DESIGN
RESPONSIVE WEB DESIGNRESPONSIVE WEB DESIGN
RESPONSIVE WEB DESIGN
 
"SCRUM allows us to create better products, more suited to the users' needs. ...
"SCRUM allows us to create better products, more suited to the users' needs. ..."SCRUM allows us to create better products, more suited to the users' needs. ...
"SCRUM allows us to create better products, more suited to the users' needs. ...
 
Hybrid vs native mobile development – how to choose a tech stack
Hybrid vs native mobile development – how to choose a tech stackHybrid vs native mobile development – how to choose a tech stack
Hybrid vs native mobile development – how to choose a tech stack
 
Why and How to Build a Mobile First Web Strategy
Why and How to Build a Mobile First Web StrategyWhy and How to Build a Mobile First Web Strategy
Why and How to Build a Mobile First Web Strategy
 
Designing Websites With a Mobile First Approach
Designing Websites With a Mobile First ApproachDesigning Websites With a Mobile First Approach
Designing Websites With a Mobile First Approach
 

Similaire à The Future of Adaptive Content

Why should we build our website responsive
Why should we build our website responsiveWhy should we build our website responsive
Why should we build our website responsive
Omkarsoft Bangalore
 

Similaire à The Future of Adaptive Content (20)

Responsive web design
Responsive web design Responsive web design
Responsive web design
 
Responsive Web Design | Website Designing
Responsive Web Design | Website DesigningResponsive Web Design | Website Designing
Responsive Web Design | Website Designing
 
IJSRED-V2I5P23
IJSRED-V2I5P23IJSRED-V2I5P23
IJSRED-V2I5P23
 
Why should we build our website responsive
Why should we build our website responsiveWhy should we build our website responsive
Why should we build our website responsive
 
Adaptive vs Responsive Layouts
Adaptive vs Responsive LayoutsAdaptive vs Responsive Layouts
Adaptive vs Responsive Layouts
 
Responsive vs. Adaptive
Responsive vs. AdaptiveResponsive vs. Adaptive
Responsive vs. Adaptive
 
Responsive Web Design
Responsive Web DesignResponsive Web Design
Responsive Web Design
 
Grasping the Concept of Adaptable Website Design
Grasping the Concept of Adaptable Website DesignGrasping the Concept of Adaptable Website Design
Grasping the Concept of Adaptable Website Design
 
Responsive & Adaptive Design: Delivering Websites That Delight Your Users
Responsive & Adaptive Design: Delivering Websites That Delight Your UsersResponsive & Adaptive Design: Delivering Websites That Delight Your Users
Responsive & Adaptive Design: Delivering Websites That Delight Your Users
 
The Power of Responsive Web Design
The Power of Responsive Web DesignThe Power of Responsive Web Design
The Power of Responsive Web Design
 
Responsive Web Design
Responsive Web DesignResponsive Web Design
Responsive Web Design
 
Responsive Design is NOT a Mobile Strategy
Responsive Design is NOT a Mobile StrategyResponsive Design is NOT a Mobile Strategy
Responsive Design is NOT a Mobile Strategy
 
Responsive Web Design- Trending
Responsive Web Design- TrendingResponsive Web Design- Trending
Responsive Web Design- Trending
 
"Adaptive Content, Context, and Controversy
"Adaptive Content, Context, and Controversy"Adaptive Content, Context, and Controversy
"Adaptive Content, Context, and Controversy
 
Responsive Web Design
Responsive Web DesignResponsive Web Design
Responsive Web Design
 
Context-Aware and User-Centered Design: The Lost Battle Between Desktop and M...
Context-Aware and User-Centered Design: The Lost Battle Between Desktop and M...Context-Aware and User-Centered Design: The Lost Battle Between Desktop and M...
Context-Aware and User-Centered Design: The Lost Battle Between Desktop and M...
 
Adaptive: Content, Context, and Controversy
Adaptive: Content, Context, and ControversyAdaptive: Content, Context, and Controversy
Adaptive: Content, Context, and Controversy
 
Mobile SEO Considerations
Mobile SEO ConsiderationsMobile SEO Considerations
Mobile SEO Considerations
 
Responsive web designing
Responsive web designingResponsive web designing
Responsive web designing
 
Responsive Web Design (RWD) vs Adaptive Web Design (AWD)
Responsive Web Design (RWD) vs Adaptive Web Design (AWD)Responsive Web Design (RWD) vs Adaptive Web Design (AWD)
Responsive Web Design (RWD) vs Adaptive Web Design (AWD)
 

Plus de Karen McGrane

Content Strategy for Mobile: The Workshop
Content Strategy for Mobile: The WorkshopContent Strategy for Mobile: The Workshop
Content Strategy for Mobile: The Workshop
Karen McGrane
 

Plus de Karen McGrane (20)

The Mobile Content Mandate
The Mobile Content MandateThe Mobile Content Mandate
The Mobile Content Mandate
 
Content in a Zombie Apocalypse
Content in a Zombie ApocalypseContent in a Zombie Apocalypse
Content in a Zombie Apocalypse
 
Thriving in a world of change: Future-friendly content with Drupal
Thriving in a world of change: Future-friendly content with DrupalThriving in a world of change: Future-friendly content with Drupal
Thriving in a world of change: Future-friendly content with Drupal
 
IA Summit 2013 Closing Plenary
IA Summit 2013 Closing PlenaryIA Summit 2013 Closing Plenary
IA Summit 2013 Closing Plenary
 
Content Strategy for Mobile: The Workshop
Content Strategy for Mobile: The WorkshopContent Strategy for Mobile: The Workshop
Content Strategy for Mobile: The Workshop
 
Uncle Sam Wants You (To Optimize Your Content For Mobile)
Uncle Sam Wants You (To Optimize Your Content For Mobile)Uncle Sam Wants You (To Optimize Your Content For Mobile)
Uncle Sam Wants You (To Optimize Your Content For Mobile)
 
Adapting Ourselves to Adaptive Content
Adapting Ourselves to Adaptive ContentAdapting Ourselves to Adaptive Content
Adapting Ourselves to Adaptive Content
 
Adapting ourselves to adaptive content
Adapting ourselves to adaptive contentAdapting ourselves to adaptive content
Adapting ourselves to adaptive content
 
Developing Successful Content Management Solutions
Developing Successful Content Management SolutionsDeveloping Successful Content Management Solutions
Developing Successful Content Management Solutions
 
Adapting ourselves to adaptive content
Adapting ourselves to adaptive contentAdapting ourselves to adaptive content
Adapting ourselves to adaptive content
 
The Way Forward: What's next for content strategy
The Way Forward: What's next for content strategyThe Way Forward: What's next for content strategy
The Way Forward: What's next for content strategy
 
Selling content strategy
Selling content strategySelling content strategy
Selling content strategy
 
Nailing Your Performance
Nailing Your PerformanceNailing Your Performance
Nailing Your Performance
 
Making the most of mobile
Making the most of mobileMaking the most of mobile
Making the most of mobile
 
Nashville UX Meetup
Nashville UX MeetupNashville UX Meetup
Nashville UX Meetup
 
How to do content strategy
How to do content strategyHow to do content strategy
How to do content strategy
 
Avoiding the 11th Hour Sh*storm at SxSW
Avoiding the 11th Hour Sh*storm at SxSWAvoiding the 11th Hour Sh*storm at SxSW
Avoiding the 11th Hour Sh*storm at SxSW
 
Baby Got Backend: Content Administrators are Users Too
Baby Got Backend: Content Administrators are Users TooBaby Got Backend: Content Administrators are Users Too
Baby Got Backend: Content Administrators are Users Too
 
Content Strategy for the Web
Content Strategy for the WebContent Strategy for the Web
Content Strategy for the Web
 
We are all content strategists now
We are all content strategists nowWe are all content strategists now
We are all content strategists now
 

Dernier

Abortion Pills in Oman (+918133066128) Cytotec clinic buy Oman Muscat
Abortion Pills in Oman (+918133066128) Cytotec clinic buy Oman MuscatAbortion Pills in Oman (+918133066128) Cytotec clinic buy Oman Muscat
Abortion Pills in Oman (+918133066128) Cytotec clinic buy Oman Muscat
Abortion pills in Kuwait Cytotec pills in Kuwait
 
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
CristineGraceAcuyan
 
Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...
Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...
Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...
gajnagarg
 
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
instagramfab782445
 
Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
Nitya salvi
 
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
yhavx
 
怎样办理伦敦国王学院毕业证(KCL毕业证书)成绩单留信认证
怎样办理伦敦国王学院毕业证(KCL毕业证书)成绩单留信认证怎样办理伦敦国王学院毕业证(KCL毕业证书)成绩单留信认证
怎样办理伦敦国王学院毕业证(KCL毕业证书)成绩单留信认证
eeanqy
 
Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...
Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...
Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...
HyderabadDolls
 
怎样办理伯明翰城市大学毕业证(BCU毕业证书)成绩单留信认证
怎样办理伯明翰城市大学毕业证(BCU毕业证书)成绩单留信认证怎样办理伯明翰城市大学毕业证(BCU毕业证书)成绩单留信认证
怎样办理伯明翰城市大学毕业证(BCU毕业证书)成绩单留信认证
eeanqy
 

Dernier (20)

Independent Escorts Goregaon WhatsApp +91-9930687706, Best Service
Independent Escorts Goregaon WhatsApp +91-9930687706, Best ServiceIndependent Escorts Goregaon WhatsApp +91-9930687706, Best Service
Independent Escorts Goregaon WhatsApp +91-9930687706, Best Service
 
Abortion Pills in Oman (+918133066128) Cytotec clinic buy Oman Muscat
Abortion Pills in Oman (+918133066128) Cytotec clinic buy Oman MuscatAbortion Pills in Oman (+918133066128) Cytotec clinic buy Oman Muscat
Abortion Pills in Oman (+918133066128) Cytotec clinic buy Oman Muscat
 
High Profile Escorts Nerul WhatsApp +91-9930687706, Best Service
High Profile Escorts Nerul WhatsApp +91-9930687706, Best ServiceHigh Profile Escorts Nerul WhatsApp +91-9930687706, Best Service
High Profile Escorts Nerul WhatsApp +91-9930687706, Best Service
 
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
Q4-Trends-Networks-Module-3.pdfqquater days sheets123456789
 
Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...
Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...
Top profile Call Girls In eluru [ 7014168258 ] Call Me For Genuine Models We ...
 
Sweety Planet Packaging Design Process Book.pptx
Sweety Planet Packaging Design Process Book.pptxSweety Planet Packaging Design Process Book.pptx
Sweety Planet Packaging Design Process Book.pptx
 
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
 
Raebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for Friendship
Raebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for FriendshipRaebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for Friendship
Raebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for Friendship
 
UI:UX Design and Empowerment Strategies for Underprivileged Transgender Indiv...
UI:UX Design and Empowerment Strategies for Underprivileged Transgender Indiv...UI:UX Design and Empowerment Strategies for Underprivileged Transgender Indiv...
UI:UX Design and Empowerment Strategies for Underprivileged Transgender Indiv...
 
Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
 
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
 
Pondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime Pondicherry
Pondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime PondicherryPondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime Pondicherry
Pondicherry Escorts Service Girl ^ 9332606886, WhatsApp Anytime Pondicherry
 
怎样办理伦敦国王学院毕业证(KCL毕业证书)成绩单留信认证
怎样办理伦敦国王学院毕业证(KCL毕业证书)成绩单留信认证怎样办理伦敦国王学院毕业证(KCL毕业证书)成绩单留信认证
怎样办理伦敦国王学院毕业证(KCL毕业证书)成绩单留信认证
 
Eye-Catching Web Design Crafting User Interfaces .docx
Eye-Catching Web Design Crafting User Interfaces .docxEye-Catching Web Design Crafting User Interfaces .docx
Eye-Catching Web Design Crafting User Interfaces .docx
 
NO1 Top Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakist...
NO1 Top Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakist...NO1 Top Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakist...
NO1 Top Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakist...
 
Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...
Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...
Madhyamgram \ (Genuine) Escort Service Kolkata | Service-oriented sexy call g...
 
Jordan_Amanda_DMBS202404_PB1_2024-04.pdf
Jordan_Amanda_DMBS202404_PB1_2024-04.pdfJordan_Amanda_DMBS202404_PB1_2024-04.pdf
Jordan_Amanda_DMBS202404_PB1_2024-04.pdf
 
Just Call Vip call girls Fatehpur Escorts ☎️8617370543 Two shot with one girl...
Just Call Vip call girls Fatehpur Escorts ☎️8617370543 Two shot with one girl...Just Call Vip call girls Fatehpur Escorts ☎️8617370543 Two shot with one girl...
Just Call Vip call girls Fatehpur Escorts ☎️8617370543 Two shot with one girl...
 
Q4-W4-SCIENCE-5 power point presentation
Q4-W4-SCIENCE-5 power point presentationQ4-W4-SCIENCE-5 power point presentation
Q4-W4-SCIENCE-5 power point presentation
 
怎样办理伯明翰城市大学毕业证(BCU毕业证书)成绩单留信认证
怎样办理伯明翰城市大学毕业证(BCU毕业证书)成绩单留信认证怎样办理伯明翰城市大学毕业证(BCU毕业证书)成绩单留信认证
怎样办理伯明翰城市大学毕业证(BCU毕业证书)成绩单留信认证
 

The Future of Adaptive Content