Closed Bug 1451345 Opened 2 years ago Closed 2 years ago

The distance between letters is higher on some fonts

Categories

(Core :: Layout: Text and Fonts, defect)

61 Branch
defect
Not set

Tracking

()

RESOLVED WORKSFORME
Tracking Status
firefox60 --- wontfix
firefox61 --- affected

People

(Reporter: roxana.leitan, Unassigned)

References

(Blocks 1 open bug)

Details

Attachments

(4 files)

User Agent  Mozilla/5.0 (X11; Linux x86_64; rv:61.0) Gecko/20100101 Firefox/61.0
Build ID: 20180404100127

[Affected versions]:
Nightly 61.0a1

[Affected platforms]:
Ubuntu 16.04 x64, Windows 10 x64

[Prerequisites]:
Set pref gfx.downloadable_fonts.otl_validation = false

[Steps to reproduce]:
1.Launch Nightly 61.0a1 with a new profile
2.Open https://codepen.io/MSEdgeDev/pen/mxeOGW

[Expected result]:
The distance between letters should be smaller((as in Chrome) 

[Actual result]:
The distance between letters is large (please see the attached screenshot)
Please re-test this with current Nightly, and confirm whether there is still an issue here. Note that variable fonts will NOT be supported (they'll render with default settings only) on standard Ubuntu 16.04, due to the old version of FreeType on that distro; full testing of variation fonts on Linux requires a distro with a newer (2.7.1+) FreeType, or manually updating the version on 16.04.
Flags: needinfo?(roxana.leitan)
The issue is reproducible on the latest Nightly 61.0a1(2018-04-11) on Ubuntu 16.04 x64 with FreeType 2.8.1 version
Flags: needinfo?(roxana.leitan)
Attached image font.png
I think what we're seeing here is the result of Firefox applying synthetic-bolding (which increases glyph width slightly) because the testcase animates font-weight up to 900; we don't yet implement the mapping of font-weight to the variation axis, and so instead it leads to fake-bold.

Once bug 1436048 is fixed, we'll connect those properties to variation axes, which should resolve the issue here.
Depends on: 1436048
Could you please re-test this with latest Nightly, and confirm whether there is still an issue?

Note that it would be helpful to compare with both Chrome and MSEdge rendering, particularly for the Microsoft examples. There are some cases where Chrome does not fully implement the spec, or implements a slightly older version than we're targeting, so it is not always a reliable reference.
Flags: needinfo?(roxana.leitan)
Attached image Firefox vs Edge.png
Retested on Windows 10 x64 using the latest Nightly 62.0a1(2018-05-09) vs MSEdge.
Flags: needinfo?(roxana.leitan)
The screenshot in comment 6 looks like it captured the animation in MSEdge before it was complete (or did it fail?) -- the font has not yet transitioned to its bold rendering.
Here's how they look for me when the animations have finished.
Please see comment 7 and 8, and confirm whether there is still a problem here. Testing with Nightly and Edge on my Win10 machine, it appears to be fine now.
Flags: needinfo?(roxana.leitan)
Retested on Windows 10 x64 using the latest Nightly 62.0a1(2018-05-13) vs MSEdge (the page is completely loaded) vs Chrome.

In my opinion, it looks better on Firefox but it's your decision if this is the expected behaviour.

Thanks
Flags: needinfo?(roxana.leitan)
Thanks. It's strange, I don't know why MSEdge seems to be giving you such a bad result (it looks much better on my machine, as shown in the comment 8 screenshot), but that's not really our problem. The Firefox rendering (and Chrome, which is quite similar -- slightly different scaling that might be related to how resolution is handled) looks correct.

I think we can close this as WORKSFORME, now that bug 1436048 and related fixes is done.
Status: NEW → RESOLVED
Closed: 2 years ago
Resolution: --- → WORKSFORME
You need to log in before you can comment on or make changes to this bug.