Accessible Javascript - Barcamp Brighton 2

AccessibleJavascript

NotVodoo–notmuchDirkGinader

BarcampBrighton2h>p://blog.ginader.de

SemanCcMarkup

• MarkupyourContenttomakeitworkbyitself•  ThinkabouteveryelementanditsRole– HaveyoureallyfoundanewUseforDL?;‐)

ServersideInteracCon

•  EverythingyouwanttodousingJavascriptMagicyoufirsthavetosolvewithout

•  ThinkwhatyoucandowithPagereloads(yesIknowthey’renotthecoolKidsanymore…)

ProgressiveEnhancement

•  Everybodyshouldhaveheardaboutthisbynow.Doyou?

• WheneverythingworksstartaddingMagic

•  HijackExisCngElementsandaddnewFuncConality

•  AddnewControlsforJavascriptonly

CSS

•  PayA>enConwhatyouhide,howandwhen•  Display:noneandvisibility:hiddenarenotgenerallyuselessorevilbuto_en

UpdateandInform

•  (Most)ScreenReadersknowJavascript• MostoftheStuffactuallyworks,theyjustdon’tknow

• Makethemknowsomethingchangedbyseangthefocus()

•  UseahiddenFormElementtoforcetheScreenReaderrebuilditsVirtualBuffer

NotOnlyScreenReaders

•  ThinkaboutKeyboardonlyUsers•  TabyourApp.Doesitwork?•  DohiddenElementsShowonfocus?

GoodRessources

h>p://www.isolani.co.uk/blog/h>p://www.accessibilityCps.com/

h>p://juicystudio.com/

h>p://learningtheworld.eu/

h>p://uk.tv.yahoo.com/(TheSearchontheupperrightwasusedfortheExample)