iOS vs Windows Line Height Issue

Scott Biersack
Scott Biersack Posts: 76
edited January 2018 in Type Design Software
Hey friends – I'm still relatively new to type design and trying to understand this issue I came across. I'm in the process of redesigning my portfolio website and used my own typeface across the site. I have this underline hover effect that looks perfectly fine across iOS devices yet appears very large on Windows devices (you can see the comparison in the attached images)...This is leading me to believe I've done something wrong on the backend of my typeface for the line height to render larger on Windows perhaps? 

Could anyone point me in the right direction of where to look within Robofont on how to fix this issue? I don't even know where to begin! 

For those interested in diving deeper, my site is currently hosted at: youbringfire.com/work


Here is the Windows rendering below with the iOS rendering above.
Tagged:

Comments

  • Scott Biersack
    Scott Biersack Posts: 76
    @John Hudson
    Appreciate you taking the time to help me out! That's definitely helpful for me to understand how things are operating. I agree the Windows machine is most likely using different metrics – this at least helps me understand a general area to begin testing. I'll look into WinAscent / WinDescent some more!
  • Johannes Neumeier
    Johannes Neumeier Posts: 380
    Independent of what editor you use the Glyphs tutorial section has this great write up with a comparison of how those different sets of metrics values play together - and how you can apply different strategies in terms of visual compatibility across platforms or certain applications.
  • Jens Kutilek
    Jens Kutilek Posts: 364
    You could try to set the line-height CSS property explicitly if you haven’t done so already.
  • Scott Biersack
    Scott Biersack Posts: 76
    @Johannes Neumeier thanks for sharing that article! Seems very promising – I'll look it over now!
  • Johannes Neumeier
    Johannes Neumeier Posts: 380
    Jens Kutilek said:
    You could try to set the line-height CSS property explicitly if you haven’t done so already.
    Wow, I did not think that would actually overwrite the font metrics. It even unifies the line height for the same font with different metrics when you set line-height in em units. Weird, but useful.
  • Jasper de Waard
    Jasper de Waard Posts: 641
    Offtopic: 'he tries to do it all' doesn't sound a lot like someone I would hire... Have you thought about offering your type up for critique here on typedrawers?
  • Scott Biersack
    Scott Biersack Posts: 76
    @Jasper de Waard
    Why's that? And yes, I've posted here a few times with proofs. Will continue to share more once I have more work to share
  • Jasper de Waard
    Jasper de Waard Posts: 641
    I would expect a person who tries (why would you say you try? Either you do it all, or you don't. Trying is no use to a client) to do everything, to not be very good at any of it. You can only be an expert in so many fields, doing it all just sounds unrealistic (even if you remove the 'tries'). I think it's more convincing to mention all the things you have serious skills in, or just the ones you are best at.

Categories