List of proposals, specs and browser updates impacting the project

[JayPanoz]

I thought it would be a good idea to list all the specs and proposals which are likely to impact Readium CSS at some point in the future. Some of them are still in their early days but we’ll probably have to review the project once they are clearly defined.

The W3C CSSWG-Drafts repo is a good way to keep up.

To be honest, I’ve already been reviewing our approach to check whether it is future-proof or not. So far so good but we’ll have to keep the following in mind.

Media Queries Level 5

• Source
• Impact: Global (a11y)
• CSSWG Issues

Logical Properties and Values

• Source
• Impact: Global (esp. vertical writing and RTL)
• CSSWG Issues

CSS Extensions

• Source
• Impact: Global (CSS architecture)
• CSSWG issues
• Note: this specification defines methods for extending several CSS features (custom selectors, custom properties, custom functions, custom combinators, custom @ rules).

Calc notation: min() and max()

• Source
• Impact: Global
• Note: this could help us define floor and ceiling values for a lot of configurations (e.g. have a ceiling for headings font-size when a large user font-size is set)

User Agent Properties

• Source
• Impact: Default, Themes, User Settings

CSS Rhythmic Sizing

• Source
• Impact: Pagination, User settings
• CSSWG Issues

CSS Fonts Module Level 4

• Source
• Impact: Default (Variable fonts), User settings (font-min|max-size)
• CSSWG Issues

COGA Semantics to Enable Personalization

• Source
• Impact: Implementations, User settings (related draft)
• Related TF: PWG Personalization Task Force

Multicol editing

• Source
• Impact: Pagination
• CSSWG Issues

W3C i18n

• Source
• Impact: CJK & RTL

CSSOM (a.k.a. Houdini)

• Source
• Impact: Implementations
• CSSWG Issues

[JayPanoz]

This is not a proposal or spec but Firefox changing its CSS engine will also have a significant impact (testing). Cf. this announcement post on their blog.

[JayPanoz]

And it seems the AMP project + Igalia are collaborating with Apple to fix the iframe + scroll issues in webkit: http://frederic-wang.fr/amp-and-igalia-working-together-to-improve-the-web-platform.html

To me, it’s however unclear if that will impact the CSS (significant impact unlikely) or implems.

[JayPanoz]

So object-fit will ship on October 17 in Edge (customer version). Source.

[JayPanoz]

iPhone X (related to User Agent properties) might be an issue for web apps/implementations. It is still unclear how it will impact them but let’s keep it in mind, especially if this form factor is a blueprint for future iPhones.

The good news is that reading modes should be OK since (at least) Safari uses background-color on html or body to fill the letterbox margins.

The bad news is the home screen indicator (a.k.a. “breakout paddle”) is appearing on top of contents (+ auto-hide), and the native scrollbar (when the notch is on the right), Safari being in full screen, unlike other apps.

Edit: how to deal with the “notch” (tl;dr: there’s a new meta value and CSS “constants” to use).

[JayPanoz]

So, here’s a playground to test variable fonts (you’ll need the latest version of Safari, Chrome or Firefox).

I can feel a headache coming, should a lot of people start using them (we’ll probably have a lot of edge cases to deal with since it can even be used to animate icons).

[edit] On the other hand, implementers could use it for such a TypeGenius feature, or to fine-tune rendering of RS fonts.

[JayPanoz]

So after an audit in Firefox Quantum. Most is OK except:

• columns: they simply won’t reflow if you don’t force a repaint; that was a known issue but actually is way worse now: they won’t even reflow when applying page margins, which will give nasty results (thanks, columns, for being the worst implementation known to humanity).
• image filters in night mode: they worked A-OK, they don’t any more. Since it’s GPU-stuff, it’s not surprising – GPU-stuff tend to be super weird and it’s a miracle when it works as expected –, but that is bad news.

Edit: fixes for Blink/Webkit seem to have fixed Firefox…

[JayPanoz]

Here’s an how-to on variable fonts. Listing this as it will hopefully solve a lot of issues related to fonts in the longer term, especially fonts we have to embed (i.e. only embed 1 file instead of 4, and even provide users with advanced settings allowing them to customize the weight, x-height, character width, etc. of those fonts).

This is still super new, not completely implemented, but support is being improved quite fast, and we could benefit from it at some point.

[JayPanoz]

So everything is A-OK in Firefox now. I guess fixes I committed today apply to Quantum as well. 🎉

[JayPanoz]

Added CSS extensions to the list as the impact could be pretty huge in the longer term.

[JayPanoz]

So this issue is documented now and should probably be a wiki page instead of an issue. I’ll close it as soon as it’s in the Wiki.

[JayPanoz]

Done. Wiki page.

Browsers’ updates bringing new features should be addressed as specific issues from now on (either issue or feature request).