Font Awesome For Fast, High-Resolution, Accessible Icons In Moodle 3.3


No matter how much internet speeds increase in each new generation, efficiency is a critical concern of every IT operation. The entry of mobile as a more dependable connection to the internet (including, of course, LMS) poses a new challenge when it comes to efficiency in the User Interface (UI), as sites have to guarantee a perfect look no matter the platform used to access it.

Post Pages - Post Inline - WIRIS

Responsiveness became the answer. One interface, with behavior rules that would change its layout and size, solved all the web designers’ prayers. With one exception. Images used as key navigation pointers across a site are harder to optimize for all sites. If they are too small, they look pixellated on larger and higher resolution screens. If they are too large, they make the site take longer to load on small devices where the image will not even be appreciated.

Open Source developer Dave Gandy saw how widespread this problem was and came up with a clever solution based on fonts. Unlike images, fonts can scale without losing their form. Just open a text editor, write anything, and make the text as gigantic as you want. Try it on any font. You will never see pixels.

Even today, after 4 versions of Font Awesome developed by Gandy (with the support of volunteers, and the addition of many new icons each time) the font excels at giving designers hundreds of icons, while being lighter than a high resolution image. Now, in Moodle 3.3, Font Awesome comes as the default method of display for all the icons on the Site.

Here are some of the advantages of Font Awesome for Moodle, as shown in the video:

  • A comprehensive list of frequently used icons, available at low bandwidth and speed costs.
  • A unified selection offering a visual standard across sites.
  • Improved performance and efficiency when showing pages.
  • High contrast and prominence that remains so when scaled to any size.
  • Conformity of the site’s icons to modern accessibility standards.
  • Easily-changed color with CSS properties.
  • The need for only a single download, if the official BootstrapCDN is used to source Font Awesome, to display icons from every site that uses the CDN.
  • Last but not least, Open Source license.

The Font Awesome icons are enabled by default across Moodle 3.3. menu items, and the options on the text editors. Up-to-date themes can take advantage of Font Awesome, but they can also override it.

Check out our complete Moodle 3.3 coverage.

Download the latest Moodle 3.3 at

Moonami LogoThis Moodle Technology related post is made possible by: Moonami a company that provides a full range of Moodle services that combine the flexibility, scalability, and power of Amazon’s world-leading cloud platform (AWS) with fanatical Moodle support. Click here to learn more.

Previous articleMoodle 3.3 released today – upgrade your Moodle sites soon #Moodle3.3
Next articleEnchanting Enhancements To Activity Completion Options For Moodle 3.3


Please enter your comment!
Please enter your name here

This site uses Akismet to reduce spam. Learn how your comment data is processed.