Storyline 360 font issue when html5 only

Hello,

I am having an issue when publishing out to "html5 only" where the font in the file is not reflected in the html5 output. See attached images. One showing the storyline file using Museo Sans 500 font. One showing the html5 output without that font showing up. Flash version as usual is fine if I export to Flash default. Any thoughts?

Thanks,
Dan

29 Replies
Alyssa Gomez

Hi Dan, thanks for that information. Your situation matches the issue that has been reported to our Quality Assurance team. Although I can't offer a timeframe for a solution, I'll certainly pop back into this thread and post updates when they're available.

In the mean time, our engineers have offered this workaround:

  1. Duplicate the slide in the upgraded project.
  2. Copy the text into notepad.
  3. Delete the Textbox
  4. Create a new Texbox
  5. Copy the text from notepad into the new Textbox.
Agnieszka O'Keeffe

Hi, I am looking for solution to a problem with text when publishing out in HTML5. It looks  that it changes font and also for some reason letter F is not recognised and looks like a box. The same like on the print screen attached by Dan. Is this also a common issue that needs a solution?This box I mean?

Alyssa Gomez

Hi again! Since this issue is server-specific and not font-specific, your course may appear differently for different users. If the box/emoji issue is affecting all learners, not just those with content blockers, it's likely the server where your courses are hosted isn't configured to properly serve WOFF files. 

Ali Goulet

Hey all,

Great news - Articulate 360 Update 5 is now available! It includes a number of fixes detailed in the release notes here.  

The item you may be interested in is how it fixed an issue where fonts such as Poppin and Kalam were not displaying properly. We're still working on some other fonts and we'll keep you posted!

Launch the Articulate 360 desktop app on your computer and click the “Update” button next to each tool.

Let us know if you have any questions!

Alyssa Gomez

Thanks, Matt! I do see that you worked with Angelo in your case. 

I've seen instances where font displays incorrectly when the file is uploaded to one server, but it looks fine when it's uploaded to another server. If that happens, your server may not have WOFF file support--you can ask your server admin for more information on that. 

A good way to test this is to send us your file, we'll publish it, then we'll send you a link to the published file. If the font looks good, we can assume that you'll need to add WOFF file support to your server.

If you'd like us to take a look at your file, you can send it directly to Angelo using this link. Thanks!

Brek Joos

We seem to be experiencing the same issue, but it only affects our Windows 10 users in IE11. Until we get this resolved with our IT department, we ask those Windows 10 users to use Edge (which is often already installed), or another browser.

There are documents online that suggest some Trusted Font settings to resolve the issue. We haven't confirmed that this solves the problem.

Ashley Terwilliger

Hi Brek and Susanne,

I'm sorry you've run into this issue, and it looks like you're both also subscribed and posting in that other forum discussion.

I hope you're able to find the information you need there, and as Brek mentioned it's a setting within the IE11 browser specific to some user's environments. In the meantime, you shouldn't see this issue in Edge, Chrome, Firefox or Safari. If you do, please let us know as it' would likely be a separate issue. 

Kenneth Minnich

Hi. 6 months later and this issue hasn't been fixed? I have some users accessing courses in IE11 who still experience the issue Dan posted above. 

I'd recommend allowing Storyline users the option to display text as images (this is a feature in Lectora which ensures learners always see the correct font). 

Leslie McKerchie

Hi Kenneth and welcome to E-Learning Heroes :)

Sorry to hear that you've run into an issue with this as well.

We are tracking and reporting these individually so that we can understand the specific font and environment being used.

If you could share those details here as well as a .story file for us to take a look, that would be great.

Kenneth Minnich

Hi Leslie, and thank you for the reply. 

I can share some details. This was an eLearning created in SL360. The font is Franklin Gothic Book (a pretty standard font). I observed the font displaying differently with users running on IE11, exactly as Dan described and looking exactly as he depicted in his images. What's even more interesting is that the users already had Franklin Gothic Book installed as a font on their computers, so it's not that this was a non-standard font that they didn't have. 

The solution for me was to publish prioritizing Flash and using HTML5 as a fallback. This way, IE11 defaults to flash output but Chrome will default to HTML5. 

Example