Machine Vision: Do all font styles have the same visible height at all point sizes?

[davelab6]

Following #246 ...

Write a machine vision test that ensures all font styles have the same visible height at all point sizes.

Adobe's Source Sans Pro in earlier versions has a bug that reproduces this, adobe-fonts/source-sans#25

[mattez]

Issue is back. It is at least issue of WOFF2.

I made basic test of Font Size vs Font Weight on CodePen.
Screen shot of this test is attached.

Font source: Google Fonts.
Browsers:
Google Chrome last version - use WOFF2
Old Safari 8.0.8 - use [TTF]

[felipesanches]

Is that an outline geometry issue or is it related to hinting or other aspects of rendering ? I guess it's hinting, right? Can you clarify the problem description, please?

[felipesanches]

sounds like a task for @m4rc1e 's browserstack-based tool

[mattez]

It is related to this: adobe-fonts/source-sans#25

I don't know if this issue is it related to hinting or other aspects of rendering.
I'm only web developer, who have to use this font, and find it has optically different sizes across its weights even if numeric pixel size is the same.

I want only point out, that visual tests mentioned in this thread are really desirable.

[miguelsousa]

@felipesanches TrueType hinting

[mattez]

@felipesanches you mean @m4rc1e 's https://github.com/m4rc1e/pybrowserstack-screenshots right?

@miguelsousa from my test it looks that TrueType is OK. For sure there is a problem with WOFF2 (based on OpenType).

[m4rc1e]

@mattez This one https://github.com/m4rc1e/diffbrowsers, still beta and still awaiting review, googlefonts/diffbrowsers#1

You'll need a paid for Browserstack account to use it.

[mattez]

Difference is so obvious arount size 28px ...
We you this combination on our webpage. Extra Light and Black.

Test i your self with my prototype tester on codepen in your browser.
You can set (in JavaScript top part):

• tested string,
• font weights,
• font sizes (min/max)

[felipesanches]

@m4rc1e Am I correct that we plan to integrate your tool as a FontBakery automated test at some point in the near future? If so, then I think we might re-phrase the title of this issue here.

[m4rc1e]

@felipesanches The tool isn't fast, it really only needs to be run on prs for google/fonts. We should include it but use an optional flag to run it. Something like

Speaking of which, here's one I made earlier

[miguelsousa]

@mattez if this issue only happens with otf-based fonts, there's nothing to fix in them; they already have the same family alignment zones (FamilyBlues & FamilyOtherBlues). Getting the different weights to lineup the way you want may require changes to the rasterizer.

[davelab6]

@mattez also, you compare "WOFF2" vs "TTF" but WOFF and WOFF2 are just wrappers around other file types, like ZIP. What is inside the WOFF2 - also a TTF?

Comparing OTF vs TTF can be useful

[mattez]

I start with test in my most favorite browsers. I'm going to tested on other Platforms and Browsers combinations.
system: Ubuntu 16.06 LTS
browsers:
Google Chrome 63 (64-bit)
Firefox 57 (64-bit)
fonts: Last released fonts downloaded yesterday form this repo via bower. I used no WOFF or WOFF2 files. I used OTF or TTF.

Here are results

[mattez]

Here are results from Windows 10. I its looking really fine and OK. So it is probably not problem of font but some problem on operating system or what.

system: Windows 10
browsers:
last Google Chrome
last Firefox
last Edge
fonts: Last released fonts downloaded yesterday form this repo via bower. I used no WOFF or WOFF2 files. I used OTF or TTF.