Doodle Doo
Sign up
for our newsletter to read our latest news.


Tip #8 | Screen Reader Welcome Message

September 24th, 2008

Because there are not that many accessible Flash sites out there yet, it is helpful to add a small Welcome Message for screen reader users to a Flash site or a Flash application. This can be a small hidden text field, that is given the tabIndex of 1, so it is picked up first.

Because of Flash’ dynamic nature, it might be hard for screen reader users to detect any changes on a Flash screen after it has updated. These changes mostly occur after a button is pressed or other user action in Flash. In order for the screen reader JAWS to start reading from the top again, CTRL + Home can be pressed. This can be put in the screen reader welcome message. An example:

Welcome to the <insert title of the website here> website. Use the up and down arrow keys to navigate this Flash site with a screen reader. Press Enter or the Space Bar to select the buttons. Press CTRl + Home to scan each Flash screen from the top for changes after <insert button here>.

A welcome message like this alerts screen reader users that this Flash application has been made accessible, and serves as a reminder that the content might change. It can be tailored to the specific Flash site. For a quiz, for example, you can alert the user to press CTRl + Home ‘for changes after pressing the next button’.

To read all the tips, select ‘Flash Accessibility Tips’ on the side bar.

Tip #7 | Adding Meaningful Alt Text

September 24th, 2008

Writing meaningul alt text is important. Just adding ‘image of __’ is not enough, the image needs to have a meaningful description of its contents. Remember that alt texts in Flash can be longer than in HTML, so we can add more details. Here are a few Alt Text guidelines that we go by:

  • Keep text short, avoid re-using words and combine sentences where possible.
  • Write in the present tense.
  • Describe the scene, the figures and the action. Describe any image details that are of importance to the scene.
  • Start an image with ‘Image of..’
  • Start an animation with ‘Animation of..’
  • Use foreground/ background references to describe a scene set-up.
  • Do not disclose any additional information that is not apparent visually. (For example, if an image shows a painting, then describe what this painting looks like instead of giving its official title.)
  • Include all text that is written in the image. (Text as art)
  • Include colors if they are of importance.

To read all the tips, select ‘Flash Accessibility Tips’ on the side bar.

Tip #6 | Using Selection.setFocus();

September 23rd, 2008

The tricky part in programming the Reading Order in Flash, is that the screen reader focus does not always re-start from the beginning of the Flash file when Flash content changes. Unfortunately, there is no way for Flash to programmatically shift the screen reader focus yet. (I am sure this will be added soon).

But there is a way to influence the focus of the Tab Order, by using Selection.setFocus(instance name); You can use this code to re-set the Tab Order focus from screen to screen. This would be useful in a quiz, for example, where you want the user to start tabbing on each new answer on each new question.

To read all the tips, select ‘Flash Accessibility Tips’ on the side bar.

TIP #5 | LoadMovie and Alt Text

September 22nd, 2008

When using loadMovie to load an external jpg or swf into a holder movieclip, make sure to replace it with the newer MovieClipLoader code. A downside of loadMovie is that it causes any properties of the movieclip to be wiped out when the new content has been loaded, including any alt text that has been assigned.

So replace this code:

holder_mc.loadMovie(“external.swf”);
holder_mc._accProps = new Object();
holder_mc._accPRops.name = “alt text”;

With this:

var mcListener:Object = new Object();
mclListener.onLoadComplete = function() {
// assign alt text here when finished loading
}
var loader:MovieClipLoader = new MovieClipLoader();
loader.addListener(mclListener);
Loader.loadClip(“external.swf”,  holder_mc);

To read all the tips, select ‘Flash Accessibility Tips’ on the side bar.

Keep the Accessibility Institute Open

September 1st, 2008

Please sign this petition to help keep the Accessibility Institute at the University of Texas open! The positions at the instititute were never re-opened to the public. The University of Texas was a leader in the field of accessibility and we feel that by closing the institute, U.T. will lose their prominent lead as expert in this field in the educational community.

http://www.petitionspot.com/petitions/SavetheInstitute

Creature Discomforts

August 25th, 2008

Leonard Cheshire Disability campaigns to change the way people think about, and respond to, disability. They have made Creature disComfort movies for this campaign that you have to see!

Visit the website here and sign-up to become part of the campaign: http://www.creaturediscomforts.org/

Preview one of the movies here:

Jelly Telly Logo

August 21st, 2008

Playing around with the logo for Jelly Telly, a new Christian children’s site. This Flash was output for video at 720×405, 16:9 widescreen. Check out the Jelly Telly website! www.jellytelly.com

SXSW Accessible Flash Panel

August 8th, 2008

I was asked this morning to join Andrew Kirkpatricks panel at SXSW next year. There are many panel submissions, so if you can, go vote for this one! You can find the panel directly here. You can see all the different panels here: http://panelpicker.sxsw.com/ The panel description:

Accessible Flash and Flex Applications
Developers are increasingly interested in delivering accessible applications that use Flash-based technologies but are uncertain as to what is possible and how to develop and test their applications. This panel will look at best practices and examples, and share information on what’s new in Flash accessibility.

I will be very excited to be a part of SXSW again, since I missed this year’s due to work. Go vote for your favorite panels! Hope to see you there!

Doc Edwards Kids Site

August 6th, 2008

The Edwards Aquifer Doc Edwards, Amazing Aquifer Adventure Site is up! You can visit the site here: http://www.docedwards.org/

Commissioned by Raining Popcorn Media, we were responsible for the Flash development of the English site and its animations. The site has a comic book, about the Amazing Aquifer Adventure with Doc Edwards, a Learning Zone with animated lessons on the Edwards Aquifer, and a coloring page with animals that live in the Aquifer.

The site was broken up into several smaller external movies, with animated pre-loaders to bring down the overall loading time. With a site that is heavy on audio, like this one, we also used special compression on the audio mp3 files to bring down the file sizes.

For the character animations we used the AnimSlider Pro for the first time, which allowed us to do alot of lipsynching in a smaller amount of time.

Enjoy the site!

Drag and Drop vs Point and Click

July 21st, 2008

There has always been some debate on whether drag and-drop is too difficult to use for children because they may not be able to hold the mouse button pressed while moving the mouse. We researched and compared two articles: Drag-and-Drop vs. Point-and-Click Mouse Interaction for Children by Kori Inkpen, Kellogg S. Booth and Maria Klawe (1996) and Drag-and-drop errors in young children’s use of the mouse by Afke Donker and Pieter Reitsma (2006).

The older article, proved that the point-and-click method was preferred by students, (68 children, of age 9-13) more so by girls than boys who had a larger error rate in dragging and dropping. 53% of the children said that the point-and-click was easier, and 37% complained that the drag-and-drop made their finger or hand tired. 47% of the children that preferred the drag-and-drop said it was because they were more familiar with the interaction. Some children mentioned that they preferred drag-and-drop because it gave them more tactile feedback. (This ties in with Buxton’s view [3] that that a kinesthetic connectivity can help to reinforce the conceptual connectivity of the task. Unfortunately there is no research to date that might prove if the benefits from conceptual feedback outweighs the physical difficulty of performing the drag-and-drop.) There was a significant difference between girls and boys feedback, which today might be reduced with girls playing video games almost as much as boys do.

The newer research was conducted with 53 children in Kindergarten, mean age of about 5, and 50 children in Grade 1, of age 6. This research proved that most of the drag-and-drop errors made were not due to an inability to maintain pressure on the mouse, but most occurred at the start or the end of the drag-and-drop. Errors at the start are due to the user not knowing whether or not to drag-and-drop or point and click. This can be prevented by adding a short tutorial. Errors at the receptor can be prevented by showing a rollover state, so that it is clear when the target can be released. The receptor should also be larger than the target. The direction of the drag-and-drop also made a difference, as well as the distance between the item and the receptor and the size of the receptor. Dragging down and to the right, and having a larger receptor made it easier. They were unable to show that more errors were made during point-and-click and drag-and-drop.

Our observations confirm the studies. With children as young as 3, we have seen the most errors occur at the receptor, due to not releasing the target at the right time. Rollovers and indicators are necessary. We can make both drag-and-drop and point-and-click accessible. We prefer the point-and-click method for  K-2, because the directions are the same as for the accessible implementation, where the user can click on the target, then click on the receptor to place the target.

[1] Drag-and-Drop vs. Point-and-Click Mouse Interaction for Children (1996) Kori Inkpen, Kellogg S. Booth, Maria Klawe Department of Computer Science The University of British Columbia.

[2] Drag-and-drop errors in young children’s use of the mouse Interacting with Computers, Volume 19, Issue 2, March 2007, Pages 257-266 Afke Donker, Pieter Reitsma

[3] Buxton, W. (1986). There’s more to interaction than meets the eye: Some issues in manual input. In Norman, D. A. and Draper, S.W. (Eds.), User Centered System Design: New Perspectives on Human-Computer Interaction (pp. 319-337). Hillsdale, NJ: Lawrence Erlbaum Associates.