web building dyslexic a friendly

My London Web Standards talk from 16th May 2016, where I cover some design and development techniques that you can use to help Dyslexics, which will also benefit other users.

Transcript

1. @ninjanails
   web building dyslexic a friendly
   LWS, May 2016
   

   View Slide

2. @ninjanails
   building a dyslexic friendly web
   LWS, May 2016
   

   View Slide

3. #DZY
   

   View Slide

4. http://geon.github.io/programming/2016/03/03/dsxyliea
   

   View Slide

5. http://geon.github.io/programming/2016/03/03/dsxyliea
   We don’t all
   experience this
   

   View Slide

6. Typography
   

   View Slide

7. Sans serif
   Even Comic Sans
   

   View Slide

8. blah blah
   

   View Slide

9. Don’t Underline all
   the things
   

   View Slide

10. HELLO WORLD
    #DZY
    

    View Slide

11. Moving text
    

    View Slide

12. Dyslexic fonts
    

    View Slide

13. Icon fonts
    Icon Fonts
    

    View Slide

14. Bold text
    

    View Slide

15. Bacon ipsum dolor amet porchetta spare ribs doner tail turkey kielbasa boudin
    prosciutto. Filet mignon corned beef ham shank salami kevin rump alcatra.
    Prosciutto bresaola filet mignon brisket boudin shank leberkas turkey. Pancetta
    meatloaf fatback bresaola landjaeger kielbasa.
    Meatloaf alcatra boudin sausage cupim jerky doner fatback salami. Bresaola chuck
    andouille tri-tip shoulder drumstick. Pancetta drumstick cow jowl. Meatball pork chop
    tongue shank boudin. Cupim ham hock drumstick shank hamburger bresaola
    pancetta turkey turducken shoulder strip steak tail beef ribs sausage pork loin.
    Pancetta chicken salami swine, picanha meatloaf filet mignon prosciutto shankle
    rump bacon boudin.
    Beef ribs pork chop pancetta drumstick biltong, bacon shoulder pig. Tail swine
    rump, kielbasa porchetta doner sausage pork belly chicken corned beef drumstick
    sirloin bresaola shank. Chuck andouille pastrami meatloaf, hamburger spare ribs
    rump strip steak. Meatloaf short loin jerky ground round strip steak tenderloin ham
    hock sirloin capicola frankfurter short ribs pastrami. Leberkas jowl sausage, capicola
    kevin drumstick ham hock ribeye landjaeger biltong ham spare ribs kielbasa
    pastrami.
    Justified text
    

    View Slide

16. Bacon ipsum dolor amet porchetta spare ribs doner tail turkey kielbasa boudin
    prosciutto. Filet mignon corned beef ham shank salami kevin rump alcatra.
    Prosciutto bresaola filet mignon brisket boudin shank leberkas turkey. Pancetta
    meatloaf fatback bresaola landjaeger kielbasa.
    Meatloaf alcatra boudin sausage cupim jerky doner fatback salami. Bresaola chuck
    andouille tri-tip shoulder drumstick. Pancetta drumstick cow jowl. Meatball pork chop
    tongue shank boudin. Cupim ham hock drumstick shank hamburger bresaola
    pancetta turkey turducken shoulder strip steak tail beef ribs sausage pork loin.
    Pancetta chicken salami swine, picanha meatloaf filet mignon prosciutto shankle
    rump bacon boudin.
    Beef ribs pork chop pancetta drumstick biltong, bacon shoulder pig. Tail swine
    rump, kielbasa porchetta doner sausage pork belly chicken corned beef drumstick
    sirloin bresaola shank. Chuck andouille pastrami meatloaf, hamburger spare ribs
    rump strip steak. Meatloaf short loin jerky ground round strip steak tenderloin ham
    hock sirloin capicola frankfurter short ribs pastrami. Leberkas jowl sausage, capicola
    kevin drumstick ham hock ribeye landjaeger biltong ham spare ribs kielbasa
    pastrami.
    Justified text
    

    View Slide

17. Bacon ipsum dolor amet porchetta spare ribs doner tail turkey kielbasa boudin
    prosciutto. Filet mignon corned beef ham shank salami kevin rump alcatra.
    Prosciutto bresaola filet mignon brisket boudin shank leberkas turkey. Pancetta
    meatloaf fatback bresaola landjaeger kielbasa.
    Meatloaf alcatra boudin sausage cupim jerky doner fatback salami. Bresaola chuck
    andouille tri-tip shoulder drumstick. Pancetta drumstick cow jowl. Meatball pork chop
    tongue shank boudin. Cupim ham hock drumstick shank hamburger bresaola
    pancetta turkey turducken shoulder strip steak tail beef ribs sausage pork loin.
    Pancetta chicken salami swine, picanha meatloaf filet mignon prosciutto shankle
    rump bacon boudin.
    Beef ribs pork chop pancetta drumstick biltong, bacon shoulder pig. Tail swine
    rump, kielbasa porchetta doner sausage pork belly chicken corned beef drumstick
    sirloin bresaola shank. Chuck andouille pastrami meatloaf, hamburger spare ribs
    rump strip steak. Meatloaf short loin jerky ground round strip steak tenderloin ham
    hock sirloin capicola frankfurter short ribs pastrami. Leberkas jowl sausage, capicola
    kevin drumstick ham hock ribeye landjaeger biltong ham spare ribs kielbasa
    pastrami.
    Line spacing - to little
    

    View Slide

18. Bacon ipsum dolor
    prosciutto. Filet mignon
    Prosciutto bresaola filet
    a meatloaf fatback bres
    Line spacing - to little
    

    View Slide

19. Bacon ipsum dolor amet porchetta spare ribs doner tail turkey kielbasa boudin
    prosciutto. Filet mignon corned beef ham shank salami kevin rump alcatra.
    Prosciutto bresaola filet mignon brisket boudin shank leberkas turkey. Pancetta
    meatloaf fatback bresaola landjaeger kielbasa.
    Meatloaf alcatra boudin sausage cupim jerky doner fatback salami. Bresaola chuck
    andouille tri-tip shoulder drumstick. Pancetta drumstick cow jowl. Meatball pork chop
    tongue shank boudin. Cupim ham hock drumstick shank hamburger bresaola
    pancetta turkey turducken shoulder strip steak tail beef ribs sausage pork loin.
    Pancetta chicken salami swine, picanha meatloaf filet mignon prosciutto shankle
    Line spacing - to much
    

    View Slide

20. Line spacing - just right
    Bacon ipsum dolor amet porchetta spare ribs doner tail turkey kielbasa boudin
    prosciutto. Filet mignon corned beef ham shank salami kevin rump alcatra.
    Prosciutto bresaola filet mignon brisket boudin shank leberkas turkey. Pancetta
    meatloaf fatback bresaola landjaeger kielbasa.
    Meatloaf alcatra boudin sausage cupim jerky doner fatback salami. Bresaola chuck
    andouille tri-tip shoulder drumstick. Pancetta drumstick cow jowl. Meatball pork chop
    tongue shank boudin. Cupim ham hock drumstick shank hamburger bresaola
    pancetta turkey turducken shoulder strip steak tail beef ribs sausage pork loin.
    Pancetta chicken salami swine, picanha meatloaf filet mignon prosciutto shankle
    rump bacon boudin.
    Beef ribs pork chop pancetta drumstick biltong, bacon shoulder pig. Tail swine
    rump, kielbasa porchetta doner sausage pork belly chicken corned beef drumstick
    sirloin bresaola shank. Chuck andouille pastrami meatloaf, hamburger spare ribs
    rump strip steak. Meatloaf short loin jerky ground round strip steak tenderloin ham
    hock sirloin capicola frankfurter short ribs pastrami. Leberkas jowl sausage, capicola
    kevin drumstick ham hock ribeye landjaeger biltong ham spare ribs kielbasa
    pastrami.
    

    View Slide

21. line length
    

    View Slide

22. #000 #fff
    

    View Slide

23. Pictures are great
    just don’t use too
    many of them
    

    View Slide

24. View Slide

25. Interaction
    

    View Slide

26. Simple and clear
    navigation
    

    View Slide

27. View Slide

28. Allow for errors
    

    View Slide

29. https://www.flickr.com/photos/lylevincent/15127035587/
    

    View Slide

30. @ninjanails
    serendavies.me
    ninjanails.com
    https://www.flickr.com/photos/jenosaur/4051305996/
    

    View Slide