rootstock icon indicating copy to clipboard operation
rootstock copied to clipboard

Possibly incorrect rendering of unicode superscripts in 02.delete-me.md

Open slochower opened this issue 6 years ago • 17 comments

Unicode superscripts look incorrect (specifically digits 1,2,3,4) on Firefox 65.0.2 and macOS 10.14.3. Subscripts look okay. Know what's up @vincerubinetti? Ah, they also look a bit too bold in Chrome 72.0.3626.119.

image

image

slochower avatar Mar 13 '19 21:03 slochower

In both of those browsers, could you open up the dev console and try to see what font is actually being used for each of those characters. You can do it in chrome like this: image

vincerubinetti avatar Mar 14 '19 15:03 vincerubinetti

@slochower As discussed in #185, this happens because most fonts only support a small sub-set of all the possible unicode characters.

I was just reading this, and apparently not only do fonts not usually support all of them, it's actually not even possible to support all of them in a single font.

We can try to specify a certain font for a certain unicode character range, but we'd have to find a font that's available by default on all OS's (or all the ones we want to support), and then decide on a unicode range (that the font supports of course) that the font will be used for.

Here's a list of some common fonts that support a lot of unicode characters. It shows how many characters it supports and the license. I'm not sure that any of those are included by default on Windows, Mac, Linux, iOS, and Android. Some of those can be hot-linked to, such as Noto. But if the user doesn't have internet access, it will fall back to the system fonts and the same problem will return.

vincerubinetti avatar Mar 14 '19 15:03 vincerubinetti

~Looks like I'm using Open Sans as expected, right? And if so, why does my rendering of Open Sans look different from your rendering of Open Sans?~ (See below!)

image

Same in Firefox.

image

Edit: Looks like Chrome is rendering a mix of Helvetica and Open Sans. Not sure why! (Presumably Firefox too). And in your case, you have mixed fonts too -- two local files plus Open Sans loaded over the network.

image

slochower avatar Mar 14 '19 17:03 slochower

@slochower When you see font-family: "Open Sans", "Helvetica", sans-serif, that is the fallback order of the fonts, on a per-character basis. If the font can't be found (either it's not loaded by the CSS, or it's not on the user's system) or the needed glyph isn't supported by the font, it falls back to the next one on the list. It's standard practice to provide these fallbacks, because as mentioned above, no font has all the glyphs you could possibly need. You're sometimes forced to use multiple fonts, unless you only stick to very basic US-centric characters.

vincerubinetti avatar Mar 14 '19 17:03 vincerubinetti

no font has all the glyphs you could possibly need

Okay, but surely Open Sans has 0 1 2 3 4 5 6 7 8 and 9? If not, then I'd suggest it's not a good default font.

slochower avatar Mar 14 '19 17:03 slochower

Open Sans is the most used and most popular sans-serif Google Font (30 billion serves per week). I think Google Fonts are the most reliably way to make sure everyone gets the same font (as long as they have internet access). I don't know of any font that is included by default on all OS's that also supports more unicode characters than Open Sans. And none of the candidates (Arial, Tahoma, etc) look as good as Open Sans.

Windows fonts Mac fonts iOS fonts Android fonts

Here is a font demo. You can see what fonts support which characters on your different browsers and OSs:

https://jsfiddle.net/ajqpedzb/show

vincerubinetti avatar Mar 14 '19 18:03 vincerubinetti

Ah, I'm probably not being clear. Does Open Sans have all superscript characters 0 through 9? It looks like no, based on your test.

I would say these (i.e., superscripts) are overrepresented in science and (to me) it makes sense to have a font that can handle all the digits. I know there is a problem that we will always be missing out on some of Unicode, but again, superscripts are not very rare (for my stuff). Personally, I don't want to write a superscript number and have half the numerals displayed in one font and half in another. That seems like a nonideal tradeoff. Others should feel free to chime in with their opinions.

slochower avatar Mar 14 '19 18:03 slochower

No it doesn't. But neither does almost anything else. And the few fonts that do have all the characters aren't installed by default on all browsers and OS's.

If you can find a font that's on all OS's, or an online hosted font (like Google Fonts or some other reliable CDN) that has the characters you want, let me know.

The font test jsfiddle I gave you has a list of a handful of the "biggest names" in fonts. So basically if you can't find one on that list that looks the same (or at least good) on every major browser and OS, there is no single-font solution.

HTML sub/super-scripts are preferred for this reason, and also for increased accessibility (eg screenreaders).

vincerubinetti avatar Mar 14 '19 18:03 vincerubinetti

If no font is universally available and has all characters 0-9, should we remove the option to use Unicode superscripts from 02.delete-me.md?

agitter avatar Mar 14 '19 19:03 agitter

I think it's good to show users that they can also just copy and paste WYSIWYG text (ie unicode) without necessarily having to do anything fancy like HTML or CSS. But the unfortunate reality of those special WYSIWYG characters is that they often look inconsistent across different platforms, just like emoji.

Like I said, if you find a font that happens to be loadable from the internet and has the sub/superscripts you want, we can keep the pretty Open Sans for the regular text and specify the other font for just the special characters of our choosing.

vincerubinetti avatar Mar 14 '19 19:03 vincerubinetti

I think it's good to show users that they can also just copy and paste WYSIWYG text (ie unicode) without necessarily having to do anything fancy like HTML or CSS.

Okay, I agree with that. Should we consider a different Unicode example besides superscripts?

agitter avatar Mar 14 '19 19:03 agitter

Wonder if it would be useful to say:

We can write superscripts using unicode characters like this² or using HTML like this<sup>2</sup> or using TeX syntax like this$^{2}$.

What do you think?

slochower avatar Mar 14 '19 20:03 slochower

I am in favor of how we currently list all unicode super/subscript digits. There are really helpful in certain cases, where HTML formatting is not supported. For example, copying output to a plain text field like a Tweet.

I don't personally think it's a huge issue that the formatting is imperfect. Why don't we keep in a mind a solution to bring consistent formatting to as much Unicode characters as possible? But perhaps not make any changes currently, unless we really see the inconsistent appearance as a major issue.

dhimmel avatar Mar 14 '19 21:03 dhimmel

I originally just had a single subscript x and a single superscript 2, but we added the whole range of numbers so people could copy and paste easily. That's not necessarily our responsibility to show them though.

How about:

Special ([unicode](https://en.wikipedia.org/wiki/List_of_Unicode_characters)) characters:
² ₓ ← → ↑ ↓ ★ ♣
_(Note: may not display the same on all devices/browsers.)_

vincerubinetti avatar Mar 14 '19 21:03 vincerubinetti

I guess the copy-pastability is nice. Doesn't look like the greatest example to me, but I won't stand in the way of leaving it, since it sounds like there are upstream issues that fonts get mixed.

slochower avatar Mar 15 '19 18:03 slochower

Given that we try not to edit delete-me frequently because it always causes a conflict (albiet an easy one to resolve), let's decide if we want to make any changes related to the unicode super/subscripts next time we're editing delete-me.

dhimmel avatar Mar 15 '19 20:03 dhimmel

That sounds good @dhimmel .

slochower avatar Mar 15 '19 20:03 slochower