W3C home > Mailing lists > Public > www-style@w3.org > April 2016

[css-text] Amending hanging-punctuation for Western typography

From: Jon Lee <jonlee@apple.com>
Date: Fri, 01 Apr 2016 01:30:32 -0700
Message-id: <F11CBFDD-A2BA-4302-B664-4B985F4E252D@apple.com>
To: www-style@w3.org
Hello all,

In response to Hyatt’s questions [1], Fantasai mentioned [2] that the hanging-punctuation property focussed on Western typography. I’d like to make a proposal that I think will cover the existing requirements of CJK and also cover Western typography.

I think the reluctance to include Western typography was because of authors’ desires to tweak some of the details of the hanging [3]. This proposal does not prioritize that goal, but leaves an opportunity in the future to do so. Even without that level of control, it seems enough consensus about how far marks hang that it would still be useful.

Inspired by the options available in Illustrator [7] (and noted by Koji [4]), the proposal expands the “hanging-punctuation” property:

hanging-punctuation: none | [ <mode> <character-set> , ]* <mode> <character-set>

<mode> = all | first | last | start | allow-end | end
<character-set> = none | [ latin | latin-primary || latin-secondary ] || burasagari || bracket

1. <mode> determines when punctuation may hang.

“all” is shorthand for “start” and “end”.

“first”, as before, means allow punctuation to hang at the start of the first line.

“last”, as before, means allow punctuation to hang at the end of the last line.

“start” means allow punctuation to hang at the start of all lines in a paragraph. It would be the equivalent of a theoretical “force-start”. Thus, starting punctuation in LTR must hang if text justification is left or justify, but may hang if text justification is right or center.

“allow-end” means allow punctuation to hang as it is already currently specced.

“end” is renamed from “force-end”, and means allow punctuation to hang at the end of all lines in the paragraph.

For “first” and “start”, if the line begins with three characters ABC, where A and B is in the set of characters specified by the hanging-punctuation-characters property and A is in the Unicode Pf or Pi category, then AB should be hung, and C is aligned with the line box. The reverse is true for “last” and “end”. This is to cover cases like <“‘> and <.”>.

Multiple modes and sets can be specified in a rule. In terms of overriding which character sets to use within the same rule, the order of importance for <mode> is (from most to least): none, first, last, start, allow-end, end, all. That is, the sets listed for “first” replace those specified for “start”.

2. <character-set> specifies how a punctuation mark hangs relative to its line box. The marks are grouped into sets.

“latin” is shorthand for “latin-primary” and “latin-secondary”.

“latin-primary” characters hang fully outside of the line box. It includes the following characters:
	- Single straight quote, double straight quote, comma, full stop
	- Unicode Pd that is a hyphen (the spirit of this is to include characters that would be used to break a word)
	- Unicode Pf, Pi

“latin-secondary” characters hang 50% outside of the line box. It includes the following characters:
	- Asterisks, tildes, ellipses, colons, semicolons
	- Unicode Pd not included in “latin-primary” (em dashes and the like)

“burasagari” characters hang fully outside of the line box. It includes the characters specified in the “Stops and Commas” section of the CSS3 text spec.

“bracket” characters hang fully outside of the line box. It includes the following characters:
	- Unicode Ps, Pe

The intent is to give web authors relatively broad control over which characters are allowed to hang, and when. The difference is that it splits these two aspects up, whereas the current proposal combines them in each “hanging-punctuation” value.

Brackets are split out because it seems specific to an author’s taste. For example, one design firm’s style guide [5] says brackets should hang, but I don’t see this recommended in general anywhere else for Western text.

With this proposal the existing CSS3 hanging punctuation maps as follows:

hanging-punctuation: first
	hanging-punctuation: first latin-primary bracket

hanging-punctuation: force-end
	hanging-punctuation: end burasagari

hanging-punctuation: first allow-end last
	hanging-punctuation: first latin-primary bracket, allow-end burasagari, last latin-primary bracket

For Western typography, the most common case could be:

hanging-punctuation: all latin


[1] https://lists.w3.org/Archives/Public/www-style/2016Mar/0073.html
[2] https://lists.w3.org/Archives/Public/www-style/2016Mar/0109.html
[3] http://lists.w3.org/Archives/Public/www-style/2013May/0279.html
[4] https://lists.w3.org/Archives/Public/www-style/2011Apr/0276.html
[5] http://www.artlebedev.com/mandership/120/
[6] http://webdesign.tutsplus.com/articles/getting-the-hang-of-hanging-punctuation--cms-19890
[7] https://helpx.adobe.com/illustrator/using/formatting-paragraphs.html
Received on Friday, 1 April 2016 08:31:04 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:09:02 UTC