SlideShare ist ein Scribd-Unternehmen logo
1 von 45
Downloaden Sie, um offline zu lesen
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

Weitere ähnliche Inhalte

Andere mochten auch

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

Andere mochten auch (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
 

Mehr von 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
 

Mehr von 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
 

Kürzlich hochgeladen

Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and Myths
Joaquim Jorge
 

Kürzlich hochgeladen (20)

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
 
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
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
 
[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
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
 
Handwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed textsHandwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed texts
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
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
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
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...
 
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
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
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?
 
Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and Myths
 
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...
 

Structured Content First