Your SlideShare is downloading. ×
0
WEBRICHTLIJNEN
 FUN FOR THE WHOLE font-family!
Webrichtlijnen
De

       in de praktijk


       Stephen Hay, Cinnamon Interactive
Ik heb geen
blinde
gebruikers.
Ik gebruik
<div>’s en
alt-tags
This
This
“
Daar word
ik niet
vrolijk van.
Kwaliteit.
 Duurzaamheid
Standaarden
 W3C specs
    WCAG 1.0
         ISO HTML
Unobtrusive Javascript

+    Conditional comments
                  [...]

best
practices.
Problemen?
Problemen?
  CMS’en
Problemen?
  CMS’en
    Editors/IDE’s
Problemen?
  CMS’en
    Editors/IDE’s
       Gebrek aan kennis
Kansen.
Kansen.
 Verbeterde CMS’en
Kansen.
 Verbeterde CMS’en
Tool-onafhankelijk ontwikkelen
Kansen.
 Verbeterde CMS’en
Tool-onafhankelijk ontwikkelen
        Kennisontwikkeling
0
125
5
stappen
No frames.
Syntactisch
correcte code,
strict DOCTYPE.
Semantisch
correcte code.
<div id=quot;page_titlequot;>Plannen</div>
<div id=quot;page_contentquot;>
<div id=quot;introquot;>
   <p class=quot;wordq...
<div id=quot;page_titlequot;>Plannen</div>
<div id=quot;page_contentquot;>
<div id=quot;introquot;>
   <p class=quot;wordq...
<div id=quot;page_titlequot;>Plannen</div>
<div id=quot;page_contentquot;>
<div id=quot;introquot;>
   <p class=quot;wordq...
Progressive
enhancement.
Permanente, unieke
(en leesbare) URLs.
http://example.com/?id=3835&pid=57829&rid=378952&qid=874528&sid=JVWJJ@*UJ@*H
http://example.com/?id=3835&pid=57829&rid=378952&qid=874528&sid=JVWJJ@*UJ@*H




             http://example.com/nieuws/20...
Be
the user.
eer?
http://webrichtlijnen.overheid.nl/
http://drempelvrij.nl/webrichtlijnen
kthxbye

www.the-haystack.com/presentations/gilde2007
Web guidelines in practice
Web guidelines in practice
Web guidelines in practice
Web guidelines in practice
Web guidelines in practice
Web guidelines in practice
Web guidelines in practice
Web guidelines in practice
Web guidelines in practice
Web guidelines in practice
Web guidelines in practice
Web guidelines in practice
Upcoming SlideShare
Loading in...5
×

Web guidelines in practice

1,661

Published on

Presentation for Dutch front-end developers association Fronteers, on the most important real-world aspects of the Dutch Web Guidelines. *The first slide in Comic Sans was intentionally bad.*

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
1,661
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
4
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "Web guidelines in practice"

  1. 1. WEBRICHTLIJNEN FUN FOR THE WHOLE font-family!
  2. 2. Webrichtlijnen De in de praktijk Stephen Hay, Cinnamon Interactive
  3. 3. Ik heb geen blinde gebruikers.
  4. 4. Ik gebruik <div>’s en alt-tags
  5. 5. This
  6. 6. This
  7. 7. “ Daar word ik niet vrolijk van.
  8. 8. Kwaliteit. Duurzaamheid
  9. 9. Standaarden W3C specs WCAG 1.0 ISO HTML
  10. 10. Unobtrusive Javascript + Conditional comments [...] best practices.
  11. 11. Problemen?
  12. 12. Problemen? CMS’en
  13. 13. Problemen? CMS’en Editors/IDE’s
  14. 14. Problemen? CMS’en Editors/IDE’s Gebrek aan kennis
  15. 15. Kansen.
  16. 16. Kansen. Verbeterde CMS’en
  17. 17. Kansen. Verbeterde CMS’en Tool-onafhankelijk ontwikkelen
  18. 18. Kansen. Verbeterde CMS’en Tool-onafhankelijk ontwikkelen Kennisontwikkeling
  19. 19. 0
  20. 20. 125
  21. 21. 5 stappen
  22. 22. No frames.
  23. 23. Syntactisch correcte code, strict DOCTYPE.
  24. 24. Semantisch correcte code.
  25. 25. <div id=quot;page_titlequot;>Plannen</div> <div id=quot;page_contentquot;> <div id=quot;introquot;> <p class=quot;wordquot;><font style=quot;font-size: 12px;quot;><strong>Plannen 2008</strong> </font></p> <p class=quot;wordquot;><font style=quot;font-size: 12px;quot;></font></p> <p class=quot;wordquot;><font style=quot;font-size: 12px;quot;>&nbsp;</font></p> <p class=quot;wordquot;><font style=quot;font-size: 12px;quot;>Blah blah...</p> [...]
  26. 26. <div id=quot;page_titlequot;>Plannen</div> <div id=quot;page_contentquot;> <div id=quot;introquot;> <p class=quot;wordquot;><font style=quot;font-size: 12px;quot;><strong>Plannen 2008</strong> </font></p> <p class=quot;wordquot;><font style=quot;font-size: 12px;quot;></font></p> <p class=quot;wordquot;><font style=quot;font-size: 12px;quot;>&nbsp;</font></p> <p class=quot;wordquot;><font style=quot;font-size: 12px;quot;>Blah blah...</p> [...] <h1>Plannen</h1> <div id=quot;page-contentquot;> <h2>Plannen 2008</h2> <p class=quot;inleidingquot;> [...] </p> [...]
  27. 27. <div id=quot;page_titlequot;>Plannen</div> <div id=quot;page_contentquot;> <div id=quot;introquot;> <p class=quot;wordquot;><font style=quot;font-size: 12px;quot;><strong>Plannen 2008</strong> </font></p> <p class=quot;wordquot;><font style=quot;font-size: 12px;quot;></font></p> <p class=quot;wordquot;><font style=quot;font-size: 12px;quot;>&nbsp;</font></p> <p class=quot;wordquot;><font style=quot;font-size: 12px;quot;>Blah blah...</p> [...] <h1>Plannen</h1> <div id=quot;page-contentquot;> <h2>Plannen 2008</h2> <p class=quot;inleidingquot;> [...] </p> [...]
  28. 28. Progressive enhancement.
  29. 29. Permanente, unieke (en leesbare) URLs.
  30. 30. http://example.com/?id=3835&pid=57829&rid=378952&qid=874528&sid=JVWJJ@*UJ@*H
  31. 31. http://example.com/?id=3835&pid=57829&rid=378952&qid=874528&sid=JVWJJ@*UJ@*H http://example.com/nieuws/2007/gilde/oprichtingscongres/
  32. 32. Be the user.
  33. 33. eer? http://webrichtlijnen.overheid.nl/ http://drempelvrij.nl/webrichtlijnen
  34. 34. kthxbye www.the-haystack.com/presentations/gilde2007
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×