This application is the first Hmong to English translator available on the iTunes App Store. There are over 3,000 translated Hmong to English words, with more words being added in the next release. Type in your search term and the translator will find the closest match. Phrase support is coming in the next release. The Hmong dialect in this version is “White Hmong.”

If you were ever curious how to translate English into Hmong or vice versa, this app is now available! Go download it and rate it if you’d like!

• Hmong to English Translator
• English to Hmong Translator

Here is a test of @anywhere below.

Follow me on Twitter @songvang. I also reccomend following @twitterapi and @anywhere.

For more information on implementing @anywhere on your site, please visit http://dev.twitter.com/anywhere.

Designing and developing a Web site in which all users, regardless of disability or technology, can access, navigate, read, and understand the same content should be your main goal as a Web designer and developer.

A problem I see with a lot of Web sites these days is that the designers become so focused on making things beautiful on-screen (using only photography to convey a message, vague or non-existent descriptions, motion design that makes the experience more difficult to use, links and navigation that make no sense out of context, etc.) that they forget the experience needs to engage and accommodate all users.

My good friend, Todd Liebsch (who is also an amazing accessibility expert) and I were having this very same discussion the other week and he came up with this concept.

Never design or develop with a WYSIWYG “What You See Is What You Get” mentality. Think of it this way, if everyone can’t see it, they can’t get it. If they can’t get it, you need to figure out a way for them to access that same content. WYSIWYG is an acronym commonly used in the design/development software to describe an authorizing interface, but I think it also makes sense to use it in terms of Web accessibility from a development perspective.

In the coming weeks, I will be expanding this series to include my experience and learnings in Web development with accessibility in mind. I’ll be including code samples and knowledge I’ve gathered over the last few years developing and retrofitting sites for accessibility and my findings from working with people who directly use JAWS and other assistive technologies.

Future article topics:

Demystifying Accessibility for Web Development

• Common Myths
• Alt and Title Attributes
• Skip Links
• Headers
• Forms
• Tables
• Frames
• Navigation
• Flash
• Javascript

I remembered a technique in which you could target an attribute inside of a tag which would then allow you to style the element in question.

<input value="" name="state" type="hidden">

<label for="state">State:</label>
<select name="stateName" id="state">
</option><option value="MN">Minnesota
</option>
…

To keep the hidden field undisplayed, I simply added positioning properties to keep it offscreen. I also added a width property to the select selector.

Solution

<style type="text/css">

input[type="hidden"] { position: absolute; left: -999px; width: 990px; }

select[name="stateName"] { width:250px; }

</style>

<input value="" name="state" type="hidden">

<label for="state">State:</label>
<select name="stateName" id="state">
</option><option value="MN">Minnesota
</option>
…

You could even take it farther by adding a little regex to target even more specific elements in your code.

Add ^ to match any attribute with a certain word at the beginning of the value.

select[name="^stateName"] { width:250px;}

Add $ to match any attribute with a certain word at the end of the value.

select[name="$stateName"] { width:250px;}

Add * to match any attribute with a certain word anywhere of the value.

select[name="*stateName"] { width:250px;}

DrupalCon San Francisco
April 19th – April 21st 2010

http://sf2010.drupal.org/