Web Development Articles from Joopk

Website Design, SEO, CSS, and More!

The Joopk content management system was developed by a team of skilled development professionals. That said, we would like to think we know our stuff. On this page, we will share our thoughts and advice about web development, search engine optimization (SEO), cascading style sheets (CSS), and much more with our clients and non-clients alike. Visit our page often for new tips and tricks of the trade.

Knowing the Difference between Typeface and Font

Unless you’re a web designer or typographer, you probably do not understand the difference between the words typeface and font. If you do, congratulations, you are part of the minority. However, people frequently confuse the two. Or worse, use the words interchangeably when they have entirely different meanings.

For instance, the word typeface refers to the design of the text, while font is actually the file type or format of putting the typeface on print or web. For those of you who are still confused, this analogy may help.

According to typographer, Nick Sherman:
“The way I relate the difference between typeface and font to my students is by comparing them to songs and MP3s, respectively (or songs and CDs, if you prefer a physical metaphor).”

Or, as Stephen Coles of The Font Feed commented:

When you talk about how much you like a tune, you don’t say: “That’s a great MP3”. You say: “That’s a great song.” The MP3 is the delivery mechanism, not the creative work; just as in type a font is the delivery mechanism and a typeface is the creative work.

Hence, typeface is what you see and font is what you use. Now that you understand the difference between typeface and font, it’s important to understand how they are used in web development.

Prior to the digital revolution, Times New Roman was standard for all websites. The idea of integrating typographical techniques and style rules was entirely unheard of. However, since the invention of the Cascading Style Sheets (CSS), designers now have the freedom to alter different typography to any format they choose.

CSS define how HTML elements should be displayed. For example, sizes, colors, formatting, line spacing and indentation. Unfortunately in web typography, designers cannot entirely control how people experience a web page like they can with print. Depending on user preferences and operating systems, text can look entirely different to each person.

Regardless, web typography has changed the way developers build websites. Gone are the days when developers had to remain within the lines—literally. Web developers today can alter web text sizes or emphasize words, making sites better and more appealing to visitors. Essentially, the addition of CSS and web typography has enhanced the overall user experience.

Interested in learning more about web typography? Check out this new resource for web typographers: click here