-Document structure & metadata -Character sets, character encodings and entities -Specifying the language of content -Handling bidirectional text -* Handling vertical text -Handling data that varies by locale -* Supplying data for localization | Notes on document useThis document is in early draft form. It is undergoing constant and frequent modification and does not yet contain accurate content. Use the icons to the right of each section header to view the full text or view resources for a given section. The yellow cells to the right indicates whether a technique is supported by a given user agent. The possible alternatives are: - Y : the earliest version of the user agent considered for this document supports the technique. Earliest versions are: Internet Explorer 6, Netscape Navigator 7, Opera 7
- - : not supported
- (digit): supported in version X and above
- (blank space): needs further investigation.
1 Introduction
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 1.1 Who should use this document
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 1.2 How to use this document
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 1.4 User agents addressed
2 Document structure & metadata
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 2.1 Internationalizing the page header
| | IE | NS | Op | • | For HTML documents and XHTML documents served as text/html, always use the meta element to explicitly declare
the document's character encoding. | Y | Y | Y | • | Use meta charset declarations as early as possible in the head
element. | Y | Y | Y | • | For HTML use the lang attribute, and for XHTML use the lang and xml:lang attributes
in the html tag. | Y | Y | Y |
Resources: Further information
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 2.2 International layout considerations
| | IE | NS | Op | • | Whenever possible, avoid HTML attributes with values of right and left . Use CSS in a linked
stylesheet instead. | Y | Y | Y | • | Whenever possible, avoid using CSS constructs that specify values of right and left . Use
before and after if available. | Y | Y | Y |
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 2.4 * Sentence fragmentation & reuse
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 2.6 * Separating semantics from presentation
3 Character sets, character encodings and entities
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 3.1 Choosing a page encoding
| | IE | NS | Op | • | Choose UTF-8 or another Unicode encoding for all content. | Y | Y | Y | • | If you don't use a Unicode encoding, select an encoding that best supports the languages / characters to be
included in the page text.
[Ed. note: What does this mean? Does it mean, which maximizes the opportunity to directly represent
characters and minimizes the need to represent characters by markup means such as character escapes? Does it include
the idea that you should choose the most commonly used encoding for a region?] | Y | Y | Y | • | Check that user agents (all agents that must render the page) adequately support the page encoding that you
have selected. If not, you might need to use a more widely supported encoding to achieve an adequate degree of user
agent support.[Ed. note: Couldn't this be rolled into the previous
technique?] | Y | Y | Y | • | Use character sets and encodings that will be accessible and common to your
users. | Y | Y | Y |
Resources: Further information
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 3.2 Specifying a page encoding
| | IE | NS | Op | • | Where practical, declare the page's character encoding by setting the charset parameter in the HTTP
Content-Type header. | Y | Y | Y | • | For XHTML served as text/html, where practical use an XML declaration with an encoding
attribute. | Y | Y | Y | • | For XHTML served as application/xhtml+xml , always use an XML declaration with an encoding
attribute. | - | Y | Y | • | For HTML documents and XHTML documents served as text/html, always use the meta element to explicitly declare
the document's character encoding. | Y | Y | Y | • | Use meta charset declarations as early as possible in the head
element. | Y | Y | Y | • | Use the preferred names from IANA's charset registry. | Y | Y | Y |
Resources: Further information
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 3.3 Referring to specific characters
| | IE | NS | Op | • | Avoid escapes when the characters to be expressed are representable in the character encoding of the
document. | Y | Y | Y | • | When using escapes, use the hexadecimal form. | Y | Y | Y | • | If, for a specific application, it becomes necessary to refer to characters outside [ISO10646], characters
should be assigned to a private zone to avoid conflicts with present or future versions of the standard. Use of private
use characters is highly discouraged, however, for reasons of portability. | Y | Y | Y | • | [Ed. note: Add something about the use of inline images to represent characters
] | Y | Y | Y |
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 3.4 * Specifying the encoding of a link destination
4 Fonts
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 4.1 Choosing & specifying fonts
| | IE | NS | Op | • | Do not use <font> tags - use CSS styles instead. | Y | Y | Y | • | Always use the serif and sans-serif
fallbacks | Y | Y | Y | • | Don't assume you know which fonts will be available on the client. | Y | Y | Y | • | Don't rely on text just fitting in a space | Y | Y | Y |
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 4.2 Dealing with undisplayable characters
| | IE | NS | Op | • | Some guidelines for content authors who know that users won't have all the necessary
fonts. | Y | Y | Y |
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 4.3 * Installing multilingual fonts
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 4.4 * Pages containing multiple languages
5 Specifying the language of content
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 5.1 Specifying the overall language of a document
| | IE | NS | Op | • | For HTML use the lang attribute, and for XHTML use the lang and xml:lang attributes
in the html tag. | Y | Y | Y |
Resources: Further information
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 5.2 Identifying language change
| | IE | NS | Op | • | Use the lang and xml:lang attributes around text in a language other than that of the whole
document. | Y | Y | Y |
Resources: Further information
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 5.3 Specifying the language of a link destination
| | IE | NS | Op | • | Use the hreflang attribute on the a element. | | | |
Resources: Further information
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 5.4 Specifying language codes
| | IE | NS | Op | • | Follow the guidelines in RFC3066. | Y | Y | Y | • | Use the two-letter ISO 639 codes for the language code wherever possible, rather than the 3-letter
codes. | Y | Y | Y |
6 Handling bidirectional text'Bidirectional', or 'bidi', text refers to text written using a script such as
Arabic or Hebrew. In such scripts the text flows predominantly from right to left, but embedded numbers or text in
other scripts (such as Latin script) still runs left to right.
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 6.1 Enabling easy localization for RTL scripts
| | IE | NS | Op | • | Whenever possible, avoid HTML attributes with values of right and left . Use CSS in a linked
stylesheet instead. | Y | Y | Y | • | Whenever possible, avoid using CSS constructs that specify values of right and left . Use
before and after if available. | Y | Y | Y |
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 6.2 General use of bidi markup
| | IE | NS | Op | • | Do not use CSS styling to control directionality in XHTML/HTML. Use markup. | Y | Y | Y | • | Only use bidi markup where it is needed. | Y | Y | - |
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 6.3 Basic setup for pages in RTL scripts
| | IE | NS | Op | • | Add dir="rtl" to the html tag any time the overall document direction is
right-to-left. | Y | Y | - | • | Do not add dir="rtl" to the body tag. | Y | Y | - | • | Use logical order, not visual ordering for Hebrew. | Y | Y | - | • | If using an ISO character encoding for Hebrew, choose iso-8859-8-i and use logical
ordering. | Y | Y | - |
Resources: Further information
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 6.4 Changing the directionality of a block element
| | IE | NS | Op | • | Add the dir attribute to a block level element (only) to change its
directionality. | Y | Y | - |
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 6.5 Mixing text direction inline
| | IE | NS | Op | • | Use a Unicode right-to-left mark (RLM) or left-to-right mark (LRM) to make neutral characters such as
punctuation and spaces appear in the right place when they fall between different directional
runs. | Y | Y | - | • | Use a Unicode right-to-left mark (RLM) or left-to-right mark (LRM) to correctly order separate runs of same
direction text separated by neutral characters such as punctuation and spaces. | Y | Y | - | • | Use the dir attribute on an inline element to resolve problems with nested directional
runs. | Y | Y | - | • | For attribute text or element text that allows no internal markup, use Unicode control characters for
bidirectional control. | Y | Y | Y | • | Do not use Unicode control characters for bidirectional control if markup is
available. | Y | Y | - | • | Do not leave white space at the end of inline elements that mark a directional
boundary. | Y | Y | - |
Resources: Further information
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 6.6 Handling parentheses & other mirrored characters
| | IE | NS | Op | • | Treat mirrored characters as if any word left in the name meant 'opening', and
right meant 'closing'. | Y | Y | |
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 6.7 Overriding the Unicode bidirectional algorithm
| | IE | NS | Op | • | Use the bdo element to force the directionality of a sequence of inline
characters. | Y | Y | - |
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 6.8 * Enabling mirroring of layout
7 * Handling vertical text
8 * Text formatting
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 8.2 * Acronyms & abbreviations
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 8.6 * Applying visual style conventions
9 * Lists
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 9.1 * Implementing language-specific list markers
10 * Tables
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 10.1 * Mirroring tables in bidirectional text
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 10.2 * Specifying table dimensions
11 * Links
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 11.1 * Keyboard access to links
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 11.2 * Using non-ASCII characters in link targets
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 11.3 * Including encoding & language information in links
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 11.4 * Linking in a multilingual site
12 * Objects
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 12.1 * Determining the runtime locale for an object
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 12.2 * Dealing with embedded objects with different encodings
13 * Images
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 13.1 * Creating culturally appropriate graphics
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 13.2 * Using text in graphics
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 13.5 * Dealing with directional bias in graphics
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 13.6 * Creating localizable graphics
14 Handling data that varies by locale
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 14.1 Date & time
| | IE | NS | Op | • | Use the full form of the year. | Y | Y | Y | • | Use words (abbreviated if necessary) for the month. | Y | Y | Y | • | For forms, use structured fields or popup menus for date and time input. | Y | Y | Y |
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 14.4 * (Other stuff: measurements, addresses, telephone numbers, personal names, paper sizes...)
17 * Writing source text
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 17.1 * Writing clear, understandable text
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 17.2 * Using metaphors, examples and humour
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 17.3 * Using abbreviations & acronyms
18 * Navigation
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 18.1 * Navigating to the preferred localized web site
![See detailed explanations... See detailed explanations...](images/toDetail.gif) ![Resources dealing with this topic... Resources dealing with this topic...](images/toResource.gif) 18.2 * Implementing international contact pages
20 * Supplying data for localization |