@@ -126,6 +126,50 @@ Line Decoration: Underline, Overline, and Strike-Through</h2>
126126 <p class="caption"> Skipping Glyph Ink</p>
127127 </div>
128128
129+ <p> When the UA interrupts underlines or overlines at glyph boundaries,
130+ the shape of the line at that boundary should
131+ follow the shape of the glyph.
132+
133+ <div class="note">
134+ Note, this specification intentionally does not mandate a particular method
135+ for “following the shape” of the glyph
136+ so that UAs can take appropriate measures to handle
137+ aesthetic and performance considerations.
138+ For example,
139+ a UA could assume square line endings below a certain size threshold
140+ for performance reasons;
141+ or use trapezoidal endings to approximate curves,
142+ especially on thinner line decorations.
143+ In terms of aesthetic considerations,
144+ the UA might also consider what happens when the glyph boundary
145+ intersects only part of the line thickness
146+ or is slanted close to the horizontal--
147+ following the curve exactly
148+ could result in typographically-awkward wisps of underline.
149+ Whether to show the line within enclosed areas of a glyph is yet
150+ another consideration.
151+
152+ <div class="figure">
153+ <p><img title="Wispy Leftovers of a Masked-Out Underline"
154+ alt="Take, for example, the word “goal” with an underline striking through the bottom loop of the “g”.
155+ Depending on the position and thickness of the underline,
156+ we might see the entire thickness of the underline, or only part of it within the “g”.
157+ This example shows a masked-out underline in two positions.
158+ In the left pair the underline passes through the center of the bowl of the “g”:
159+ the full thickness of the underline shows through the center,
160+ filling it.
161+ In the right pair the underline is slightly lower,
162+ and thus the portion of the underline within the “g” can only show a partial thickness."
163+ src="images/skip-ink-wisp.png">
164+ <p class="caption">
165+ Hiding the portion of the underline within the bowl gives a cleaner look to the type,
166+ while the curved ends of the underline outside it
167+ suggest the continuity of the underline through the letter
168+ by hugging its outer contour.
169+ </div>
170+
171+ </div>
172+
129173 <p> Relatively positioning a descendant moves all text decorations
130174 applied to it along with the descendant's text; it does not affect
131175 calculation of the decoration's initial position on that line.
0 commit comments