Upgrade to Pro — share decks privately, control downloads, hide ads and more …

web building dyslexic a friendly

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.

SerenD

May 16, 2016
Tweet

More Decks by SerenD

Other Decks in Technology

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