Language enablement index
More details about this document
- This version:
- https://www.w3.org/TR/2024/DNOTE-typography-20241101/
- Latest published version:
- https://www.w3.org/TR/typography/
- Latest editor's draft:
- https://w3c.github.io/typography/
- History:
- https://www.w3.org/standards/history/typography/
- Commit history
- Editor:
- Feedback:
- GitHub w3c/typography (pull requests, new issue, open issues)
Copyright © 2017-2024 World Wide Web Consortium. W3C® liability, trademark and permissive document license rules apply.
Abstract
This document points browser implementers and specification developers to information about how to support typographic features of scripts or writing systems from around the world, and also points to relevant information in specifications, to tests, and to useful articles and papers. It is not exhaustive, and will be added to from time to time.
Status of This Document
This section describes the status of this document at the time of its publication. A list of current W3C publications and the latest revision of this technical report can be found in the W3C technical reports index at https://www.w3.org/TR/.
The information in this document helps to link users and developers so that browsers can better support typographic needs around the world. It is expected that this document will be constantly updated, as new material becomes available or comes to our attention.
To make it easier to track comments, please raise separate issues or emails for each comment, and point to the section you are commenting on using a URL for the dated version of the document.
This document was published by the Internationalization Working Group as a Group Draft Note using the Note track.
Group Draft Notes are not endorsed by W3C nor its Members.
This is a draft document and may be updated, replaced or obsoleted by other documents at any time. It is inappropriate to cite this document as other than work in progress.
The W3C Patent Policy does not carry any licensing requirements or commitments on this document.
This document is governed by the 03 November 2023 W3C Process Document.
The W3C and browser implementers need to make sure that the text layout and typographic needs of scripts and languages around the world are built in to technologies such as HTML, CSS, SVG, etc. so that Web pages and eBooks can look and behave as users expect.
To that end experts in various parts of the world are discussing and documenting layout and typographic requirements, as well as gaps between what is needed and what is currently supported in browsers and ebook readers. (See a list of relevant work in this area that is supported by the W3C Internationalization groups.)
This page points browser implementers and specification developers to information related to support for features of scripts or writing systems from around the world. It is not exhaustive, and will be added to from time to time.
The Script resources links point to pages that link to detailed information as follows:
- Requirements for a set of features.
- Requests for information about how the script works.
- Discussions related to features of that script.
- Spec issues and discussions relevant to that script.
- Tests related to the various features the script has.
- Gap analysis reports for that script.
This document also has links to W3C specifications where a particular feature is discussed, and sometimes tests for that feature.
Additional information and references are hereby solicited; please suggest additions, clarifications, corrections, and other improvements using the github issues list.
In what direction does text flow along a line and across a page? (See the Bidirectional text section if the basic direction is right-to-left.) If the script uses vertically oriented text, what are the requirements? What about if you mix vertical text with scripts that are normally only horizontal? Do you need a switch to use different characters in vertical vs. horizontal text? Does the browser support short runs of horizontal text in vertical lines (tate-chu-yoko in Japanese) as expected? Is the orientation of characters and the directional ordering of characters supported as needed?
- Script resources
- Spec links
If the general inline direction is right-to-left, are there any issues when handling that? Where the inline direction of text is mixed, is this bidirectional text adequately supported? What about numbers and expressions? Do the Unicode bidi controls and HTML markup provide the support needed? Is isolation of directional runs problematic?
- Script resources
- Spec links
-
- HTML5: The dir attribute
- CSS3 Writing Modes: Inline direction and bidirectionality
Do the standard fallback fonts used in browsers (eg. serif, sans-serif, cursive, etc.) match expectations? Or are additional generic font styles needed? Are special font or OpenType features needed for this script that are not available? What other general, font-related issues arise? The font styles described here refer to alternative types of writing style, such as naskh vs nastaliq; for oblique, italic, and weights see instead 3.4 Letterform slopes, weights, & italics.
If context-sensitive rendering support is needed to shape combinations of letters or position certain glyphs relative to others, is this adequately provided for? Does the script in question require additional user control features to support alterations to the position or shape of glyphs, for example adjusting the distance between the base text and diacritics, or changing the glyphs used in a systematic way? Do you need to be able to compose/decompose conjuncts or ligatures, or show characters that are otherwise hidden, etc? If text is cursive, see the separate section 3.3 Cursive text.
If this script is cursive (ie. letters are generally joined up, like in Arabic, N’Ko, Syriac, etc), are there problems or needed features related to the handling of cursive text? Do cursive links break if parts of a word are marked up or styled? Do Unicode joiner and non-joiner characters behave as expected?
- Script resources
- Spec links
-
- CSS Text: Shaping Across Element Boundaries
- Tests
This covers ways of modifying the glyphs for a range of text, such as for italicisation, bolding, oblique, etc. Do italic fonts lean in the right direction? Is synthesised italicisation or oblique problematic? Are there other problems relating to bolding or italicisation - perhaps relating to generalised assumptions of applicability? For alternative writing/font styles, see 3.1 Fonts & font styles.
- Script resources
- Spec links
Does your script need special text transforms that are not supported? For example, do you need to to convert between half-width and full-width presentation forms? Does your script convert letters to uppercase, capitalised and lowercase alternatives according to your typographic needs? How about other transforms?
- Script resources
- Spec links
-
- CSS3 Text: Transforming text
- CSS Custom Text transformations
- Tests
Are there any character repertoire issues preventing use of this script on the Web? Do variation selectors need attention? Are there any other encoding-related issues?
This is about how text is divided into graphemes, words, sentences, etc., and behaviour associated with that. Do Unicode grapheme clusters appropriately segment character units for your script? When you double- or triple-click on the text, is the expected range of characters highlighted? When you move through the text with the cursor, or backspace, etc. do you see the expected behaviour? (Some of the answers to these questions may be picked up in other sections, such as line-breaking, or initial-letter styling.)
Are there specific problems related to punctuation or the interaction of the text with punctuation (for example, punctuation that is separated from preceding text but must not be wrapped alone to the next line)? Are there problems related to bracketing information or demarcating things such as proper nouns, etc? Some of these topics have their own sections; see also 5.2 Quotations & citations, and 5.4 Abbreviation, ellipsis & repetition.
This is a subtopic of phrase & section boundaries that is worth handling separately. Are there any issues when dealing with quotations marks, especially when nested? Should block quotes be indented or handled specially? Do quotation marks take text direction into account appropriately?
- Script resources
- Spec links
-
- HTML5: The q element•The blockquote element
- CSS3 Generated and Replaced Content: Specifying quotes with the 'quotes' property
- Tests
How are emphasis and highlighting achieved? If lines or marks are drawn alongside, over or through the text, do they need to be a special distance from the text itself? Is it important to skip characters when underlining, etc? How do things change for vertically set text?
- Script resources
- Spec links
-
- CSS3 Text Decoration: Emphasis Marks
- Tests
Are there problems with characters or other methods used to indicate abbreviation, ellipsis, or repetition?
Are the appropriate methods for inline annotations supported for this script? The ruby spec currently specifies an initial subset of requirements for fine-tuning the typography of phonetic and semantic annotations of East Asian text, including furigana, pinyin and zhuyin fuhao systems. Is is adequate for what it sets out to do? What other controls will be needed in the future? What about other types of inline annotation, such as warichu? This section deals with inline annotation approaches. For annotation methods where a marker in the text points out to another part of the document see 7.3 Footnotes, endnotes, etc.
- Script resources
- Spec links
- Tests
This section is a catch-all for inline features that don't fit under the previous sections (such as overlines for numeric digits in Syriac). It can also be used to describe in one place a set of general requirements related to lines or other features that are drawn alongside the text when those features appear in more than one of the sections above. For example, when talking about lines drawn alongside the text: Are there issues about the positioning or use of underlines? Some aspects related to the drawing of lines alongside or through text involve local typographic considerations. Do underlines need to be broken in special ways for this script? Do you need support for additional line shapes or widths? Does the distance or position of the lines relative to the text need to vary in ways that are not achievable? Are lines correctly drawn relative to vertical text?
- Script resources
- Spec links
-
- CSS3 Text Decoration: Line Decoration: Underline, Overline, and Strike-Through
- Tests
Relevant here are formats related to number, currency, dates, personal names, addresses, and so forth. If the script has its own set of number digits, are there any issues in how they are used? Does the script or language use special format patterns that are problematic (eg. 12,34,000 in India)? What about date/time formats and selection - and are non-Gregorian calendars needed? Do percent signs and other symbols associated with number work correctly, and do numbers need special decorations, (like in Ethiopic or Syriac)? How about the management of personal names, addresses, etc. in web pages: are there issues?
Does the browser capture the rules about the way text in your script wraps when it hits the end of a line? Does line-breaking wrap whole 'words' at a time, or characters, or something else (such as syllables in Tibetan and Javanese)? What characters should not appear at the end or start of a line, and what should be done to prevent that? Is hyphenation used for your script, or something else? If hyphenation is used, does it work as expected? (Note, this is about line-end hyphenation when text is wrapped, rather than use of the hyphen and related characters as punctuation marks.)
- Script resources
- Background reading
- Spec links
-
- CSS3 Text: Line Breaking and Word Boundaries
- CSS3 Text: Hyphenation: the hyphens property
- Tests
When text in a paragraph needs to have flush lines down both sides, does it follow the rules for your script? Does the script need assistance to conform to a grid pattern? Does your script allow punctuation to hang outside the text box at the start or end of a line? Where adjustments are need to make a line flush, how is that done? Do you shrink/stretch space between words and/or letters? Are word baselines stretched, as in Arabic? What about paragraph indents, or the need for logical alignment keywords, such as start/end, rather than left/right? Does the script indent the first line of a paragraph?
- Script resources
- Spec links
-
- CSS3 Text: Alignment and Justification•Edge effects
- Tests
This section is concerned with spacing that is adjusted around and between characters on a line in ways other than attempts to fit text to a given width (ie. justification). Some scripts create emphasis or other effects by spacing out the words, letters or syllables in a word. Are there requirements for this script/language that are unsupported? If spacing needs to be applied between letters and numbers, is that possible? What about space associated with punctuation, such as the gap before a colon in French? (For justification related spacing, see 6.3 Text alignment & justification.)
- Script resources
- Spec links
-
- CSS3 Text: Spacing
- Tests
Does the browser support requirements for baseline alignment between mixed scripts and in general? Are there issues related to line height or inter-line spacing, etc.? Are the requirements for baseline or line height in vertical text covered?
- Script resources
- Spec links
-
- CSS3 Writing Modes: Inline-level Alignment
- CSS3 Inline Layout: Line Spacing: the line-height property
- CSS Line Grid
The CSS Counter Styles specification describes a limited set of simple and complex styles for counters to be used in list numbering, chapter heading numbering, etc. The rules plus more counter styles (totalling around 120 for over 30 scripts) are listed in the document Ready-made Counter Styles. Do these cover your needs? Are the details correct (both for counters and separators)? Are there other aspects related to counters and lists that need to be addressed? Are list counters handled correctly in vertical text?
- Script resources
- Spec links
- Tests
Does the browser or ereader correctly handle special styling of the initial letter of a line or paragraph, such as for drop caps or similar? How about the size relationship between the large letter and the lines alongide? where does the large letter anchor relative to the lines alongside? is it normal to include initial quote marks in the large letter? is the large letter really a syllable? etc. Are all of these things working as expected?
- Script resources
- Spec links
-
- CSS3 Selectors: The ::first-letter pseudo-element
- CSS3 Inline Layout: Initial Letters
- Tests
How are the main text area and ancilliary areas positioned and defined? Are there any special requirements here, such as dimensions in characters for the Japanese kihon hanmen? The book cover for scripts that are read right-to-left scripts is on the right of the spine, rather than the left. Is that provided for? When content can flow vertically and to the left or right, how do you specify the location of objects, text, etc. relative to the flow? For example, keywords 'left' and 'right' are likely to need to be reversed for pages written in English and page written in Arabic. Do tables and grid layouts work as expected? How do columns work in vertical text? Can you mix block of vertical and horizontal text correctly? Does text scroll in the expected direction? Other topics that belong here include any local requirements for things such as printer marks, tables of contents and indexes. See also 7.2 Grids & tables.
As a subtopic of page layout, does the script have special requirements for character grids or for tables?
Does your script have special requirements for footnotes, endnotes or other necessary annotations of this kind in the way needed for your culture? (See 5.5 Inline notes & annotations for purely inline annotations, such as ruby or warichu. This section is more about annotation systems that separate the reference marks and the content of the notes.)
Are vertical form controls well supported? In right-to-left scripts, is it possible to set the base direction for a form field? Is the scroll bar on the correct side? etc. Are there other aspects related to user interaction that need to be addressed?
The following changes have been made since the document was last published to the TR space:
- Standardised headings, and pull section descriptions from central file, to match gap analysis, and language resources pages.
See the github commit log for more details.