I’m doing some experimental work using Chrome (63) as a renderer for print design. This is definitely off label usage of the software but as I said, experimental. This is important for the context of this question. The other software involved in this is Glyphs Mini (1.5.7) and OS X (11.12).
While doing these experiments I occasionally find that I need additional or modified characters in a font that I’m using. I’ve successfully used Glyphs Mini previously to open a base font I’d like to supplement, delete all the characters, create new/replacement characters, and export it as a new font named something like “Foo Supplement”. I can then set the font-family in CSS like
’Foo Supplement’, Foo
This will cause Chrome to use the supplemental characters from the new font where they exist and fall back to the base font where they don’t. It has worked well.
I’m currently working on an experiment where I wanted to add a lowercase ‘d’ to the font Bungee Regular (https://fonts.google.com/specimen/Bungee). I followed the same procedure but in this case, setting the supplemental font causes Chrome to calculate the line-height differently, resulting in vertical displacement of the text when the supplemental font is set in the CSS. I suspect this has something to do with the vertical writing support in Bungee, but unfortunately I’m still learning the technical ins and outs of font creation, and I’m unsure how to go about debugging this problem (design is a former career I still maintain as a hobby, I’m a software developer now).
I understand I probably can’t fix this with Glyphs Mini, but I’m very comfortable learning how to use something like the python FontTools, FontForge, or the Apple Font Tools to manually make adjustments to the Glyphs Mini output for this single character.
Any pointers as to how I could go about figuring out what is causing this discrepancy?