Design Tips: Typography

Quadrigram editor offers twenty different typefaces. Whether it is for a web article or a slide presentation, the shape and structure of your text is important. While there are many categories for typefaces, there are two which stand out, serif and sans-serif.

Serif typefaces are recognized by the vertical and horizontal lines at the end of a letter. Times New Roman, the default font for Word, is a serif typeface. These typefaces are traditionally seen in printed matter, such as books, magazines and newspapers. Many publications that have transitioned to digital and web based publications have incorporated these styles to maintain the “look and feel”.

Unlike serif typefaces, sans serif typefaces appear to be more modern. Google’s Chrome and Android uses Roboto. These typefaces are admired for their sleek appearance and clean geometric shapes.

The option to go serif or sans serif is up to you, and both are equally valuable given the ease of reading text with today’s high screen resolutions. Here are some best practices when using typography.

Best Practices

  • Think thick for Headers. Thin for Body. Typefaces with a high stroke contrast (e.g. thick fonts) are great for headers. For the body text, however, consider using low-stroke contrast. For instance, Roboto or Georgia typeface, to maintain a consistent and legible body text for your story.
  • Keep it Simple. Whereas you can use one typeface for the header and another for the body, avoid mixing typefaces in the same document. A consistent uniform typeface helps deliver confidence and cleanliness in your story.
  • Mix Styles to Create Contrast. You can combine serif and sans serif typefaces of similar or the same family to create contrast. For instance, use droid serif as header and droid sans for the body. This will keep things fresh for the eye without losing style.
  • Consider Character Length. Long lines of text tire the eye. Aim for 45–90 characters per line to ensure your audiences remain engaged.

Quadrigram Text Editor

When working with text in Quadrigram your text editor will appear as the image above. There are four areas to consider when working with typography.

  • Size of the typeface must be legible. While these vary depending on the typeface, standard sizes for web range between 14–24 pixels.
  • Line Height ideally set at normal. You can increase by pixel size. Line height at 1.5 for 18 pixels is 27, for instance.
  • Spacing depends on the size of the text. The optimal line spacing is considere around 120% to 150%. 18 pixels text size should have 22 to 27 line spacing.
  • Color choose for legibility. Dark text with white background or vice versa.

Thanks for reading! We are always looking to improve so write to us on our community if you have any questions or let us know what you think with some feedback!

Categories: Design Tips

Tags: typography

Originally published at on January 11, 2017.