- From: Ben Maurer <bmaurer@andrew.cmu.edu>
- Date: Sun, 15 Jul 2007 23:07:50 -0700 (PDT)
- To: Al Gilman <Alfred.S.Gilman@IEEE.org>
- cc: wai-xtech@w3.org, Colin McMillen <mcmillen@cs.cmu.edu>
Hey, On Sat, 14 Jul 2007, Al Gilman wrote: > for a) it would make sense to benchmark what Hotmail and AOL are using, > because > those are production (high volume) sites. Google is more new on the block > etc. Agreed, I simply need to know what works best here. In my testing I've found: - Having a "download as mp3" link is important. In Firefox on Ubuntu, I wasn't able to get embedding working at all. I think we can all agree that, even if it is hard to use, *everybody* can play an mp3 file that they can download - Downloading an mp3 is also very hard on the user (even a non-visually impaired one). We need a better solution. - Ideally, I'd like a way the user can choose to replay the challenge. > for b) in addition to benchmarking the above and similar production > sites, we have the option (given that there are WAI-ARIA embedding > techniques that work in IE) of taking a fresh look. In particular on > yesterdays style guide call Lisa Pappas was talking about an example > where an accessible table presentation replaces (at a layout-region > level) the diagram presentation of some data relation. Perhaps the > interaction design should be that the audio and visual challenges are > visual options, not visually concurrent in the page. Since we need a > user event to launch the sound, why not repaint the visual scene at > this point and remove the elements one doesn't need from the form? > That is just one idea. The main idea is that this is an interaction > design. There needs to be advice up front that there are options, the > user has to have the chance to replay the audio prompt, everything > has to be doable from the keyboard, the most common case has to be > set up to be quick in the default presentation, etc. I put in some work on this part this weekend in the form of making the <a> elements for refesh and go to audio <button>s (I figured help should still be an <a>. Functionally, it's a link, not an action). I have this working, however I can't get the UI right. I tried getting this to work: <button><img src="" alt=""/></button> However, no matter what I did with CSS, Firefox insisted on adding padding to the button (which doesn't work for our artwork). One other thing I did this weekend was to play around with using CSS sprites rather than <img> tags. This is important for us because it reduces the load on our servers (fewer http requests). We now have HTML that looks like: <a href="javascript:.."><span class="class1"></span><span>Get a new challenge</span></a> "class1" has a background image set, and we use some tricks with positioning to hide the <span> for visual browsers (without setting it to display:none). Are there any issues with doing this? -b
Received on Monday, 16 July 2007 06:08:01 UTC