Infographic For academia

How to create beautiful courses by mastering colors, fonts and layout

Teachers are like chocolate makers.

You want your students to devour the knowledge you share just like they devour chocolate. But even though you create the best product, kids will always have a weakness for the one in the most beautiful packaging. Too many teachers focus on the educational part of their courses - making the chocolate - and simply forget about, or even ignore the visual part - adding a nice packaging to it.

Wrapping your course materials in a nice visual way is not that hard, and shouldn't take much time. So check out the next tips on colors, fonts, and layout.

Choose a great color theme

The color theme offers the most visual cues to your students. Go for a neutral color for most text, a contrasting background color and choose a statement color for emphasis. You have two big options:

a) Use a default color theme.
No matter the online medium you choose to create a course in, you will have some default choices. Whatever you choose, the colors will play nicely with each other.

b) Play with a color wheel.
You just have to insert one color code and the wheel will pick the others for you. In order to find the right color codes, browser extension ColorZilla can help.
Identify and marry the right fonts

A bad pair of fonts can steal the show in your course. Students will find it harder to focus on your message when you use one or more inapropriate fonts. But if you use the exact same font all over, they'll get bored. So you need to have balance.

To get the name of a random font you find online, the browser extension WhatFont is very handy. If you want to find the font in an image, then WhatTheFont! is a better option. (However, it's not perfect.)

You can rely on font families for creating different styles of text or you could go for fonts with contrasting features and pair serifs with sans-serifs, thin with thick fonts, condensed with rounded-lettered fonts.
Design with the Z layout in mind

An average student's brain scans a lesson and identifies the interesting parts, the must-remember-for-test parts, and also the less important parts. And it does so in a blink of an eye. That's why all information should be structured in a visual layout.

According to the Z layout, people scan a page from the upper left corner, then go to the upper right corner, then all the way down diagonally to the lower left corner, and finish at the lower right corner.

If you place all your important educational information along the lines of this Z (and leave other lesson elements like a navigation menu for a sidebar) you increase the chances that your students will better retain that information.

Resources

How to create beautiful online courses:

Visit our Blog for insightful posts on edtech for K-12 and Higher Ed.

All infographics Next infographic

How to create beautiful courses by mastering colors, fonts and layout

Choose a great color theme

Identify and marry the right fonts

Design with the Z layout in mind

Resources