1. Introduction
As publishing moves to the Open Web Platform (OWP), we hope to expand upon the range of content we are able to publish with web technologies. How content is displayed is of critical importance to how it is understood, and so we ask much of CSS. This document aims to describe our highest priorities for entirely new CSS features, implementation of CSS features that have already been specified, and even some cases where work may need to be done beyond the scope of CSS.
Note: Many of the features described here are documented in [dpub-latinreq].
2. List of Priorities
Priorities are listed on a scale of 1 to 5, with 5 being the highest priority. Priorities were determined in a somewhat arbitrary manner by the editor, with feedback from some members of the interest group. Input from anyone involved in digital publishing is welcome.
2.1. Features requiring implementation
Note: these features are relatively mature, and have been implemented in more than one browser, but will not be widely useful until implemented in all browsers.
Feature | Priority | Spec, Status | Implemented | Not Implemented | Polyfill? |
---|---|---|---|---|---|
font-feature-settings | 5 | [css3-fonts], CR | Firefox, IE, Chrome, Opera, Prince, AH | Safari (now implemented, but not in time for 3Q 2015 releases | No |
hyphens | 5 | [css3text], LC | Firefox, IE, Opera, Safari, Prince, AH | Chrome (bug filed; assigned on August 12, 2015) | Yes |
vertical text | 5 | [css3-writing-modes], CR | Chrome, IE, Opera, Safari, AH | Firefox (which has announced intent to ship) | |
Regions | 5 | [css-regions-1], WD | IE, Safari | Chrome, Firefox, Opera Prince, AH | Yes |
Ruby | 4 | [css-ruby-1], WD | Firefox, partial support in Chrome, IE, Safari, Opera | unknown | Yes |
Emphasis Marks | 4 | [css3-text-decor], CR | Safari, partial support in Chrome and Opera | Firefox, IE | |
OpenType Math Tables | 3 | Partial support in Firefox and Safari | IE, Chrome, Opera |
2.2. Features requiring specification
Note: these features require further specification work
Feature | Priority | Spec, Status | Implemented | Not Implemented | Polyfill? |
---|---|---|---|---|---|
character-based alignment in tables | 5 | [css4-text], unofficial draft | Chrome, Firefox, IE, Opera, Safari, Prince, AH | ||
target-counter() | 5 | [css3-content], ED | Prince, AH | Chrome, Firefox, IE, Opera, Safari | Yes |
target-counters() | 5 | [css3-content], ED | Prince, AH | Chrome, Firefox, IE, Opera, Safari | Yes |
target-text() | 5 | [css3-content], ED | Prince, AH | Chrome, Firefox, IE, Opera, Safari | Yes |
text-spacing | 4 | [css4-text], unofficial draft | |||
content property on elements | 4 | [css3-content], ED | Prince, AH | Chrome, Firefox, IE, Opera, Safari | |
Line grid | 3 | [css3-line-grid], WD | |||
initial-letter | 3 | [css-inline-3], WD | Safari (soon) | Chrome, Firefox, IE, Opera, Prince, AH | |
hanging punctuation | 3 | [css3-text], WD | AH | Chrome, Firefox, IE, Opera, Safari, Prince |
2.3. Features requiring design
Note: these features require design work.
Feature | Priority | Spec, Status | Implemented | Not Implemented | Note |
---|---|---|---|---|---|
Pagination | 11 | [css3-display], [css3-break], [css-overflow-3], [css3-page], [css3-content], [css3-gcpm], [css-page-floats], [css3-page-template], [css-regions-1] | Prince, AH, Opera 12.16 (Presto) | Chrome, Firefox, IE, Current Opera, Safari | Yes |
Hyphenation exception dictionary | 4 | unspecified | AH, Prince | Chrome, Firefox, IE, Opera, Safari | |
Font Metric API | 4 | [houdini-font-metrics-1] | none | Chrome, Firefox, Safari, IE, Opera, Prince, AH | |
hyphenate-limit-chars | 3 | [css4-text], unofficial draft | AH, Prince | Chrome, Firefox, IE, Opera, Safari | |
hyphenate-limit-lines | 3 | [css4-text], unofficial draft | AH, Prince | Chrome, Firefox, IE, Opera, Safari | |
hyphenate-patterns | 3 | Unspecified | AH, Prince | Chrome, Firefox, IE, Opera, Safari | |
min-length-of-last-line | 2 | Unspecified | Chrome, Firefox, IE, Opera, Safari, Prince, AH | ||
merge-sequential-page-numbers | 2 | Unspecified | AH | Chrome, Firefox, IE, Opera, Safari, Prince |
3. Typography and Fonts
3.1. Fonts
3.1.1. font-feature-settings
Note: support for this would help with ligatures
3.1.2. Font Metric API
3.2. Hyphenation
3.2.1. The hyphens property
Hyphenation is critical for justified text. Most browsers now support the hyphens property.
hyphens property not supported in Chrome: https://code.google.com/p/chromium/issues/detail?id=47083
-
https://github.com/mnater/hyphenator
-
https://github.com/bramstein/Hypher
Some polyfills may pollute the source document with discretionary hyphens, causing difficulty for search and other functions.
3.2.2. Hyphenation parameters
3.2.2.1. hyphenate-limit-chars
This property specifies three different things:
-
the shortest word that can be hyphenated.
-
the minimum number of letters in a word that may be left at the end of a line when the word is hyphenated.
-
the minimum number of letters in a word that may be moved to the next line when the word is hyphenated.
Note: The second parameter is called hyphenation-remain-character-count
in [XSLFO20], and hyphenate-after
in Prince. The third parameter is called hyphenation-push-character-count
in [XSLFO20], and hyphenate-before
in Prince.
Defined in [css4-text] which is not yet an official spec.
implemented only by Prince and AH.
3.2.2.2. hyphenate-limit-lines
This property specifies the maximum number of consecutive lines that may end with a hyphenated word.
Note: Called hyphenate-limit
in Prince
Defined in [css4-text] which is not yet an official spec.
implemented only by Prince and AH
3.2.2.3. Hyphenation dictionaries
Reference a hyphenation dictionary, formatted as TeX does.
Name: | hyphenate-patterns |
---|---|
Value: | none | url(patterns-url) |
Initial: | none |
Applies to: | all elements |
Inherited: | yes |
Percentages: | n/a |
Media: | visual |
Computed value: | as specified |
Animatable: | no |
.chill5i .ch4il2 .chil1l .1ci2 .cit5r .2c1it .co3e2 .1co .co4r .cor5n1er .corn2e .de4moi2 .d4em .de1mo .de3o .de3r1a .de3r1i .de1s4c .des2 .dic1t2io5 .3di2c1t .do4t .1do .du4c .1du .du4m1b5 .earth5
3.2.2.4. Hyphenation exception list
Reference a hyphenation exception list, in a simple text format where hyphens show possible break points, and all other break points are forbidden:
En-gland er-go-no-mic exo-skel-e-ton Feb-ruary George-town grand-children inter-office Ir-ving Kabba-list
Note: Called hyphenation-exceptions in [XSLFO20]
3.2.2.5. min-length-of-last-line
Name: | min-length-of-last-line |
---|---|
Value: | <length> |
Initial: | 1 |
Applies to: | all elements |
Inherited: | yes |
Percentages: | n/a |
Media: | visual |
Computed value: | as specified |
Animatable: | no |
Note: This property is from [XSLFO20]
3.3. East Asian Language Support
3.3.1. Emphasis Marks
not supported in Firefox. Bug to implement unassigned.
partial support in Chrome and Opera; don’t support left and right values of -webkit-text-emphasis-position.
3.3.2. Ruby
Details needed on level of support in different browsers, and priorities for implementing features
CSS stylesheet polyfill for Ruby
3.3.3. text-spacing
[css4-text] is not yet an official spec
3.4. initial-letter
will be shipped in Safari in Fall 2015, but not yet implemented in other browsers.
some spec work still required for i18n.
3.5. Hanging punctuation
at risk in [css3-text]
4. Pagination
4.1. Foundations
Pagination is a complex subject, involving many different features and specifications.
-
[css3-display] defines the box tree and box fragments.
-
[css3-break] defines how to break content across containers such as boxes.
-
[css-overflow-3] describes the basic behavior of content that doesn’t fit onto a single display surface.
-
[css3-page] defines the page model, page geometry and margin boxes.
-
[css3-content] defines how to populate page margin boxes.
-
[css3-gcpm] defines how to create footnotes and sidenotes.
-
[css-page-floats] defines how to float images or other elements to the top or bottom of pages.
-
[css3-page-template] describes a method to create boxes in CSS, which then can be used to receive content via [css-regions-1] or [css3-content].
How will Project Houdini fit into all of this?
Is there a role for [css-regions-1] in defining pagination?
A significant number of people consider the page margin boxes as defined by [css3-page] to be inadequate. [css3-page-template] describes a potential alternative.
4.2. APIs
See https://www.w3.org/dpub/IG/wiki/Functional_Requirements_for_Pagination#Interacting_with_Pages
4.3. Page transitions
5. Generated Content and Cross-References
Many publication elements, such as figures, tables, and even chapters, can be automatically numbered or labelled. We need to be able to both display those labels and reference them from elsewhere in the document (see Figure 1.3).
[css3-content]] describes functions for referencing the values of counters and text.
5.1. Cross-References
5.1.1. The target-counter() function
target-counter() is not implemented in browsers
5.1.2. The target-counters() function
target-counters() is not implemented in browsers
5.1.3. The target-text() function
target-text() is not implemented in browsers
5.2. Collapsing Page Ranges
When generating indexes or referring to page ranges, one often ends up with duplicated or sequential numbers.
1, 3, 3, 7, 8, 9, 10, 16
This should be formatted as:
1, 3, 7–10, 16
with duplicates removed and consecutive numbers replaced by ranges.
Name: | merge-sequential-page-numbers |
---|---|
Value: | merge | leave-separate |
Initial: | merge |
Applies to: | all elements |
Inherited: | yes |
Percentages: | n/a |
Media: | visual |
Computed value: | as specified |
Animatable: | no |
Note: [XSLFO20] has a merge-sequential-page-numbers feature: http://www.w3.org/TR/xslfo20/#merge-sequential-page-numbers
5.3. Generated content
In [css21], generated content is restricted to pseudo-elements. PDF formatters like Prince allow the content property on all elements. This has proved invaluable for many common use cases.
hr
element to indicate thematic breaks in narrative content (sometimes called "space breaks" in the publishing industry. But these breaks are often designed as an ornament or image, rather than any sort of horizontal line. We would like to do
hr.ornament { font-family: 'Poetica Std'; content: '•'; font-feature-settings: "ornm" 10; }
6. Math
Browser support for mathematics is critical for educational, scientific, and technical publishing. In the absence of native high-quality cross-browser support for MathML, the community is focusing on ways of making polyfilling MathML easier and better. Some features that might help include:
-
Font metric APIs
-
Support for Open Type Math Tables
6.1. Aligning equations
Many publishers require that all equations on a page align on the equals sign.
x + 3z = 7 + 2y 2x + y + z = 4 Intervening text which may extend for several lines 10 + 2y = 3x + 2z
design a mechanism for this feature.
6.2. Numbering equations
Are CSS counters adequate to the task?
6.3. OpenType Math Tables
This provides crucial technology for math layout (e.g., specifying glyph fragments for stretchy character constructions).
Note: see http://blogs.msdn.com/b/murrays/archive/2014/09/10/10520771.aspx and http://fontforge.github.io/math.html
only partial support in Gecko and WebKit
unsupported in Blink, Trident/Edge
7. Tables
7.1. Character-based alignment
Defined in [css4-text] which is not yet an official spec.
8. Layout
8.1. Regions
not implemented in Chrome, Firefox, and Opera