AccessibleWeb@U Meeting, July 23, 2009, Allen Auditorium
This meeting was a Talkabout; an agenda created on the spot (and modified dynamically) and discussions that go where they needed to go.
- Reviewed new DOIT video about accessible design
- Draft version is at http://uwtvftp.cac.washington.edu/3267DOIT?login=UWTVFTPUser:getmyfile
- We felt it was a good overall statement of what accessible design is about
- The final movie will be available through DOIT and UWTV soon
- New UW templates are coming
- The Web Council met this morning to hear progress on the new Web look for UW sites. HTML and CSS should be available by sometime in September.
- Puzzle of site design development process: Why are accessibility
considerations coming so late in the process?
- Professional design process now often involves doing mockups with
Photoshop, getting approval, then handing the Photoshop file to a
coder
- A variety of PSD to HTML conversion software and methods are available. See... http://net.tutsplus.com/site-builds/from-psd-to-html-building-a-set-of-website-designs-step-by-step/
- The method can work if both the designer and the coder are knowledgeable in accessibility and usability considerations in Web design
- On the other hand, the process can produce fiat accompli designs
that are hard to make usable or accessible
- Narrow scope thinking in each step can miss opportunities for better design or deliver non-negotiable features to the next stage in the process
- Design thinking insensitive to Web technology can result in features that can only be created with coding kludges (non-semantic markup, place-holder objects, complex div structures, etc.) which defeat accessibility and usability goals
- Design conventions (habits) tend to be used to justify less usable/accessible design; it is safer to do what other people are doing (such as fixed width, fixed font-size, low contrast design) rather than use a goal-oriented criteria-based design process
- Best design process has the following:
- Clearly stated usability and accessibility goals, such as contrast, semantic markup, intelligible flow of content, and simple structure
- Good, on-going communication between customer, designer, coder, and tester
- People in the team with good knowledge of usability/accessibility who are empowered to direct attention to any problems and work with team toward good solutions
- Professional design process now often involves doing mockups with
Photoshop, getting approval, then handing the Photoshop file to a
coder
- "Flexible Web Design: Creating Liquid and Elastic Layouts with CSS" by
Zoe Gillenwater
- Dylan is currently working his way through the book and recommends it
- Flexible designs work better on a wider range of devices and allow the user more control of how they interact with the site, such as by scaling to an appropriate font size for their needs
- Scripting issues and developments
- Designing for mobile devices
- Good structural flow helps; zooming in and out and scrolling around is time consuming
- Buttons and other clickable areas should have sufficent size
- Scripting needs to consider limited scripting feature set of
many phones
- Google is now offering the iPhone User Interface (http://code.google.com/p/iui/) to faciliate creating sites with Google features for iPhones
- Progressive enhancement (PE) scripting has major accessibility
benefits
- PE methods usually involve scripting that operates on html content, such as displaying content in an unordered list as a menu. If the scripting cannot be read, the content is still available in the HTML, which everything can read
- Yahoo User Interface library (developer.yahoo.com/yui) offers PE versions of many of its scripts for menus, collapsible lists, and other functionality
- JQuery (jquery.com) has PE methods (for an example, see http://www.kelvinluck.com/2009/02/progressive-enhancement-with-jquery-example/
- Designing for mobile devices
- Future AccessibleWeb@U Meetings
- August - No meeting currently planned
- September - Libraries AccHack
- October - Accessible scripting principles and examples
- Social Networking with Accessiblity people