[css-text-decor-3] Recommend that ink-skipping underlines conform to the shape of the glyph outline, per WG resolution. #1093

Author: fantasai

css-text-decor-3/Overview.bs

@@ -126,6 +126,50 @@ Line Decoration: Underline, Overline, and Strike-Through</h2>
     <p class="caption">Skipping Glyph Ink</p>
   </div>
 
+ <p>When the UA interrupts underlines or overlines at glyph boundaries,
+   the shape of the line at that boundary should
+   follow the shape of the glyph.
+
+  <div class="note">
+    Note, this specification intentionally does not mandate a particular method
+    for “following the shape” of the glyph
+    so that UAs can take appropriate measures to handle
+    aesthetic and performance considerations.
+    For example,
+    a UA could assume square line endings below a certain size threshold
+    for performance reasons;
+    or use trapezoidal endings to approximate curves,
+    especially on thinner line decorations.
+    In terms of aesthetic considerations,
+    the UA might also consider what happens when the glyph boundary
+    intersects only part of the line thickness
+    or is slanted close to the horizontal--
+    following the curve exactly
+    could result in typographically-awkward wisps of underline.
+    Whether to show the line within enclosed areas of a glyph is yet
+    another consideration.
+
+    <div class="figure">
+      <p><img title="Wispy Leftovers of a Masked-Out Underline"
+             alt="Take, for example, the word “goal” with an underline striking through the bottom loop of the “g”.
+                  Depending on the position and thickness of the underline,
+                  we might see the entire thickness of the underline, or only part of it within the “g”.
+                  This example shows a masked-out underline in two positions.
+                  In the left pair the underline passes through the center of the bowl of the “g”:
+                  the full thickness of the underline shows through the center,
+                  filling it.
+                  In the right pair the underline is slightly lower,
+                  and thus the portion of the underline within the “g” can only show a partial thickness."
+             src="images/skip-ink-wisp.png">
+      <p class="caption">
+      Hiding the portion of the underline within the bowl gives a cleaner look to the type,
+      while the curved ends of the underline outside it
+      suggest the continuity of the underline through the letter
+      by hugging its outer contour.
+    </div>
+
+  </div>
+
   <p>Relatively positioning a descendant moves all text decorations
     applied to it along with the descendant's text; it does not affect
     calculation of the decoration's initial position on that line.

css-text-decor-3/images/skip-ink-wisp.png

@@ -115,8 +115,8 @@ Comment:  https://www.w3.org/mid/5654DED1.8070706@inkedblade.net
 Comment:  https://github.com/w3c/klreq/issues/20
 Response: https://github.com/w3c/klreq/issues/20#issuecomment-337779644
 Changes:  https://hg.csswg.org/drafts/rev/22c74858f801
-Open:     Accepted =i18n= Confirm
-Resolved:
+Closed:   Accepted
+Resolved: Editor discretion
 ----
 Issue 13.
 Summary:  Should emphasis marks use 'font-variant: ruby'?
@@ -267,7 +267,9 @@ Issue 30.
 Summary:  ink skipping should conform to glyph shapes
 From:     Toby Reif
 Comment:  https://github.com/w3c/csswg-drafts/issues/1093
-Open:     =WG= Discuss.
+Closed:   Accepted
+Resolved: https://lists.w3.org/Archives/Public/www-style/2017Oct/0044.html
+Verified: https://github.com/w3c/csswg-drafts/issues/1093#issuecomment-339621321
 ----
 Issue 31.
 Summary:  interaction of 'display: contents' and text-decoration