SlideShare a Scribd company logo
1 of 45
Download to read offline
STRUCTURED
  CONTENT
                         FIRST
  Stephen Hay . Mirabeau Mobile Event, Amsterdam . 20110609
WHAT IS

MOBILE?
usatoday.com in Android browser,
      Samsung Galaxy S
WTF?
twitter.com in Opera browser
twitter.com in Android browser,
      Samsung Galaxy S
twitter.com in Opera Mini
the assumption is




PEOPLE ON THE DESKTOP WANT


     THIS
the assumption is



PEOPLE ON “MOBILE” WANT


   THIS
Hey, there’s that thing
 I wanted to read.
“I WANT IT TO

WORK            ON AN

 iPAD”
THE WORLD’S FIRST WEBSITE IS ALMOST MOBILE READY.




                              Opera browser


  http://www.w3.org/History/19921103-hypertext/hypertext/WWW/TheProject.html
THE WORLD’S FIRST WEBSITE IS ALMOST MOBILE READY.




                Opera Mobile, Samsung Galaxy Tab

  http://www.w3.org/History/19921103-hypertext/hypertext/WWW/TheProject.html
The device landscape is constantly
changing. Capabilities are constantly
changing. Properly structured content
is portable to future platforms.
PLATFORM-AGNOSTIC   for




CONTENT
Don’t assume users want di!erent content simply because
of the platform they’re using.

Do cater to device capabilities if you want, but don’t
assume that users want other capabilities on other devices.



PLATFORM-AGNOSTIC                                             for




CONTENT
PLATFORM-AWARE   for

USER EXPERIENCE
Do try and create an e!ectively usable
environment for people to easily accomplish tasks.




PLATFORM-AWARE                                       for

USER EXPERIENCE
THERE IS NO
             MOBILE WEB.
http://www.the-haystack.com/2011/01/07/there-is-no-mobile-web/
RESPONSIVE DESIGN&
 ADAPTIVE LAYOUT
Real responsive design will be hard to do.
Adaptive layout is a good "rst step, and is often
what people mean with the term “responsive design”.

Because layout is only a part of design.




RESPONSIVE DESIGN&
  ADAPTIVE LAYOUT
http://mediaqueri.es
Thinking about, creating and
designing structured content "rst
caters to the lowest common layout
denominator, whether this be a small
screen or a text browser.

In fact, this content should be able to
go anywhere.
CONTENT STRATEGY,
STRUCTURED CONTENT
          (FIRST).
No mind-reading!


CONTENT STRATEGY,
STRUCTURED CONTENT
          (FIRST).
No mind-reading!


CONTENT STRATEGY,
STRUCTURED CONTENT
The baseline for responsive design.


                                      (FIRST).
No mind-reading!


CONTENT STRATEGY,
STRUCTURED CONTENT
The baseline for responsive design.


                                      (FIRST).
                                       = “mobile” "rst.
THANK YOU!
twitter.com/stephenhay

slideshare.net/stephenhay/structured-content-"rst

More Related Content

Viewers also liked

Content / Discourse Analysis
Content / Discourse AnalysisContent / Discourse Analysis
Content / Discourse Analysis
Wai-Kwok Wong
 

Viewers also liked (15)

Intelligent Content: A Case Study
Intelligent Content: A Case StudyIntelligent Content: A Case Study
Intelligent Content: A Case Study
 
Content / Discourse Analysis
Content / Discourse AnalysisContent / Discourse Analysis
Content / Discourse Analysis
 
Hero Shot Images: 7 Secrets to Visuals That Drive Sales
Hero Shot Images: 7 Secrets to Visuals That Drive SalesHero Shot Images: 7 Secrets to Visuals That Drive Sales
Hero Shot Images: 7 Secrets to Visuals That Drive Sales
 
Semantic
Semantic Semantic
Semantic
 
Rehearse for Real Time (SMWi-Austin 2017)
Rehearse for Real Time (SMWi-Austin 2017)Rehearse for Real Time (SMWi-Austin 2017)
Rehearse for Real Time (SMWi-Austin 2017)
 
China: Creators and Consumers of the Future
China: Creators and Consumers of the FutureChina: Creators and Consumers of the Future
China: Creators and Consumers of the Future
 
Make Your Content Nimble - Confab
Make Your Content Nimble - ConfabMake Your Content Nimble - Confab
Make Your Content Nimble - Confab
 
Discourse analysis
Discourse analysisDiscourse analysis
Discourse analysis
 
Sentence semantics
Sentence semanticsSentence semantics
Sentence semantics
 
RESS: An Evolution of Responsive Web Design
RESS: An Evolution of Responsive Web DesignRESS: An Evolution of Responsive Web Design
RESS: An Evolution of Responsive Web Design
 
Social Proof Persuasive Content Framework
Social Proof Persuasive Content FrameworkSocial Proof Persuasive Content Framework
Social Proof Persuasive Content Framework
 
Structuring Content, Restructuring Organizations - CS Forum 2012
Structuring Content, Restructuring Organizations - CS Forum 2012Structuring Content, Restructuring Organizations - CS Forum 2012
Structuring Content, Restructuring Organizations - CS Forum 2012
 
Responsive Design Workflow: Mobilism 2012
Responsive Design Workflow: Mobilism 2012Responsive Design Workflow: Mobilism 2012
Responsive Design Workflow: Mobilism 2012
 
The CMO's Guide to Hiring for Content Marketing
The CMO's Guide to Hiring for Content MarketingThe CMO's Guide to Hiring for Content Marketing
The CMO's Guide to Hiring for Content Marketing
 
Categorical Propositions- Logic
Categorical Propositions- LogicCategorical Propositions- Logic
Categorical Propositions- Logic
 

More from Stephen Hay

Fronteers Workshop: Rabid Prototyping
Fronteers Workshop: Rabid PrototypingFronteers Workshop: Rabid Prototyping
Fronteers Workshop: Rabid Prototyping
Stephen Hay
 
HTML5 & Webrichtlijnen 2
HTML5 & Webrichtlijnen 2HTML5 & Webrichtlijnen 2
HTML5 & Webrichtlijnen 2
Stephen Hay
 

More from Stephen Hay (20)

From Deception to Clarity
From Deception to ClarityFrom Deception to Clarity
From Deception to Clarity
 
The Backside of the Class (CSS Day 2015)
The Backside of the Class (CSS Day 2015)The Backside of the Class (CSS Day 2015)
The Backside of the Class (CSS Day 2015)
 
The Art of Deception
The Art of DeceptionThe Art of Deception
The Art of Deception
 
Sculpting Text: Easing the Pain of Designing in the Browser
Sculpting Text: Easing the Pain of Designing in the BrowserSculpting Text: Easing the Pain of Designing in the Browser
Sculpting Text: Easing the Pain of Designing in the Browser
 
Power Tools For Browser-Based Design
Power Tools For Browser-Based DesignPower Tools For Browser-Based Design
Power Tools For Browser-Based Design
 
UIE Virtual Seminar: Responsive Web Design Workflow
UIE Virtual Seminar: Responsive Web Design WorkflowUIE Virtual Seminar: Responsive Web Design Workflow
UIE Virtual Seminar: Responsive Web Design Workflow
 
Flexbox: One Giant Leap for Web Layout (Breaking Development 2013)
Flexbox: One Giant Leap for Web Layout (Breaking Development 2013)Flexbox: One Giant Leap for Web Layout (Breaking Development 2013)
Flexbox: One Giant Leap for Web Layout (Breaking Development 2013)
 
Flexbox: One Giant Leap for Web Layout (GenerateConf 2013)
Flexbox: One Giant Leap for Web Layout (GenerateConf 2013)Flexbox: One Giant Leap for Web Layout (GenerateConf 2013)
Flexbox: One Giant Leap for Web Layout (GenerateConf 2013)
 
The New Photoshop, Part 2: The Revenge of the Web (FEC13)
The New Photoshop, Part 2: The Revenge of the Web (FEC13)The New Photoshop, Part 2: The Revenge of the Web (FEC13)
The New Photoshop, Part 2: The Revenge of the Web (FEC13)
 
Flexbox: One Giant Leap for Web Layout (CSS Day 2013)
Flexbox: One Giant Leap for Web Layout (CSS Day 2013)Flexbox: One Giant Leap for Web Layout (CSS Day 2013)
Flexbox: One Giant Leap for Web Layout (CSS Day 2013)
 
The New Photoshop, Part 2: The Revenge of the Web
The New Photoshop, Part 2: The Revenge of the WebThe New Photoshop, Part 2: The Revenge of the Web
The New Photoshop, Part 2: The Revenge of the Web
 
Style Guides Are The New Photoshop (Smashing Conference 2012)
Style Guides Are The New Photoshop (Smashing Conference 2012)Style Guides Are The New Photoshop (Smashing Conference 2012)
Style Guides Are The New Photoshop (Smashing Conference 2012)
 
Style Guides Are The New Photoshop (Fronteers 2012)
Style Guides Are The New Photoshop (Fronteers 2012)Style Guides Are The New Photoshop (Fronteers 2012)
Style Guides Are The New Photoshop (Fronteers 2012)
 
Responsive Design Workflow: Webshaped 2012
Responsive Design Workflow: Webshaped 2012Responsive Design Workflow: Webshaped 2012
Responsive Design Workflow: Webshaped 2012
 
Responsive Design Workflow (Breaking Development Conference 2012 Orlando)
Responsive Design Workflow (Breaking Development Conference 2012 Orlando)Responsive Design Workflow (Breaking Development Conference 2012 Orlando)
Responsive Design Workflow (Breaking Development Conference 2012 Orlando)
 
Go With The Flow
Go With The FlowGo With The Flow
Go With The Flow
 
Fronteers Workshop: Rabid Prototyping
Fronteers Workshop: Rabid PrototypingFronteers Workshop: Rabid Prototyping
Fronteers Workshop: Rabid Prototyping
 
HTML5 & Webrichtlijnen 2
HTML5 & Webrichtlijnen 2HTML5 & Webrichtlijnen 2
HTML5 & Webrichtlijnen 2
 
Real-world Responsive Design
Real-world Responsive DesignReal-world Responsive Design
Real-world Responsive Design
 
De aanvrager wint
De aanvrager wintDe aanvrager wint
De aanvrager wint
 

Recently uploaded

Recently uploaded (20)

Scaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organizationScaling API-first – The story of a global engineering organization
Scaling API-first – The story of a global engineering organization
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
Tech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdfTech Trends Report 2024 Future Today Institute.pdf
Tech Trends Report 2024 Future Today Institute.pdf
 
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
Strategies for Unlocking Knowledge Management in Microsoft 365 in the Copilot...
 
Developing An App To Navigate The Roads of Brazil
Developing An App To Navigate The Roads of BrazilDeveloping An App To Navigate The Roads of Brazil
Developing An App To Navigate The Roads of Brazil
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 
What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?What Are The Drone Anti-jamming Systems Technology?
What Are The Drone Anti-jamming Systems Technology?
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
Advantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessAdvantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your Business
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
Boost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivityBoost PC performance: How more available memory can improve productivity
Boost PC performance: How more available memory can improve productivity
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 

Structured Content First