BUG: New Rubrik. The fonts load badly on the Windows platform compared to macOS.

Jan:

THE QUICK ANSWER:

The problem you’re experiencing has nothing to do with the font files. It’s about how different web browsers will render text on-screen.

Unfortunately there’s no ideal solution, because you cannot control which web browsers your website visitors will be using. So you’ll need to adapt your design to work acceptably across all web browsers.

THE MORE DETAILED ANSWER:

If you use a typeface like New Rubrik to create designs in software like Illustrator, Photoshop, and InDesign, Adobe Fonts will install the same OpenType font files on both Macintosh and Windows systems. The beauty of the OpenType font standard is universal font compatibility.

The same is true if you use New Rubrik on a website: Adobe Fonts uses the same font files to typeset text. It doesn’t matter if you use Android, iOS, Linux, macOS, Windows, or any other operating system.

But what does matter is the web browsers that you use to view your website.

Although the World Wide Web Consortium (W3C) has established universal standards like HTML5 and CSS3, it’s the responsibility of the web browser developers to ensure that their software supports those standards as closely as possible. And that support is imperfect: although most current web browsers are very good, they each lack complete and accurate support for the HTML standards.

Support for CSS3 and webfonts – critical to defining ther visual layout of a webpage – is mixed at best. That’s why it’s important to check your website designs on a range of different browsers and devices, to make sure that you layout renders acceptably.

You’ll never be able to get the accuracy and consistency that you can with print design. Print design isn’t perfect either, but experienced designers know what works and what doesn’t. For example: placing very small lightweight text on a busy background is asking for trouble: you may lose the text altogether in the halftone pattern on the printed work.

It’s better to treat what you’re observing on your website design as an example of what won’t work on all web browsers, rather than as an error in the font files or your design.

Why do different web browsers give different results, especially with text? Every operating system and application needs a typesetting engine to render text on-screen. And those typesetting engines produce different results.

Adobe has a set of reasonably consistent typesetting engines across the Creative Cloud applications, because designers expect the same results when they use the same settings. Unfortunately, that makes us assume that every other non-Adobe application does exactly the same.

If you use something like Illustrator to produce a layout, the text will remain consistent, whether you print, make a PDF, or export a bitmap graphic for online use. But Adobe doesn’t develop web browsers. That means that browsers made by different companies will render HTML code and text slightly differently. You can control most aspects of text – such as font, size, leading, spacing, et cetera – but it’s best to expect that subtle typography won’t be faithfully consistent across browsers.

A good example: the way that you’re trying to vertically centre text in the buttons on your website design. This is very easy in InDesign, where you can control the position of the first baseline in a text frame. But HTML+CSS doesn’t make this easy: just look at the way that text aligns vertically on buttons on the Adobe Support Community website. And try it in different web browsers too.

How do you solve this problem? You could ignore it: ‘good enough’ may be better than perfection. You could adjust your design slightly, so that it’s not as visually obvious. There’s one thing for certain: the web browsers aren’t going to change that much, so the rendered text that you see in your browser on Windows isn’t going to do what you want. Even if you HTML+CSS code is perfect and standards-compliant.

I’m afraid that this doesn’t solve your immediate problem. But hopefully it explains why you’re observing inconsistencies between your Macintosh and Windows web browsers. It’s up to you to decide how you want to adapt your current design to produce something that’s ‘good enough’ for your clients.

One important point about why some of your Czech text may be missing diacritic marks like the háček (caron): some web browsers have inconsistent support for characters that fall outside of the ISO 8859-1 Basic Latin character set:

https://en.wikipedia.org/wiki/ISO/IEC_8859-1

ISO 8859-1 supports most Western European languages, but not Central and Eastern European languages like Czech that require specific diacritic marks. That means you could have the correct HTML code and webfonts with Czech character encoding, but certain web browsers will simply ignore specific characters or render them in another font. That’s what I see on the Adobe Support Community website any time the standard Czech character ‘č’ appears in text, no matter which web browser I use. That may explain what you’re seeing in your Windows web browser.

It looks like your website is primarily designed for Czech, English, French, and German. English, French, and German are part of the ISO 8859-1 Basic Latin character set, but Czech isn’t. Luckily, it appears that New Rubrik supports Czech:

https://fonts.adobe.com/fonts/new-rubrik#details-section

Although Czech is supported, it’ll be important to make sure that you configure the webfonts for your website correctly. When you add a webfont to a website, you have the choice of which languages and features in the font you want to use. To add support for Czech, you’ll need to choose one of the following font encodings:

• All Characters
• Dynamic Subsetting
• Language Subsetting (Czech, English, French, and German)

Don’t choose the ‘Default’ character set, as this will leave out the critical characters you need, like ‘č’. You’ll find more details on Adobe’s support website:

https://helpx.adobe.com/fonts/using/language-support-subsetting.html

I hope that answers your questions. If not, please let me know.

Best regards
Andrew

–30–

Hi there,

We're sorry about the trouble. Would you mind sharing the screenshot of the issue in order to assist you further? Is the Adobe font not activating? Please elaborate more on the issue.

You may also check this article and let us know if that helps:- https://helpx.adobe.com/fonts/kb/troubleshoot-font-activation.html

Regards,

Tarun