Highlighted

web font display discrepancies

New Here ,
Nov 13, 2017

Copy link to clipboard

Copied

I’ve built a simple responsive site in Muse 2017. Across the site I’ve used a Google font called Muli (and Muli light)

In Muse preview, all the copy looks perfect. When I view the site in Chrome and Safari, all the copy looks perfect. However when the client views the site - also in Chrome, and in Explorer - certain areas of the copy look crushed.

I don’t understand why this is happening for the client and not for me in the same browser.

Things I’ve tried:

removing faux bold styles;

changing the colour

changing the size (there are places where a smaller point size looks perfect)

re-entering the copy

clearing client’s cache and cookies

changing client’s monitor resolution

…and nothing has helped. As the problem happens for the client and not for me, I’m wondering if there’s a problem accessing the Google font, but that doesn’t make sense because there are other areas of the site with the same font at the same size where it loads perfectly.

Anyone experienced this before? Any ideas how to fix it?

Adobe Community Professional
Correct answer by fotoroeder | Adobe Community Professional

This seems to be another issue, I must admit. Are there any 3rd party widgets? How did you embed/import the self hosted google font?

As you can watch in the video tutorial it needs to have a woff and/or an svg and or EOT, right?

Bildschirmfoto 2017-11-13 um 18.04.00.png

Best Regards,

Uwe

Views

203

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

web font display discrepancies

New Here ,
Nov 13, 2017

Copy link to clipboard

Copied

I’ve built a simple responsive site in Muse 2017. Across the site I’ve used a Google font called Muli (and Muli light)

In Muse preview, all the copy looks perfect. When I view the site in Chrome and Safari, all the copy looks perfect. However when the client views the site - also in Chrome, and in Explorer - certain areas of the copy look crushed.

I don’t understand why this is happening for the client and not for me in the same browser.

Things I’ve tried:

removing faux bold styles;

changing the colour

changing the size (there are places where a smaller point size looks perfect)

re-entering the copy

clearing client’s cache and cookies

changing client’s monitor resolution

…and nothing has helped. As the problem happens for the client and not for me, I’m wondering if there’s a problem accessing the Google font, but that doesn’t make sense because there are other areas of the site with the same font at the same size where it loads perfectly.

Anyone experienced this before? Any ideas how to fix it?

Adobe Community Professional
Correct answer by fotoroeder | Adobe Community Professional

This seems to be another issue, I must admit. Are there any 3rd party widgets? How did you embed/import the self hosted google font?

As you can watch in the video tutorial it needs to have a woff and/or an svg and or EOT, right?

Bildschirmfoto 2017-11-13 um 18.04.00.png

Best Regards,

Uwe

Views

204

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Nov 13, 2017 0
Adobe Community Professional ,
Nov 13, 2017

Copy link to clipboard

Copied

Google fonts, at least some of them (or even worse - the most) are not that easy to use in muse.

You must, other, than typekit and web edge fonts "import" them into muse.

Watch this: Add self-hosted web fonts |

There´s a widget from qooqee, that allows to add google font but support is very unuseful (my experience),

you may also have a look to find something similar at "musewidgets.com".

Is there a tiny little "T" in the bottom right corner of the text box, using Muli?

The reason you see the fonts perfect on your side on your site – it is hosted on your computer but not on the machine from client or any other user.

Best Regards,

Uwe

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Nov 13, 2017 0
New Here ,
Nov 13, 2017

Copy link to clipboard

Copied

Hey, thanks for the reply.

Nope, no tiny 'T.' What would that signify?

Your answer makes sense,  but I'm not clear on why for the client most of the text on the site, in Muli, loads perfectly. From that I'd assume the web font is loading correctly, no? The problem is that on one page 14-point Muli light is perfect, and on another, 14-point Muli light is crushed.

I'll follow the video instructions...

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Nov 13, 2017 0
Adobe Community Professional ,
Nov 13, 2017

Copy link to clipboard

Copied

This seems to be another issue, I must admit. Are there any 3rd party widgets? How did you embed/import the self hosted google font?

As you can watch in the video tutorial it needs to have a woff and/or an svg and or EOT, right?

Bildschirmfoto 2017-11-13 um 18.04.00.png

Best Regards,

Uwe

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Nov 13, 2017 0
New Here ,
Nov 13, 2017

Copy link to clipboard

Copied

Two third party plugins: Menu Restyler from Museshop on the master page, and Google analytics from Musethemes on every page (there are only five).

The Muli font came with a Template called Remy from Qooqee, which I started with and slashed down to the simple site it is now.

I’m immediately out of my depth when we start talking about woff and EOT….from what you’re showing me I’m starting to think the problem is that the font isn’t installed properly. Thanks for the video, will investigate further when I’ve made sense of it.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Nov 13, 2017 0
Adobe Community Professional ,
Nov 13, 2017

Copy link to clipboard

Copied

The information "Qooeqee" would have been interesting for us a lot. Because they also created the google font widget.

You should ask them for your issue. If they create a template and this doesn´t work, we can hardly help, I guess.

Best Regards,

Uwe

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Nov 13, 2017 0