Connecting dots for digital learning and teaching

Considering Font Display and Shape Rendering in Mobile Courses

(This is the 11th article of the series of learning design tips from dominKnow KnowledgeBase)

Platform and browser differences and considerations for creating courses in Claro

Font display in courses is dependent on the fonts the user has installed on their system, as is the case with any web site. Most systems (Mac and PC) have all of the fonts that come with Claro.

Font type displays slightly larger on Windows Operating Systems and sometimes appears lighter in weight than on Mac Operating Systems. This is due to a difference in pixel rendering.

Different browsers may also have an impact on how your text displays. Firefox, for example, displays line height differently from other browsers. In Claro, we’ve eliminated this difference by setting a default line-height value but font rendering differences may still cause line breaks at different places. On some pages, this may mean your four line paragraph becomes five lines.

Some browsers render pixels differently when anti-aliasing and kerning, and this can cause text to vary in weight as well.

Any of these issues may cause variations in letter and word spacing that can affect line breaks and the amount of space your text requires. Plan your page and text boxes to allow for 10-15% enlargement.

font display in mobile coursesCheck your course and make corrections as required for better accommodation across platforms. Some solutions may just involve increasing the width of text boxes, re-sizing hotspots, or editing for fit.

To view and download this document including screenshot examples, click Platform and browser differences and considerations for creating courses in Claro.

Bottom line: If your learners use different operating systems and browsers, make sure you do a thorough QA of your course on different devices, OSs, and browsers. There are tools and sites available on the web to assist in this process. Try searching for terms such as “font differences browsers systems” and check out the resource links below.


The following are some resources you may find useful:

Related article:


Tagged as: ,

Your thoughts?

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

“Tell me and I will forget, show me and I may remember, involve me and I will understand.” -------- Chinese Wisdom "Games are the most elevated form of investigation." -------- Albert Einstein
"I'm calling for investments in educational technology that will help create digital tutors that are as effective as personal tutors, educational software as compelling as the best video game," President Barack Obama said while touring a tech-focused Boston school (year 2011).
%d bloggers like this: