Indicating language

Must

The language of a page or app must be specified, and changes in language must be indicated.

Description

When listening, correct pronunciation helps understanding. For users of assistive technologies such as screen readers it is particularly important, as some have different speech synthesizers for different languages. For example, "chat" means something different when using English pronunciation rather than French.

The default language for the content of a page or app must be defined in the code for the correct speech synthesizer to be used. It will over-ride any language and dialect setting specified on the users device.

For multi-lingual content, the language for anything that varies from the default language must also be defined in the local code for the correct speech synthesizer to be used. This includes image alternatives, form labels, quotes, objects, media alternatives, and other elements. It will over-ride the specified default language and any language and dialect setting specified on the users device.

IOS

iOS applications will default to the language in use on the device and will search down the available language resources based upon the device language order. See Introduction to Internationalization and Localization for details. Language specific resources such as strings must be created to support the language. More details can be found in iTunes University, Internationalisation Tips and Tricks (PDF) (you will need an Apple Developer Account to access this).

Content in iOS is read or displayed using the system language. When an application provides content in a specific language developers should use the accessibilityLanguage property to specify the language of the content.

iOS example

Provide string, XIB, graphic and sound resources for all supported languages. Then load the approach resources - for strings NSLocalizedString is commonly used.

UIButton *nextButton = [UIButton buttonWithType:UIButtonTypeCustom];
UIButton *priorButton = [UIButton buttonWithType:UIButtonTypeCustom];
[nextButton setTitle: NSLocalizedString(@"Next story", @"Button title - goes direct to next story") forState:UIControlStateNormal];
[priorButton setTitle: NSLocalizedString(@"Prior story", @"Button title - goes direct to previous story") forState:UIControlStateNormal];
...
[aButton setAccessibilityLanguage:@"en-us"];
[aButton setAccessibilityLabel:NSLocalizedString(@"Label", @"Accessibility label to be read in US English")]; //NB: Not sure if this should be a localized string - might be best left in just US English so text readout is not translated                        

Non-compliant example - no localised string macro used.

UIButton *nextButton = [UIButton buttonWithType:UIButtonTypeCustom];
UIButton *priorButton = [UIButton buttonWithType:UIButtonTypeCustom];
[nextButton setTitle: @"Next story" forState:UIControlStateNormal];
[priorButton setTitle: @"Prior story" forState:UIControlStateNormal];
...
// Specific language wanted for this label not set, no comment for translator
[aButton setAccessibilityLabel:NSLocalizedString(@"Label", nil)];                        

ANDROID

Android applications will attempt to load resources for the language set by the device. If no language specific resources are found the default resource is used. See Android Localization for details.

Assistive technologies are not aware of language specific content and will read all content using the default language settings set for the speech engine or applicable output device.

Android example

// res/values-xx/strings.xml file is provided for each supported language where xx is the 2 letter code for each language (en=English, de=German, etc.)
<TextView
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    android:text="@string/some_text"/>                        
// res/values/strings.xml
<TextView
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    android:text="some_text"/>                        

HTML

Use the lang attribute on the html element to specify the page language.

Use the lang attribute to set language of smaller parts of the document.

HTML example

<!-- HTML -->
<html lang="en">
...
<!-- XHTML -->
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
...
<div>
<h2>Upcoming Spanish Holidays</h2>
<p lang="es">Les Fogueres de Sant Joan.</p>
</div>   
...
</html>                        
<!-- HTML -->
<html>
...
<!-- XHTML -->
<html xmlns="http://www.w3.org/1999/xhtml">
...
<div>
<h2>Upcoming Spanish Holidays</h2>
<p>Les Fogueres de Sant Joan.</p>
</div>   
...
</html>                        

TESTING

 

Procedures
  1. Set the platform language.
  2. Activate the app with platform standard assistive technologies enabled.
  3. Verify the following appears or are announced in the correct language:
    • Text,
    • Text in a different language from that of app/site,
    • Images of text,
    • Images of text in a different language from that of app/site,
    • Labels,
    • Tooltips,
    • Sounds,
    • Video sub-titles,
    • Page and screen titles,
    • Alternatives for image, objects and elements in a different language from that of app/site.
Results

The following check is true:

  • All content, text, images of text, audio, video subtitles, and alternatives are announced or displayed in the language expected, as set in iOS;
  • The language should switch appropriately.