Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Grids

775 views

Published on

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Grids

  1. 1. GridsBran van der MeerSenior Front-End Developer, Mirabeau
  2. 2. Agenda 2 / 57
  3. 3. 1. Introductie2. Typografie3. Grids4.Webdesign5. CSS6.Conclusies 3 / 57
  4. 4. 1. Introductie 4 / 57
  5. 5. Ik! 5 / 57
  6. 6. Bran van der Meer @branmovic http://bran.name/25jr, sinds 2005 in web developmentSinds juni 2011 bij Mirabeau 6 / 57
  7. 7. Grids 7 / 57
  8. 8. 2. Typografie 8 / 57
  9. 9. 9 / 57
  10. 10. Ordenen van tekst 10 / 57
  11. 11. 1. Lettertype2. Lettergrootte3. Regellengte4. Regelhoogte 11 / 57
  12. 12. 1. Lettertype2. Lettergrootte3. Regellengte4. Regelhoogte 12 / 57
  13. 13. 13 / 57
  14. 14. Begin 1200 14 / 57
  15. 15. 15 / 57
  16. 16. Canons of pageconstructionVillard de HonnecourtJ.A. van de GraafRaúl RosarivoJan Tschichold 16 / 57
  17. 17. Verticaal ritme 17 / 57
  18. 18. Ritme in muziek 18 / 57
  19. 19. Ritme in tekst 19 / 57
  20. 20. 20 / 57
  21. 21. 21 / 57
  22. 22. Alles uitlijnen opverticale ritme 22 / 57
  23. 23. 3. Grids 23 / 57
  24. 24. Balans 24 / 57
  25. 25. Typografie dicteertmaten en verhoudingen 25 / 57
  26. 26. Compositie vs precisie 26 / 57
  27. 27. 27 / 57
  28. 28. 28 / 57
  29. 29. 29 / 57
  30. 30. Een grid…Is geen doel op zich 30 / 57
  31. 31. Een grid…Moet leven 31 / 57
  32. 32. Een grid…Articuleert typografischeelementen 32 / 57
  33. 33. Een grid…Brengt elementen vandesign in relatie tot elkaar 33 / 57
  34. 34. Een design met grid…Zal rustiger overkomen 34 / 57
  35. 35. Een design met grid…Is beter scanbaar 35 / 57
  36. 36. 4. Webdesign 36 / 57
  37. 37. Design argumenten? 37 / 57
  38. 38. Typografie experts 38 / 57
  39. 39. Anno nu 39 / 57
  40. 40. 40 / 57
  41. 41. Front-End Developer isbrowser & devices expert 41 / 57
  42. 42. Kies samen het grid! 42 / 57
  43. 43. Visual Designer ♥Front-End Developer 43 / 57
  44. 44. 5. CSS 44 / 57
  45. 45. Teveel tools 45 / 57
  46. 46. one-size-fits-all? 46 / 57
  47. 47. CSS3 Layout modules 47 / 57
  48. 48. 48 / 57
  49. 49. 49 / 57
  50. 50. 6. Conclusies 50 / 57
  51. 51. Grid vanuit typografie 51 / 57
  52. 52. “Het typografisch grid geeft aan hoede maten en verhoudingen in hetdesign zijn georganiseerd.”Dit geldt voor zowel de horizontaleverdeling in kolommen als de verticaleafstanden op basis van hetregeltransport.– Henk Haaima, Principal Art Director, Mirabeau 52 / 57
  53. 53. Samen ontwikkelen! 53 / 57
  54. 54. Verantwoordelijkheidligt bij iedereen! 54 / 57
  55. 55. thegridsystem.org 55 / 57
  56. 56. Dank! 56 / 57
  57. 57. Vragen? @branmovic 57 / 57

×