Color picker

Greg Gay g.gay at utoronto.ca
Wed Aug 1 14:13:40 UTC 2007


There's been some work on an accessible (as it can be) colour picker in
a project we were involved in to make TinyMCE accessible. If you're not
familiar TinyMCE is a JS WYSIWYG HTML editor that fits into a textarea.
The interface is keyboard accessible, colours are identified by their
hex code when read by a screen reader, and when a colour is selected and
saved, the cursor is redirected to the location the hex code was
inserted. Its not the most elegantly coded picker, but it does work
quite nicely with  screen reader.

I don't know if Hex codes or proper colour names would be preferred. My
guess is most users would prefer colour names as in the dojo colour
picker, though for those knowledgable about colours,  hex code can be
used to extrapolate amounts of RGB in a given colour, and for someone
who can't see colour that may be prefereable. It might be something
worth investigating. Regardless of how accessible a colour picker might
be to assistive technologies, they will still be difficult to use for
most screen reader users by virtue of being a visual tool.

TinyMCE was implemented in ATutor as part of the ATAG work for a recent
ATRC project. There's a working demo at:  (
http://www.atutor.ca/atutor/demo.php ). Once in the demo course, choose
a content page on the right, then click Edit this Page.  It's the paint
palette button in the editor.

The editor itself can be found at:   http://tinymce.moxiecode.com/

greg

Simon Bates wrote:

>Hi Daphne,
>
>Currently space or mouse click selects a color but we will soon 
>implement enter [http://trac.dojotoolkit.org/ticket/3920]. Please let us 
>know if you find other problems with the Dojo color palette (or any 
>other widget).
>
>Bug reports are always extremely welcome. You can see the tickets 
>currently filed against dojo at: http://trac.dojotoolkit.org/report 
>(http://trac.dojotoolkit.org/report/33 for example.) To file new tickets 
>you can log in with username "guest" and password "guest".
>
>Simon
>
>Daphne Ogle wrote:
>  
>
>>Hi David,
>>
>>I was able to navigate via the keyboard but can't figure out how to 
>>select a color once I've navigated to it.  Do you know what the select 
>>control is?
>>
>>-Daphne
>>
>>On Jul 31, 2007, at 10:25 AM, David Bolter wrote:
>>
>>    
>>
>>>The dojo palette has pretty decent a11y support now including kb nav.
>>>http://archive.dojotoolkit.org/nightly/dojotoolkit/dijit/tests/test_ColorPalette.html
>>>
>>>cheers,
>>>David
>>>
>>>Colin Clark wrote:
>>>      
>>>
>>>>Hi Mark,
>>>>
>>>>Great question. My experience looking at several colour pickers was that 
>>>>they were inaccessible in a typical way for a lot of DHTML interfaces. 
>>>>They didn't work at all with the keyboard, instead relying entirely on 
>>>>mouse-based interactions.
>>>>
>>>>Colin
>>>>
>>>>Mark Norton wrote:
>>>>
>>>>        
>>>>
>>>>>Colin Clark wrote:
>>>>>
>>>>>
>>>>>          
>>>>>
>>>>>>I had been looking for a good JavaScript colour picker back when we 
>>>>>>were working on PreferAble, and while there were some nice ones, they 
>>>>>>were grossly inaccessible.
>>>>>>
>>>>>>
>>>>>>
>>>>>>            
>>>>>>
>>>>>How were they inaccessible, Colin?  To some degree, a color picker is 
>>>>>going to be tough for the vision impaired, though color-names and 
>>>>>color-values could help, perhaps as ALT or tool tips text.  Why would a 
>>>>>color picker be any less accessible, mechanically at least, than a date 
>>>>>picker that shows a month?
>>>>>
>>>>>- Mark Norton
>>>>>
>>>>>
>>>>>          
>>>>>
>>>>        
>>>>
>>>_______________________________________________
>>>fluid-work mailing list
>>>fluid-work at fluidproject.org <mailto:fluid-work at fluidproject.org>
>>>http://fluidproject.org/mailman/listinfo/fluid-work
>>>      
>>>
>>Daphne Ogle
>>Senior Interaction Designer
>>University of California, Berkeley
>>Educational Technology Services
>>daphne at media.berkeley.edu <mailto:daphne at media.berkeley.edu>
>>cell (510)847-0308
>>
>>
>>
>>
>>------------------------------------------------------------------------
>>
>>_______________________________________________
>>fluid-work mailing list
>>fluid-work at fluidproject.org
>>http://fluidproject.org/mailman/listinfo/fluid-work
>>    
>>
>
>_______________________________________________
>fluid-work mailing list
>fluid-work at fluidproject.org
>http://fluidproject.org/mailman/listinfo/fluid-work
>
>  
>



More information about the fluid-work mailing list