I recently switched to the GMail redesign where Google Sans is used for the subject text when displaying emails.

enter image description here

I noticed that where a lower case 'r' is followed by a 't' - as in 'Start' - the 'r' is taller than the 'a' before it. However where it is followed by an 'a' - as in 'preparations' - the two letters are the same height.

When trying to select the word with the mouse, the 'r' and 't' could not be selected separately, so presumably there is a ligature. Why would the size of the 'r' increase next to a 't' but not other letters?

  • I've also noticed this... i.imgur.com/m15bBLH.png – Brandito Jun 21 '18 at 4:50
  • I noticed that too, and I don't like it either. Firefox displays 'r' taller, too, but IE11/Edge do not. Someone decided it is the correct way to display the letter. The problem shows when 'r' is followed by 'f', because it too has a dash in it. And I could select r and t separately. – KS74 Oct 27 '18 at 20:13

You can add css font-variant-ligatures:no-common-ligatures (or font-variant-ligatures:none) to prevent Chrome (and Firefox!) from displaying 'r' that way. IE/Edge don't have the bug.

You could also insert ‌ between every pair 'rt' and 'rf' (the problem shows in it, too) in the source text (it's invisible), to make browsers think that the characters are not adjacent, but that's a bit of mess.

And I could select r and t separately.

| improve this answer | |

To get the arch of the R above the crossbar of the T, I imagine. The E and A are lower and rounded, so the R fits into their negative space, but the T pokes to the left.

It's really noticeable. It's irritating my eye quite a bit. The designer(s) did not do a good job with that ligature pair.

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.