Hello People Simon and I examined the possibility's to make tw accessible and first results are promising.
Last couple of day's I have familiarized myself with the workings of a screenreader and the accessibility development tools. In a couple of skype chats with Simon, we went through the TiddlyWiki and added the necessary changes. The changes are made with respect to the original vanilla tw for demo purposes although this could be changed later to fit better to a workflow in the screenreader. Here a demo: http://dl.dropbox.com/u/9670094/zandkasteel/accessibility.html There are two systems that can be used and we implemented both. First method: Headings and levels Imagine clicking through the page with the tab-key to get an overview of what is there. (like webform fields) The heading level provides an hierarchy. There are some rules: There needs to be one <h1> in the page and not more then two (and not on the same div). Implemented Heading-levels: SiteTitle <h1> Search, MainMenu, SideBar, Footer and Toolbar <h2> TiddlerTitle('s) <h3> Inner tiddler heading <h4> (no other headings bigger then !!!! should be used in this case) Also it's interesting to see how these can be hidden by the class assistive-text (see stylesheet). The Search, MainMenu, SideBar, Footer, TiddlerToolbar and TiddlerTitle are hidden for viewers this way but found by the screenreader. This should only be done on elements that are obvious for viewers b.t.w. http://dl.dropbox.com/u/9670094/zandkasteel/accessibility.html#AccessibilityTheme Second method: ARIA Landmark roles. The landmark roles is a small set of rules that can be placed on a <div>. Implemented like this in the demo tw: Banner <div class='header' role='banner' Search (for which I needed a new <div>) <div id='searchElement' role='search' Navigation <div id='mainMenu' role='navigation' <div id='sidebarOptions' role='navigation' Complementary <div id='sidebarTabs' role='complementary' Main <div id='displayArea' role='main'> Contentinfo <div id='contentFooter' role='contentinfo' To make things less complex we choose to implement the SinglePageModePLugin (and autopermalink), the SimpleSearchPLugin (so not all tiddlers are opened but only the titles). New are the div's: searchElement and contentFooter so they can have their own landmark-role (search and contentinfo). Compared to the validation of the Gmail page (which is known to be well accessible) we are doing slightly better, zero fails and less points of attention. The next action to make TiddlyWiki more accessible is to create shortcut key's for the toolbarcommands. I like to examine the possibility's and if someone knows a method out there or an alternative way to access the tiddlertoolbar functions with the keyboard (tab works...real key's like c=close) let us know. Bauwe -- You received this message because you are subscribed to the Google Groups "TiddlyWiki" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/tiddlywiki?hl=en.
