[css-text] letter-spacing tests

I threw together some quick i18n tests for letter-spacing. You can see 
pictures of the results by following the links below.

It appears that browsers generally take glyphs as the basis from which 
to apply the letter-spacing, rather than starting with characters, and 
the end result is therefore usually incorrect for non-latin cases, and 
highly font-dependent.


http://www.w3.org/International/2014/letter-spacing/mac-chrome.png
http://www.w3.org/International/2014/letter-spacing/mac-firefox.png
http://www.w3.org/International/2014/letter-spacing/mac-safari.png
http://www.w3.org/International/2014/letter-spacing/windows-ie.png


Perhaps the spec should make it clearer that the basic starting point 
for application of letter-spacing should be the characters that make up 
the relevant typographic text units rather than the glyphs in the font?



Detailed summation of results:

French
Assertion: The letter-space property produces spaces between grapheme 
clusters for French text for decomposed sequences of characters.

All browsers tested produced the expected result (except that they added 
space after the last character - this effect was common to all tests and 
so will not be mentioned again.)


Hindi
Assertion: The letter-space property produces spaces between syllables 
for Hindi text.

Firefox added space between grapheme clusters for Devanagari Sangam MT, 
rather than syllables, except that it kept a cluster-intial RA with the 
final grapheme cluster in RA+KA+KA+AA (clearly font glyph related). When 
using the Kokila font, which uses ligatures for KA+KA, the results look 
as expected, ie. based on syllables.

Chrome/Safari put spaces between characters, except that the 
candrabindu, nukta and (visibly rendered) virama appeared just before 
the following character with no space intervening.  Quite a mess.

IE didn't do much better. Nukta and candrabindu appear with the previous 
character and virama is not shown. Otherwise, spacing is between 
characters (ie. including between base and spacing vowel sign).



Arabic
Assertion: The letter-space property produces NO spaces between 
characters for Arabic text, and preserves the lam-alif ligature.

All browsers added space between characters that should be joining. On 
the Mac the Scheherazade font failed to keep the lam-alif and lam-meem 
combinations together, separating the glyph parts.

Note also that the extra spacing at the end of the span appears to the 
right, not to the left, of this RTL sequence, for all browsers.



Thai
Assertion: The letter-space property produces correct spacing for U+0E33 
THAI CHARACTER SARA AM text.

Safari adds space between each character for all fonts.

Chrome does the same for Ayuthaya, but for Tahoma separates the circle 
from the rest of the sara am and puts space on either side of it.

Firefox does the same as Safari for the Ayuthaya font, but for the 
Tahoma font puts space between grapheme clusters.

IE does what you'd expect! Nice.



(Btw, not shown in the pictures, I also did a test for zero-width 
control characters (which should be ignored for spacing) and all 
browsers failed.)

ri

Received on Friday, 10 October 2014 08:08:56 UTC