Het Nut Van Css

1,325 views

Published on

Het Nut Van Css

Published in: Technology, Education
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,325
On SlideShare
0
From Embeds
0
Number of Embeds
24
Actions
Shares
0
Downloads
10
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • Hallo, ik ben Paul van Buuren. Ik wil mijn 15 minutes of fame gebruiken om jullie te vertellen over mijn hobby en werk: style sheets.
  • Het Nut Van Css

    1. 1. H ET N UT VAN CSS , ofwel: de kunst van het P IXELNEUKEN STYLE SHEETS
    2. 2. De kracht van CSS: CSS Zengarden
    3. 3. CSS voor n00bs (1)
    4. 4. CSS voor n00bs (2)
    5. 5. CSS voor n00bs (3)
    6. 6. Verschillende media <ul><li>Vormgeving van webcontent voor: </li></ul><ul><ul><li>Browsers </li></ul></ul><ul><ul><li>PDA’s & mobiele telefoons </li></ul></ul><ul><ul><li>Print </li></ul></ul><ul><ul><li>Braille-apparaten, spraaksynthesizers </li></ul></ul><ul><ul><li>TV, projectors </li></ul></ul>
    7. 7. Cascading <ul><li>Meerdere style sheets in e en pagina </li></ul><ul><li>Meerdere r egels voor hetzelfde element </li></ul><ul><li>Piramide: uiteindelijk wint de meest specifieke definitie </li></ul>
    8. 8. Standaarden <ul><li>W3C: valide code / valide CSS </li></ul><ul><li>Webrichtlijnen ( www.webrichtlijnen.nl/richtlijnen/ ) </li></ul>
    9. 9. Gebod 1: <ul><li>Gij zult inhoud en vormgeving gescheiden houden </li></ul><ul><li>(tenzij het beter uitkomt, natuurlijk) </li></ul>
    10. 10. Gebod 2: <ul><li>Gij met elk type gebruiker rekening houden </li></ul><ul><li>(tenzij het beter uitkomt, natuurlijk) </li></ul>
    11. 11. Gebod 3: gebruik betekenisvolle code en namen <ul><li>Kunnen ‘mikken’ op de juiste elementen. </li></ul><ul><ul><li>ID: <div id=“header”> </li></ul></ul><ul><ul><li>Class: <div class=“blogpost”> </li></ul></ul><ul><li>Microformats: standaard opmaak voor vaak voorkomende elementen: </li></ul><ul><ul><li>hCard </li></ul></ul><ul><ul><li>hCalendar </li></ul></ul>
    12. 12. Browser: the four letter word of web design
    13. 13. Fronteers <ul><li>Vakvereniging van ‘frontend-programmeurs’ : CSS, JavaScript, xHTML </li></ul><ul><li>www.fronteers.nl </li></ul>
    14. 14. Case 1: screen layout
    15. 15. Case 1: handheld layout
    16. 16. Case 1: print layout
    17. 17. Case 2:
    18. 18. VOOR
    19. 19. NA
    20. 20. Het resultaat

    ×