SlideShare une entreprise Scribd logo
1  sur  29
RESPONSIBLE
WEBDESIGN
Websites voor iedereen & alle toestellen.
TOESTELLEN
Smartphones, feature phones, spelconsoles, TV, Tablets, notebooks,
desktop, ...
SCHERMRESOLU
TIES
worden groter en kleiner tegelijkertijd. Retina displays...
MEER
BROWSERS DAN
Van internet explorer tot Nokia Ovi browser.
There are approximately 6.34 billion people on the planet, an
estimated 4.6 billion mobile subscriptions, and an estimated 3.4
billion unique users.

1.3 billion Nokia devices in circulation.




Source: yibuu.com
Internet explorer 6 was nog maar het begin.
DESKTOP
OBSOLETE?
Smartphone dock aangesloten op een scherm, gesynced met tablet,
DOWNLOADSNE
LHEID
edge, 3G, 4G, wifi, ...
“OLDSKOOL”
WEBDESIGN
Negeren die handel! 1024 sinds 2005.
MOBIELE
WEBSITES
aparte mobiele versies in quarantaine
content veranderen voor mobiel gebruik
andere interacties
mobiel surfen is traag
Beslissen om informatie weg te laten mag niet gebaseerd zijn op
schermgrootte alleen.
het apparaat dat een surfer gebruikt en de informatie waarnaar hij
zoekt, zijn niet altijd verbonden met elkaar.




Bram Vanderhaeghe
Research has show that a significant percentage of people use
“the mobile web” from the comfort of their homes.




Responsive Webdsign by Ethan Marcotte
Wifi
Alles wordt altijd sneller.
Probleem met sharen, bookmarken, syncen.
Wat als de gebruiker beslist om de volledige site te zien?
RESPONSIVE
WEBDESIGN
designing websites that can adapt to the constraints of the browser
window or device that renders it, creating a design that responds to
the user's need.
flexible layout
fluid grids, no more pixels, everything %
fluid images & media
media queries
PROGRESSIVE
ENHANCEMENT
de zwakste gebruiker/het oudste toestel eerst
oudere versies van Internet explorer, oude mobiele browsers, zonder
javascript ingeschakeld

fundament van semantisch, goed gestructureerde content
verzekerd van universele toegang
MOBILE FIRST
Toestellen met kleine schermen en ondersteuning voor nieuwere
technieken een verbeterde layout geven.
Met media queries de ervaring schermresolutie per schermresolutie
verbeteren.
Schermresoluties hoger dan 1024 kunnen we ook aanpakken.
RESPONSIBLE
CONCLUSION
Negeren is onverantwoord.
Onderzoeken en beslissen “niet nodig” is beter.
Moet deel worden van de online strategie.
Responsive design wordt de nieuwe webstandaard.
Zelfs als je toch beslist om een aparte site voor een bepaald toestel
te maken moet de volledige site ook responsive zijn.
Iphone & Ipad zijn niet voldoende.
Niet mobiel alleen. Resoluties groter dan 1024 kunnen we ook
herbekijken.
DESIGNING FOR
THE FUTURE

Contenu connexe

En vedette

Keeping the Cloud in check KATHO
Keeping the Cloud in check KATHOKeeping the Cloud in check KATHO
Keeping the Cloud in check KATHO
Combell NV
 
Tips voor een creatief concept
Tips voor een creatief conceptTips voor een creatief concept
Tips voor een creatief concept
Roy Ishak
 
Nederland gaat-digitaal-website-werkboek
Nederland gaat-digitaal-website-werkboekNederland gaat-digitaal-website-werkboek
Nederland gaat-digitaal-website-werkboek
Koray Gonullu
 

En vedette (14)

Quickcode - mobile lead generation via offline media.
Quickcode - mobile lead generation via offline media.Quickcode - mobile lead generation via offline media.
Quickcode - mobile lead generation via offline media.
 
Keeping the Cloud in check KATHO
Keeping the Cloud in check KATHOKeeping the Cloud in check KATHO
Keeping the Cloud in check KATHO
 
Zoekmachine gids mkb_ebook_v1.0_lowres
Zoekmachine gids mkb_ebook_v1.0_lowresZoekmachine gids mkb_ebook_v1.0_lowres
Zoekmachine gids mkb_ebook_v1.0_lowres
 
Verschil google panda en pinquin
Verschil google panda en pinquinVerschil google panda en pinquin
Verschil google panda en pinquin
 
responsible webdesign
responsible webdesignresponsible webdesign
responsible webdesign
 
Tips voor een creatief concept
Tips voor een creatief conceptTips voor een creatief concept
Tips voor een creatief concept
 
Nederland gaat-digitaal-website-werkboek
Nederland gaat-digitaal-website-werkboekNederland gaat-digitaal-website-werkboek
Nederland gaat-digitaal-website-werkboek
 
7 tips voor een goede website
7 tips voor een goede website7 tips voor een goede website
7 tips voor een goede website
 
SPD Groningen - van website naar webshop
SPD Groningen - van website naar webshopSPD Groningen - van website naar webshop
SPD Groningen - van website naar webshop
 
Stappenplan Succesvolle webshops
Stappenplan Succesvolle webshopsStappenplan Succesvolle webshops
Stappenplan Succesvolle webshops
 
Webshop Starten | je optimale voorbereiding op het starten van een Webshop
Webshop Starten | je optimale voorbereiding op het starten van een WebshopWebshop Starten | je optimale voorbereiding op het starten van een Webshop
Webshop Starten | je optimale voorbereiding op het starten van een Webshop
 
Nieuwe corporate website Unique, van strategie naar nieuwe website
Nieuwe corporate website Unique, van strategie naar nieuwe websiteNieuwe corporate website Unique, van strategie naar nieuwe website
Nieuwe corporate website Unique, van strategie naar nieuwe website
 
Een nieuwe website laten maken
Een nieuwe website laten makenEen nieuwe website laten maken
Een nieuwe website laten maken
 
Je website als tool om je onderneming te laten groeien
Je website als tool om je onderneming te laten groeienJe website als tool om je onderneming te laten groeien
Je website als tool om je onderneming te laten groeien
 

Similaire à responsible webdesign

IAD 5 - les 1 - Context and challenges in mobile design
IAD 5 - les 1 - Context and challenges in mobile designIAD 5 - les 1 - Context and challenges in mobile design
IAD 5 - les 1 - Context and challenges in mobile design
Ferry den Dopper
 
IAD 5 - les 3 - Responsive Design
IAD 5 - les 3 - Responsive DesignIAD 5 - les 3 - Responsive Design
IAD 5 - les 3 - Responsive Design
Ferry den Dopper
 
Creative Industries: Trends 2 Mobile 07 05-2012
Creative Industries: Trends 2 Mobile 07 05-2012Creative Industries: Trends 2 Mobile 07 05-2012
Creative Industries: Trends 2 Mobile 07 05-2012
arnowilkens
 
3D lab gebruikersonderzoeken - Dedicon
3D lab gebruikersonderzoeken - Dedicon3D lab gebruikersonderzoeken - Dedicon
3D lab gebruikersonderzoeken - Dedicon
anke_eyck
 
3D lab gebruikersonderzoeken Dedicon
3D lab gebruikersonderzoeken Dedicon3D lab gebruikersonderzoeken Dedicon
3D lab gebruikersonderzoeken Dedicon
3Dproject
 

Similaire à responsible webdesign (20)

Whitepaper responsive design voor een betere ux
Whitepaper   responsive design voor een betere uxWhitepaper   responsive design voor een betere ux
Whitepaper responsive design voor een betere ux
 
INXCO / 9 fouten voor mobiele sites
INXCO / 9 fouten voor mobiele sitesINXCO / 9 fouten voor mobiele sites
INXCO / 9 fouten voor mobiele sites
 
Responsive webdesign
Responsive webdesignResponsive webdesign
Responsive webdesign
 
IAD 5 - les 1 - Context and challenges in mobile design
IAD 5 - les 1 - Context and challenges in mobile designIAD 5 - les 1 - Context and challenges in mobile design
IAD 5 - les 1 - Context and challenges in mobile design
 
IAD 5 - les 3 - Responsive Design
IAD 5 - les 3 - Responsive DesignIAD 5 - les 3 - Responsive Design
IAD 5 - les 3 - Responsive Design
 
Wegwijs smartphones en tablet pc's
Wegwijs smartphones en tablet pc'sWegwijs smartphones en tablet pc's
Wegwijs smartphones en tablet pc's
 
Responsive webdesign - wat is het en wat hebben verzekeraars eraan
Responsive webdesign - wat is het en wat hebben verzekeraars eraanResponsive webdesign - wat is het en wat hebben verzekeraars eraan
Responsive webdesign - wat is het en wat hebben verzekeraars eraan
 
Responsive webdesign
Responsive webdesignResponsive webdesign
Responsive webdesign
 
Apps voor mobiele toestellen
Apps voor mobiele toestellenApps voor mobiele toestellen
Apps voor mobiele toestellen
 
Joost van der Schee - Mobiel
Joost van der Schee - MobielJoost van der Schee - Mobiel
Joost van der Schee - Mobiel
 
Trends voor lokale websites
Trends voor lokale websitesTrends voor lokale websites
Trends voor lokale websites
 
Trends voor lokale websites
Trends voor lokale websitesTrends voor lokale websites
Trends voor lokale websites
 
Online Marketing
Online MarketingOnline Marketing
Online Marketing
 
Creative Industries: Trends 2 Mobile 07 05-2012
Creative Industries: Trends 2 Mobile 07 05-2012Creative Industries: Trends 2 Mobile 07 05-2012
Creative Industries: Trends 2 Mobile 07 05-2012
 
Ontwerpen voor mobiel
Ontwerpen voor mobielOntwerpen voor mobiel
Ontwerpen voor mobiel
 
Creativiteit Ten Top
Creativiteit Ten TopCreativiteit Ten Top
Creativiteit Ten Top
 
Presentatie 4 maart
Presentatie 4 maartPresentatie 4 maart
Presentatie 4 maart
 
AMIS Workshop Google Glass overview and demo
AMIS Workshop Google Glass overview and demoAMIS Workshop Google Glass overview and demo
AMIS Workshop Google Glass overview and demo
 
3D lab gebruikersonderzoeken - Dedicon
3D lab gebruikersonderzoeken - Dedicon3D lab gebruikersonderzoeken - Dedicon
3D lab gebruikersonderzoeken - Dedicon
 
3D lab gebruikersonderzoeken Dedicon
3D lab gebruikersonderzoeken Dedicon3D lab gebruikersonderzoeken Dedicon
3D lab gebruikersonderzoeken Dedicon
 

responsible webdesign

Notes de l'éditeur

  1. \n
  2. \n
  3. \n
  4. \n
  5. \n
  6. \n
  7. \n
  8. \n
  9. \n
  10. \n
  11. \n
  12. \n
  13. \n
  14. \n
  15. \n
  16. \n
  17. \n
  18. \n
  19. \n
  20. \n
  21. \n
  22. \n
  23. \n
  24. \n
  25. \n
  26. \n
  27. \n
  28. \n
  29. \n