Using Superfish Menus in Drupal - Ray Ositis, iSchool

• Looking Ahead: What Topics Could We Focus On In the Coming Year?
  • Menus
    • Seem to be a major puzzle area. How do you design a menu that works for mouse-users, voice browser users, speech recognition users, and keyboard only users?
  • Video accessibility
    • IBM's Pawan Khera is still interested in coming to the UW to talk about IBM's AbilityLab Media Captioner and Editor
    • 3Play Media (http://www.3playmedia.com/) offers some nice transcription and captioning services
    • How can we help make captioning a normal step in the workflow of video creation?
  • User testing for accessibility
    • iSchool as putting together a portable usability lab and would like to include accessibility as one of the things they test for
  • Other Higher Ed Web sites
    • How are we doing in comparison with our peers?
    • Terrill Thompson's study of the accessibility of higher education Web sites should become available on the Web in a few months
  • Central UW tool to check accessibilty and usability
    • SiteCheck being evaluated
    • Could AccessibleWeb@U help explain results and process?

• Using the Superfish Menus in Drupal - Ryan Ositis, iSchool Web Administrator and Developer
  • iSchool site is at http://ischool.uw.edu/
  • iSchool needed to update their custom CMS
    • Wanted more and more features, hard to keep up
    • Decided in February it was time, partly in response to RBI initiative
  • Wanted a new CMS
    • Need something that will do everything they already had with their old system
    • What additional features can a new system provide?
    • Can our developers work with it with a minimum or retraining?
      • Drupal is built on PHP, which the iSchool Web staff was already familiar with
    • Drupal (http://drupal.org ) looked good
      • Strong, active community
      • Modular structure
      • Feature rich
      • Commitment to accessibility and security
        • Have strong statement on commitment to accessibility (http://drupal.org/about/accessibility ) on their Web site
    • Decided to go with Drupal
  • Superfish Menus Module (http://drupal.org/project/superfish)
    • Derived from Suckerfish menu originally published by Patrick Griffiths and Dan Web on A List Apart (http://www.alistapart.com/) in 2003
    • In working with Drupal modules, had already learned that, if you want a new feature, you should first go look for a module that already contains the feature, rather than trying to hack code.
    • Installation
      • Simple to install
      • Does not require any other modules
      • Unpack and copy folder into /sites/all modules folder
        • Versions available for Drupal 6 and Drupal 7
      • Run update.php (standard procedure for adding modules)
      • Go to modules menu, turn on Superfish menu
      • Configure menu
      • Go to Blocks menu to put the menu in a content block
        • You can have multiple menus, iSchool has a dozen different menus
        • For each Superfish menu, many configuration options are available - menu type (navbar, horizontal, vertical, mouse delay, drop shadows, etc.
      • Can control which pages a given menu appears on; useful for larger sites
    • Behavior
      • Users like menus, but most are dependent on mouse. Superfish can be navigated entirely with keyboard by using tabs and back-tabs
      • With Safari, did not work that well unless you change the settings
        • See "Enabling keyboard nvaigation in Mac OS X Web Browsers" 456bereastreet.com (http://www.456bereastreet.com/archive/200906/enabling_keyboard_navigation_in_mac_os_x_web_browsers/)
  • Pitfalls
    • Its a menu, not a panacea
    • Issues with jQuery plugin can impact module. Especially true with Internet Explorer and the z-index, but solutions are readily available in the Drupal community.
    • CSS for customizing can be tricky and takes time. Make sure to budget extra time for customizing

• Discussion
  • Would be nice to have more controls, such as being able to navigate with arrow keys
    • Some screen reader software uses arrow keys, easy to step on toes
    • Code to make it work with arrow keys can break
  • Top level of menu items are all h4s, which most screen readers can find and go directly to
  • Could define access keys (http://webaim.org/techniques/keyboard/accesskey ), but there are no real standards
    • How do you tell users what access keys are available
    • Whatever you set up is likely to conflict with keys assigned by software
  • Carousel on the iSchool home page(http://ischool.uw.edu/ )
    • Custom coded in jQuery, it is a version 1.0; the team still has many more ideas they want to implement
    • Want to make it more accessible; already can tab through news stories
    • Do provide an All Features link to a simple list of the news items; could be put in front of carousel in tab order
    • Carousels are in general a "weird accessibility gap"; none of the readily available versions do well
    • There is a need for cool things on home pages, but tend to be used for pictures and other stuff that does not have much value
      • Do people really use carousels? Apparently not much.
    • Some carousels are connected to direct actions (apply now, buy this)
      • Example: Lethbridge College drupal site http://www.lethbridgecollege.ca/
        • Much more action focused
  • iSchool site to a degree is experimental, always trying things
  • Statistics
    • Drupal has modules that will give you all sorts of statistics; search keywords, referrers, performance statistics, accesslogs
    • There is a Drupal module that hooks everything into Google Analytics, generating the proper code for each page
  • Relying on UW Groups service (https://wiki.cac.washington.edu/display/infra/Groups Service ) for who can do what on the Web site
  • Evaluating Accessibility
    • Have a couple of tools similar to W3C validator
      • Need to work on use of headings
  • Had Drupal Interest Group meeting in Fall; 40 people attended,
    • iSchool Web team wants to work with that group
    • Particularly interested in accessibility of Drupal sites
  • Adopting a CMS
    • Moving school onto a CMS is a huge shift in thinking
      • Old method is to have static page templates, give out copies
      • Have moved to a distributed authorship model; has changed workflow and roles for many groups
      • Content providers get a window they can put content into; more limited role, but creates accessible pages if set up right
  • For image management; one reason for going to Drupal is there were people who wanted to add images on the fly
    • Modules can be set up to enforce requirement for alt text
    • TinyMCE (http://drupal.org/project/tinymce ) and IMCE (http://drupal.org/project/imce ) together can be configured to prompt for alt texts

• Go Around
  • Global Health (http://depts.washington.edu/deptgh/index.php) is going to Drupal and WordPress
  • Interest in mobile designs
    • Can it help push sites to simple functionality?
      • Dylan Wilbanks reports that he has heard several talks by top Web designers recommending that all new Web sites should be built first to work with mobile devices, then secondarily for big screens.
    • What does mobile design mean?
      • What are the criteria of a site designed for mobile access?
      • Fully readable and navigable without zooming?
        • Seems to involve flex designs (designs built with relative sizing) to give mobile device greatest flexibility to display page
    • Are there guidelines to mobile design?
      • A lot of stuff out there is woefully out of date, particularly the stuff that recommends hacking out most of your content
      • Current smartphones have very good browsers, can easily display full pages; how readable the pages are depends on the site design.
        • Rigid designs (wide, fixed width, fixed font sizes) will require a lot of zooming and scrolling
    • How does Mobile design relate to accessible design?
      • Simple navigation and content organization
      • What else?

Revisioning the uw.edu/accessibility Web Site

AccessibleWeb@U Meeting
May 26, 2010

• What should be on the http://uw.edu/accessibility/ site?
  • First we took a tour through the current site
    • Need to update W3C and 508 information
    • Some controversy whether the DIS guidelines apply to us
    • Accessibility policies at other higher education needs review and update. List currently on site is a bit old
    • Web Accessibility page defines what accessible Web design is about.
    • Procurement information is a bit out-of-date. Purchasing has not taken much interest.
    • IT Tools and Resources page is fairly up-to-date (Terry has been working on it).
      • We have an ARIA page but it is out-of-date
    • Link to other disability resources on campus
    • Frequently asked questions, mostly about how someone gets accessibility support
    • Getting Help - repeats much of what is in the FAQ page
  • Discussion
    • Need to review the Procurement information because of the new eProcurement system, which does offer energy efficient hardware, but not accessibility
    • Be nice to have AccessibleWeb@U more visible
      • UW Inclusion Network email list was just created. Might want to connect/include them
    • Who is the audience for this site?
      • People who do not understand accessibility
      • Technical people who want to know more about it
      • People who are sent here because they want to buy accessible stuff
      • Intent was to be the go-to resource for information, particularly technology
        • A resource that could be useful as a place to send people
      • More people are building sites with WordPress, Plone, or Drupal
        • Standard designs are being created that can be shared access the systems
        • Many people simply put content into an existing environment
      • There are still many people at college and school level hand managing their Web sites
        • Pharmacy still does not have a Web person
        • The new model of centrally administered CMS with distributed people providing and maintaining content is only just arriving.
      • We should visit the major ones at least every couple of years
        • Drupal
        • Plone
        • SharePoint
        • WordPress
      • Need to connect with people who are making decisions on how to set up CMSs and blog sites
        • Want to have ideas on which templates, widgets are more accessible
        • Would break into two groups - people setting up CMSs and blogs and people managing content in CMSs and blogs
      • Could we connect better with other people working on accessibility at the UW
        • Get feedback from UW Inclusion Network people
        • Groups are meeting regularly, meeting on Thursdays at 7pm seem to be the most active, but has a big social aspect
        • Planning is underway for an accessibility camp, but when is not clear
      • Should uw.edu/accessibility be a portal for accessibility for the entire campus?
        • Different groups addressing accessibility all have their own Web sites, each from their own perspective
        • What could this site be in the way of a general accessibility portal for all of the UW?
      • Could we be one of the first sites into the new Plone site? We should talk to Gina.
    • Topic for discussion: Accessibility issues of information architecture of page templates (including their site level navigation), the content placed within the template, and the relationship between the two
    • Short term project: Can we fit the YUI keyboard navigable menu into the Marketing page template.

Updates to Section 508 Guidelines and Standards

Topic: Reviewing proposed updates in the Section 508 guidelines and standards
(http://www.access-board.gov/sec508/refresh/draft-rule.htm)

Speaker: Terrill Thompson, Technology Accessibility Specialist, UW-IT

• Section 508 is an amendment in 1998 to the Rehabilitation Act
  
  
  • Requires access to electronic and information provided by the Federal government
  • Standards were written by the Access Board to clarify what it meant, published in Federal Register on December 21, 2000
    
    
    • http://www.access-board.gov/sec508/standards.html
    • Clear, consistent, rule expressed language
    • Web accessibility included
      
      
      • Informed by the WCAG priority 1 checkpoints
      • 16 standards statements
      • Very HTML-centric
    • Comparing with WCAG guidelines
      
      
      • Web Content Accessibility Guidelines (WCAG)
      • Authoring Tool Accessibility Guidelines (ATAG)
      • User Agent Accessibility Guidelines (UAAG)
    • WCAG 2.0 has supporting documents
      
      
      • Techniques for WCAG 2.0
      • How to Meet WCAG 2.0
      • Understanding WCAG 2.0
      • The WCAG 2.0 Documents
  • Does 508 apply to us?
    
    
    • 508 as written applies explicitly to federal agencies
    • State Guidelines - Accessibility to Information Technology for Individuals With Disabilities - http://isb.wa.gov/policies/1000g.doc (Word)
      
      
      • Adopted by ISB, May 2005
      • Says it applies to educational institutions
      • Adopts Section 508 standards + WCAG 2.0 for Web
  • We are required to provide accessible programs and services for other reasons
    
    
    • Section 504 of the Rehabilitation Act of 1973
    • Americans with Disabilities Act of 1990
    • Section 508 is a standard written into law that might be used by courts as a gauge of current practice
    • The UW does recognize that being sued over accessibility is a potential risk for the university
    • Section 255 of Telecom Act of 1996
      
      
      • Requires telecommunications equipment manufacturers and service providers to make their products and services accessible
• The refresh of 508 guidelines and standards
  
  
  • Access Board assembled the Telecommunications and Electronic and Information Technology Advisory Committee (TEITAC) to update 508 and 255 standards and guidlines
  • TEITAC recommendations presented April 2008
  • Accepting public comment through June 21, 2010
  • More info at www.access-board.gov/508.htm
• Information and Communication Technology (ICT) Standards & Guidelines
  
  
  • Reviewing chapter organization, it is not clear which are the operative parts and which are explanatory
  • Hard to extract the standards from the text and translate it to how it would apply to what we are doing
  • Significantly changed how it is organized - original version was much easier to point to specific rules
  • Level of detail is higher but consistency of editing is worse
  • Numbering and organization takes getting use to; some items are recursive, lowest levels referring to higher levels
  • Advisory content boxes help explain rules and give many examples, but sometimes occur before the rules they explain
  • Each of the two introductory chapters (one for ICT and one for telecommunications and VoIP) have detailed glossaries
• Section E107: Harmonization with W3C Guidelines
  
  
  • Section E107 states that goal is harmonization with WCAG 2.0
  • If web pages meets WCAG 2.0 then they comply, as long as they also conform with 409, 413, 606.4, 604.5, 607, 608
    
    
    • user platform preferences (409)
    • authoring tool standards ( 413)
    • real-time video description (604.4 and 604.5)
    • user controls for captions and video descritption (607)
    • user controls to adjust foreground and background sound independently (608) - not widely supported at this time
  • Authoring Tool and User Agent guidelines are integrated throughout, but ATAG and UAAG are not explicitly referenced (both are under revision at W3C)
• Section E108: Best Meets
  
  
  • Odd title, an example of occasionally creative language use in the document
  • "agency must produce the product that best meets the provisions of this part, consistent with the business needs of the agency"
  • Essentially an exception or loophole
• What can we do?
  
  
  • Terry is working on a First Impressions of ICT Accessibility Standards and Guidelines statement that he hopes to submit as a comment on the draft guidelines before June. Please review his statement and post any comments to the AccessibleWeb@U email list.
  • With so few exceptions, we could just focus on WCAG 2.0 since it seems better documented, at least so far

March 25, 2010 Meeting Notes

Disability Studies at UW: What is it, How did it Develop, and What We Hope To Do?

Dennis Lang, Associate Director, Disability Studies

• The Disability Studies program is a multi-campus, interdisciplinary program exploring society's understanding of disability
  
  • Web site is at http://depts.washington.edu/disstud/
  • Inspired in part by the Society for Disability Studies http://www.disstudies.org/
  • Topics studied include "the cultural construct of disability, social justice, and disability policy, and the intersections of disability, race, gender, sex, age, class and other markers of diversity and difference."
    
    • Social justice
    • Policy
    • Law, society, and justice
    • Comparative ideas
    • Dance
    • Business
  • Currently, Disability Studies offers two courses of study:
    
    • Disability Studies Minor
    • Individualized Studies Major in Disability Studies
  • The program has recently received a limited amount of permanent funding.
  • Faculty participating in the program are from many departments
    
    • Rehabilitation Medicine, Law, Slavic Languages and Literature, American Sign Language, Philosophy, Social Work, Education, Civil and Environmental Engineering, History, Comparative History of Ideas (CHID)
  • Currently has about 20 students a quarter
• Disability Studies is currently exploring moving their Web site to Drupal
  
  • Hoping for easier site management, accessible design, and tools that will help build social connections
  • Discussion:
    
    • Drupal out-of-the-box is very standards compliant and thus generally starts out as reasonably accessible and intelligible to assistive technologies
      
      • However, it is easy to add modules or make modifications that interfere with accessibility
    • Drupal offers many modules supporting social interactions, such as new feed generators and news feed readers. You can weave interconnections with other sites that go beyond simple links.
    • Drupal does require management. Security updates come out regularly. The site manager is informed about the updates and it is wise to install them.
    • Drupal has a customization system based on "intercept and override" where the default site settings and configurations are intercepted and overridden by customizations, leaving the core installation unmodified. This approaches allows core installation updates without disturbing the customizations (usually).
    • A large number of themes are available. They are installed by placing them in specific subdirectories and then selecting them from the administrator menus
    • The Zen theme (http://drupal.org/project/zen) is a very standards-compliant Drupal them that is well documented and flexible
• The UW Standing Committee on Disability Issues is being rejuvenated. Dennis is looking for people who are interested in serving on the committee. Contact him at 206-522-3104 or dlang@u.washington.edu for more information.
• Sushil K. Oswal, Ph.D. Assistant Professor of Rhetoric and Technical Communication in the Interdisciplinary Arts and Sciences Program at UW Tacoma is interested in studying the topic of accessibility. Anyone interested in working with him can contact him at 253-692-4308 or oswal@u.washington.edu.

February 25, 2010 Lunch Meeting

Our lunch group was small but the sharing was spirited. Here are some of the topics we discussed:

1. Thoroughly Updated VoiceOver for Macs
   
   
   • VoiceOver in Mac OSX Snow Leopard is much improved over previous versions and includes lots of new features.
   • Why buy expensive software like JAWS when in many cases VoiceOver will give you good workable accessibility to a wide range of sites?
   • http://www.apple.com/accessibility/voiceover/
2. Conferencing Software is Not Very Accessible
   
   
   • Conrad Kuehn of CEC/IT, Rehabilitation Medicine is exploring the use of conferencing software for instruction and is finding that most are not designed with the disabled in mind.
   • Basic paradigm of interactive video conferencing is hard to translate into an accessible form. Would you want voice software to be reading the text a PowerPoint slide at the same time a speaker is talking about the slide?
   • Some basic conferencing software such as Talking Communities (http://talkingcommunities.com/) works, but functionality is limited.
3. Time for a UW Accessibility Gathering?
   
   
   • Many groups on campus are doing very good work in the area of accessibility:
     
     
     • Disability Services Office http://www.washington.edu/admin/dso/
     • DO-IT http://www.washington.edu/doit/
     • Computer Science and Engineering projects
       
       
       • MobileASL - http://mobileasl.cs.washington.edu/
       • MobileAccessibility - http://mobileaccessibility.cs.washington.edu/
       • Tactile Graphics - http://tactilegraphics.cs.washington.edu/
       • WebInSight - http://webinsight.cs.washington.edu/
     • Rehabilitation Medicine Center for Technology and Disability Studies http://uwctds.washington.edu/index.asp
     • Disability Studies Program http://depts.washington.edu/disstud/
     • UW Change http://change.washington.edu/
     • Disability Advocacy Student Alliance - http://students.washington.edu/dasa/
     • Disability Law Alliance http://www.law.washington.edu/dla/
   • We don't have to import world class experts, they already are here!
   • How could we bring people together, help make connections, and ignite some synergy?
4. HTML5 Struggles to Include Accessibility
   
   
   • Wendy Chisholm is following the HTML5 discussions
   • One point of contention is whether summary attributes in table elements should exist. Many developers do not use them, the information they contain is hidden from most users.
   • Editor of HTML5 project does not seem to have an inclusive mindset
   • Apple is betting the farm on HTML5 (as opposed to Flash). Apple has a fairly good record on accessibility; maybe Apple could take some stands on including accessibility in HTML5
   • Important to get the HTML5 features right before it develops installed inertia
5. Noise to Signal Ratio Going Up on Tools
   
   
   • Tools once noted for their simplicity and usefulness are being subverted, raising the noise level
     
     
     • Google searchs get large numbers of aggregator sites (tripadvisor, yelp, etc) rather than what you are actually looking for. Many of the intermediary sites have no meaningful content, but they know to rank high.
     • Social networking tools are easily subverted by meaningless postings.

Using Free Voice Browsers to Evaluate Web Sites

January 28, 2010

Topic: Using Free Voice Browsers to Evaluate the Accessibility of Web Sites
Speaker: Wendy Chisholm, Technology Research Consultant, DO-IT
Date: Thursday, January 28, 2009
Time: 11:30a.m. - 1:00p.m.
Location: Allen Auditorium

Wendy Chisholm demonstrated the use of two free voice browsers, WebAnywhere (http://webanywhere.cs.washington.edu/wa.php) and NVDA (http://www.nvda-project.org/) to evaluate the accessibility of Web sites.

• NVDA
  • Non Visual Desktop Access (http://www.nvda-project.org/)
    • Documentation is at http://www.nvda-project.org/wiki/Documentation
  • Runs on Windows
  • Free to download
  • Using FireFox 3, has support of ARIA
    • On sites that use ARIA, Firefox and NVDA can communicate on what is on the page
    • ARIA - Accessible Rich Interface Application (http://www.w3.org/WAI/intro/aria)
      • Useful when using Javascript to define roles
      • By using ARIA in setting up a Javascript-based menu, can have standard interaction practice (moving around in menus with arrow keys, leaving menu with ESC, etc.).
  • NVDA is in active development
    • ARIA features are comparable to those in JAWS and WindowEyes
  • Users have many different techniques for using a voice browser on a page
    • Can configure NVDA to set how much information it should give you about each element you visit (clickable, etc.)
      • Useful to get maximum information when you are developer, but may want less info when just browsing
    • At any time a user can hear the headings on a page; each time you press H you go to the next heading
      • Page developers can negate the headings feature; often headings are created just visually, not as h-elements, so not recognizable as headings
    • Can jump down through lists on a page; press L to go to next list
    • For sighted users (such as people with dyslexia) using mouse, NVDA speaks elements as the user mouseovers them
    • Text must be in markup to be read; NVDA cannot read text in graphics
  • Reads ALT tags on graphics
  • Does not seem to have a way to highlight element that currently has focus
  • Can select among various voices for the voice synthesizer
• WebAnywhere
  • Located at http://webanywhere.cs.washington.edu/wa.php
    • Can be used from anywhere you have a Internet connection to view most sites
    • WebAnywhere is a proxy; your connection to a site is routed through WebAnywhere, processed, and the result passed to your browser
    • WebAnywhere can't do Flash, yet
    • WebAnywhere can only communicate with what the browser gives it through the DOM
  • Wendy is working on the team continuing to develop WebAnywhere
    • Feature set is fairly simple
    • No ARIA support yet
  • Designed to make it very obvious where you are on a page
    • Creates high contrast, large font experience
    • Very nice for demonstrating to people what is happening when a person is browsing a Web page with a voice browser
  • Most of the WebAnywhere features are in NVDA, but NVDA has many more features
• General Discussion
  • On search fields that offer multiple scoped searches, why do we always put radio buttons for selecting which search below the search field; to use it you select which search and then put text in the search field, but the code is in the opposite sequence
  • Enough people are using headings within their Web pages that it is becoming a common way to navigate people using screen readers navigate pages
    • Most Web design is based on Graphical User Interface (GUI); we do not have a Audio User Interface (AUI) set of concepts articulated yet (We need a grad student to pull together a AUI)
  • NVDA is rapidly gaining popularity; the hope is that people will use NVDA use it instead of JAWS, which is expensive.
  • VoiceOver on Apple stuff
    • VoiceOver on the iPhone is very good, one of the best AUIs out there; http://www.apple.com/accessibility/iphone/vision.html
    • VoiceOver on Macs is also very good; http://www.apple.com/accessibility/voiceover/
• New Toolbar
  • E.A. Draffan invites us to try the JISC TechDis Toolbar; http://access.ecs.soton.ac.uk/ToolBar/
  • Available as a downloaded app or as a temporary toolbar you can load anytime by going to a URL
  • Speaks with a Scottish accent