SlideShare une entreprise Scribd logo
1  sur  47
Télécharger pour lire hors ligne
Future
Friendly
Content.
@thamar
1 future friendly
2 responsive
3 beeld content
1
“The future cannot be
predicted, but futures
  can be invented”
Dennis Gabor, inventing the future 1963
futurefriend.ly
“Disruption will only
     accelerate”
Schaalbaarheid op devices
Sensors en andere output
futurefriend.ly
  “Our existing standards,
workflows, and infrastructure
       won't hold up. ”
Een ander werkproces
futurefriend.ly
“Proprietary solutions will
    dominate at first.”
Gebruiken wat je kent
futurefriend.ly
    Oplossingen:

1    content first
2    mobile first
3    orbital content
Orbital Content
Responsive content...
   Als je voor content
 de context niet meer te
 voorspellen is, moet het
doelgericht, waardevol en
     doordacht zijn.
2

 “The secret to getting
ahead is getting started.”
  Things Mark Twain Didn't Really Say
Responsive..
is nog steeds iets tussen
developers en designers.
responsive content
   Kijk niet alleen naar
schaalbaarheid op scherm
Patterns
content templates
handig voor recht-toe
   recht-aan sites
patterns
inzichtelijk maken
  van concepten.
inzichtelijk maken =
verwachting managen
patterns
responsive content:
   priority guide
Dress
             Responsively
           OLL                  HAS          LTO
                                                                Back to Top
        SCR OW    clothing co       P
                                DRO N     MAI K
         BEL                       W       LIN
                                DO

Home        About          Shirts       Contact                   MADE BY



      SIZE US UP &                                               SPARKBOX
    CAST YOUR VOTE!                                                LOGO
                                                                      Link



                                                              EXCLUSIVELY FOR
   #1              IMAGE
                 OF LEADING
                                    334
 IN POLLS                           VOTES
                    SHIRT
                                                           BUILD RESPONSIVELY
                                                                  LOGO
                                                                      Link


       SHOW ME ALL THE CANDIDATES

                                                   Home       About          Shirts    Contact

   WHAT’S THIS ALL ABOUT?
                                                             © Sparkbox 2012
The Dress Responsively Clothing                             All Rights Reserved.
Company doesn’t exist. Yet. This
website is a product of Sparkbox’s Build
                                                                                             ING
Responsively workshop. Dress                                                             AND
                                                                                      EXP OTER
                                                             El Presidente Say:         FO
Responsively was originally built as a
mock project to create working files and             Responsive design is always the right
content for the workshop’s attendees.                answer. Though it is not always the
                                                                only answer.
But then we got to thinking.
                                                     Listen to Bruce Lee. Be like water,
What standards-loving, responsively-
                                                                 my friend.
building, media-querying web citizens
Identiteit
identiteit
    Hoe blijf je als merk
herkenbaar op klein scherm?
3
“In photography, the smallest
thing can be a great subject.
 The little, human detail can
    become a Leitmotiv. ”
       Henri Cartier-Bresson
Content in responsive design..
   dimensions, ratio's en
 contentblokken, objecten,
        containers.
maar..
Het heeft meestal niets te
      maken met
  betekenis en relaties
Time magazine...
Headline, Lede, image,
  body, conclusion.
Beeldredactie...
Let op de complexiteit, pas
aspec ratio aan op level en
        frequentie.
twee mogelijkheden
  Ander platform,
  andere content
        óf
conditional loading
responsive images
conditional loading

  1   fluid grid
 2    flexible images
  3   media queries
Responsive content...
     semantiek
   microcontent
strategische keuzes
      context
Future
Friendly
Content.
@thamar

Contenu connexe

En vedette

фонд бие даалт
фонд  бие даалтфонд  бие даалт
фонд бие даалтgjkfdjgkfj
 
Thrive Testimonials - My Story
Thrive Testimonials - My StoryThrive Testimonials - My Story
Thrive Testimonials - My StoryJosh Frederick
 
El hecho punible= dulce ure
El hecho punible= dulce ureEl hecho punible= dulce ure
El hecho punible= dulce ureDulce elena Ure
 
producto reversible
producto reversibleproducto reversible
producto reversibleebeliz26
 
лоаирыаириуа
лоаирыаириуалоаирыаириуа
лоаирыаириуаNadia Pop
 
The Road-To-Wealth-By-Robert-Allen
The Road-To-Wealth-By-Robert-AllenThe Road-To-Wealth-By-Robert-Allen
The Road-To-Wealth-By-Robert-AllenDaniel Bulus Jangfa
 
201111_스마트폰 애플리케이션 블랙마켓_KISA
201111_스마트폰 애플리케이션 블랙마켓_KISA201111_스마트폰 애플리케이션 블랙마켓_KISA
201111_스마트폰 애플리케이션 블랙마켓_KISAYOO SE KYUN
 
про нформац ю
про  нформац юпро  нформац ю
про нформац юPsariova
 
Presentation mo 090112
Presentation mo 090112Presentation mo 090112
Presentation mo 090112KeeSafety2011
 

En vedette (9)

фонд бие даалт
фонд  бие даалтфонд  бие даалт
фонд бие даалт
 
Thrive Testimonials - My Story
Thrive Testimonials - My StoryThrive Testimonials - My Story
Thrive Testimonials - My Story
 
El hecho punible= dulce ure
El hecho punible= dulce ureEl hecho punible= dulce ure
El hecho punible= dulce ure
 
producto reversible
producto reversibleproducto reversible
producto reversible
 
лоаирыаириуа
лоаирыаириуалоаирыаириуа
лоаирыаириуа
 
The Road-To-Wealth-By-Robert-Allen
The Road-To-Wealth-By-Robert-AllenThe Road-To-Wealth-By-Robert-Allen
The Road-To-Wealth-By-Robert-Allen
 
201111_스마트폰 애플리케이션 블랙마켓_KISA
201111_스마트폰 애플리케이션 블랙마켓_KISA201111_스마트폰 애플리케이션 블랙마켓_KISA
201111_스마트폰 애플리케이션 블랙마켓_KISA
 
про нформац ю
про  нформац юпро  нформац ю
про нформац ю
 
Presentation mo 090112
Presentation mo 090112Presentation mo 090112
Presentation mo 090112
 

Plus de ContentCafé

Marielle Roozemond Agile Content Content Café
Marielle Roozemond Agile Content Content CaféMarielle Roozemond Agile Content Content Café
Marielle Roozemond Agile Content Content CaféContentCafé
 
Tim Manders | Embedding a thesaurus ContentCafé #10
Tim Manders | Embedding a thesaurus ContentCafé #10Tim Manders | Embedding a thesaurus ContentCafé #10
Tim Manders | Embedding a thesaurus ContentCafé #10ContentCafé
 
Joyce van Aalten | Enter de taxonomie ContentCafé #10
 Joyce van Aalten | Enter de taxonomie ContentCafé #10 Joyce van Aalten | Enter de taxonomie ContentCafé #10
Joyce van Aalten | Enter de taxonomie ContentCafé #10ContentCafé
 
Edwin Stauthamer | Enterprise search ContentCafé #11
Edwin Stauthamer | Enterprise search ContentCafé #11Edwin Stauthamer | Enterprise search ContentCafé #11
Edwin Stauthamer | Enterprise search ContentCafé #11ContentCafé
 
Daan Odijk | Semantic Search ContentCafé #11
Daan Odijk | Semantic Search ContentCafé #11Daan Odijk | Semantic Search ContentCafé #11
Daan Odijk | Semantic Search ContentCafé #11ContentCafé
 
Wouter Weerkamp | Zoekmachines Evalueren ContentCafe #11
Wouter Weerkamp | Zoekmachines Evalueren ContentCafe #11Wouter Weerkamp | Zoekmachines Evalueren ContentCafe #11
Wouter Weerkamp | Zoekmachines Evalueren ContentCafe #11ContentCafé
 
Tim van Waard | Tone of voice ContentCafé #9
Tim van Waard | Tone of voice ContentCafé #9Tim van Waard | Tone of voice ContentCafé #9
Tim van Waard | Tone of voice ContentCafé #9ContentCafé
 
Christiaan Lustig | Responsive web design en contentcreatie ContentCafé #06
Christiaan Lustig | Responsive web design en contentcreatie ContentCafé #06Christiaan Lustig | Responsive web design en contentcreatie ContentCafé #06
Christiaan Lustig | Responsive web design en contentcreatie ContentCafé #06ContentCafé
 
Franklin Heijnen | Leren van en over contentstrategie ContentCafé #02
Franklin Heijnen | Leren van en over contentstrategie ContentCafé #02Franklin Heijnen | Leren van en over contentstrategie ContentCafé #02
Franklin Heijnen | Leren van en over contentstrategie ContentCafé #02ContentCafé
 
Hans Kemp | Leren van en over contentstrategie ContentCafé #02
Hans Kemp | Leren van en over contentstrategie ContentCafé #02Hans Kemp | Leren van en over contentstrategie ContentCafé #02
Hans Kemp | Leren van en over contentstrategie ContentCafé #02ContentCafé
 
Niels Vrijhoeven | Publish or Perish ContentCafé #05
Niels Vrijhoeven | Publish or Perish ContentCafé #05Niels Vrijhoeven | Publish or Perish ContentCafé #05
Niels Vrijhoeven | Publish or Perish ContentCafé #05ContentCafé
 
Hidde Kross | Publish or Perish ContentCafé #05
Hidde Kross | Publish or Perish ContentCafé #05Hidde Kross | Publish or Perish ContentCafé #05
Hidde Kross | Publish or Perish ContentCafé #05ContentCafé
 

Plus de ContentCafé (12)

Marielle Roozemond Agile Content Content Café
Marielle Roozemond Agile Content Content CaféMarielle Roozemond Agile Content Content Café
Marielle Roozemond Agile Content Content Café
 
Tim Manders | Embedding a thesaurus ContentCafé #10
Tim Manders | Embedding a thesaurus ContentCafé #10Tim Manders | Embedding a thesaurus ContentCafé #10
Tim Manders | Embedding a thesaurus ContentCafé #10
 
Joyce van Aalten | Enter de taxonomie ContentCafé #10
 Joyce van Aalten | Enter de taxonomie ContentCafé #10 Joyce van Aalten | Enter de taxonomie ContentCafé #10
Joyce van Aalten | Enter de taxonomie ContentCafé #10
 
Edwin Stauthamer | Enterprise search ContentCafé #11
Edwin Stauthamer | Enterprise search ContentCafé #11Edwin Stauthamer | Enterprise search ContentCafé #11
Edwin Stauthamer | Enterprise search ContentCafé #11
 
Daan Odijk | Semantic Search ContentCafé #11
Daan Odijk | Semantic Search ContentCafé #11Daan Odijk | Semantic Search ContentCafé #11
Daan Odijk | Semantic Search ContentCafé #11
 
Wouter Weerkamp | Zoekmachines Evalueren ContentCafe #11
Wouter Weerkamp | Zoekmachines Evalueren ContentCafe #11Wouter Weerkamp | Zoekmachines Evalueren ContentCafe #11
Wouter Weerkamp | Zoekmachines Evalueren ContentCafe #11
 
Tim van Waard | Tone of voice ContentCafé #9
Tim van Waard | Tone of voice ContentCafé #9Tim van Waard | Tone of voice ContentCafé #9
Tim van Waard | Tone of voice ContentCafé #9
 
Christiaan Lustig | Responsive web design en contentcreatie ContentCafé #06
Christiaan Lustig | Responsive web design en contentcreatie ContentCafé #06Christiaan Lustig | Responsive web design en contentcreatie ContentCafé #06
Christiaan Lustig | Responsive web design en contentcreatie ContentCafé #06
 
Franklin Heijnen | Leren van en over contentstrategie ContentCafé #02
Franklin Heijnen | Leren van en over contentstrategie ContentCafé #02Franklin Heijnen | Leren van en over contentstrategie ContentCafé #02
Franklin Heijnen | Leren van en over contentstrategie ContentCafé #02
 
Hans Kemp | Leren van en over contentstrategie ContentCafé #02
Hans Kemp | Leren van en over contentstrategie ContentCafé #02Hans Kemp | Leren van en over contentstrategie ContentCafé #02
Hans Kemp | Leren van en over contentstrategie ContentCafé #02
 
Niels Vrijhoeven | Publish or Perish ContentCafé #05
Niels Vrijhoeven | Publish or Perish ContentCafé #05Niels Vrijhoeven | Publish or Perish ContentCafé #05
Niels Vrijhoeven | Publish or Perish ContentCafé #05
 
Hidde Kross | Publish or Perish ContentCafé #05
Hidde Kross | Publish or Perish ContentCafé #05Hidde Kross | Publish or Perish ContentCafé #05
Hidde Kross | Publish or Perish ContentCafé #05
 

Dernier

SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptxSKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptxAmanpreet Kaur
 
Single or Multiple melodic lines structure
Single or Multiple melodic lines structureSingle or Multiple melodic lines structure
Single or Multiple melodic lines structuredhanjurrannsibayan2
 
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxHMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxEsquimalt MFRC
 
REMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptxREMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptxDr. Ravikiran H M Gowda
 
Fostering Friendships - Enhancing Social Bonds in the Classroom
Fostering Friendships - Enhancing Social Bonds  in the ClassroomFostering Friendships - Enhancing Social Bonds  in the Classroom
Fostering Friendships - Enhancing Social Bonds in the ClassroomPooky Knightsmith
 
Micro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfMicro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfPoh-Sun Goh
 
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdfUGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdfNirmal Dwivedi
 
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptxBasic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptxDenish Jangid
 
Food safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdfFood safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdfSherif Taha
 
Graduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - EnglishGraduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - Englishneillewis46
 
Python Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxPython Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxRamakrishna Reddy Bijjam
 
General Principles of Intellectual Property: Concepts of Intellectual Proper...
General Principles of Intellectual Property: Concepts of Intellectual  Proper...General Principles of Intellectual Property: Concepts of Intellectual  Proper...
General Principles of Intellectual Property: Concepts of Intellectual Proper...Poonam Aher Patil
 
Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...Association for Project Management
 
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...Nguyen Thanh Tu Collection
 
ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.MaryamAhmad92
 
ICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptxICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptxAreebaZafar22
 
How to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxHow to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxCeline George
 
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...Pooja Bhuva
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfAdmir Softic
 

Dernier (20)

SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptxSKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
 
Single or Multiple melodic lines structure
Single or Multiple melodic lines structureSingle or Multiple melodic lines structure
Single or Multiple melodic lines structure
 
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxHMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
 
REMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptxREMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptx
 
Spatium Project Simulation student brief
Spatium Project Simulation student briefSpatium Project Simulation student brief
Spatium Project Simulation student brief
 
Fostering Friendships - Enhancing Social Bonds in the Classroom
Fostering Friendships - Enhancing Social Bonds  in the ClassroomFostering Friendships - Enhancing Social Bonds  in the Classroom
Fostering Friendships - Enhancing Social Bonds in the Classroom
 
Micro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfMicro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdf
 
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdfUGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
 
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptxBasic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
 
Food safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdfFood safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdf
 
Graduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - EnglishGraduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - English
 
Python Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docxPython Notes for mca i year students osmania university.docx
Python Notes for mca i year students osmania university.docx
 
General Principles of Intellectual Property: Concepts of Intellectual Proper...
General Principles of Intellectual Property: Concepts of Intellectual  Proper...General Principles of Intellectual Property: Concepts of Intellectual  Proper...
General Principles of Intellectual Property: Concepts of Intellectual Proper...
 
Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...
 
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
 
ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.
 
ICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptxICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptx
 
How to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxHow to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptx
 
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
Sensory_Experience_and_Emotional_Resonance_in_Gabriel_Okaras_The_Piano_and_Th...
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdf
 

Thamar Kiemel | Future Friendly Content ContentCafé #06