Copy link to clipboard
Copied
Hi,
I used Verdana font in my project. When I published the course and run on Google Chrome, all the objects and fonts look same as in the source file. But when I run the same publish in the Internet Explorer, the fonts look different. The bold font looks extra bold and the width of the font extend upto one line. In some places the text box automatically squeeze and create a arrow at the bottom right corner of the text box to show the complete text.
Below is the screenshots for reference
Google Chrome
.
Internet Explorer
Copy link to clipboard
Copied
Are these responsive design projects or blank projects (non-responsive)?
Copy link to clipboard
Copied
Hi Paul,
These are responsive design project.
Copy link to clipboard
Copied
So that means the browser is rendering the actual fonts and you are not seeing an image of the various text objects. The difficulties with various browsers are they all have their own rendering method for content intended to be displayed on the web, including the fonts themselves. IE11 is actually kind of an old browser at this stage. Microsoft still supports it, mostly for companies who require it for older web applications that they wish to continue to support. I'm sure Microsoft would love to get rid of it at this stage but they don't want a revolt from all those Windows Enterprise customers.
Rather than using what is technically a system font for your eLearning, why not try using an Adobe Font? While Verdana is considered web-safe, because of the nature of different devices, even something as universal as Verdana will look vastly different on different devices anyway. Choosing an Adobe Font still may show some differences from what you see on your computer versus on the web, you can be sure that every person accessing your course will see the same web font from Adobe's server. The only possibility of problems is if users attempt to launch your course but don't have access to the regular web while taking the course.
Copy link to clipboard
Copied
Thanks for the update, Paul.
The font issue only exists in a responsive project. But when I developed the same module in a blank project, it shows the exact font shape and size in all browsers, which I used while developing the module.
The only challenge is in the responsive project.
Copy link to clipboard
Copied
Static text objects in a non-responsive proect are converted to images. That is not possible for a responsive project.