the-complete-list-of-font-formats-and-their-use

We’re all familiar with the current font formats (otf and ttf) that we can install on our computers and even on mobile devices. But what about web fonts? Or apps? After a long debate on Twitter, I decided to write about different font formats and their uses.

What I learned from that debate is that different things happenning in the same environment may become confusing and are regarded as being the same or similar, and different font formats are associated with the wrong use. When it comes to web, it seems that not all font authors know exactly how their work is used, and this might contribute to the paradoxical font licensing I previously wrote about.

Same environment doesn’t mean all things happening there are the same and use the same tools

Why do I say that? Well think about it this way: in a house 2 people can do 2 different things, one is cooking and one is sleeping. So these activities are performed each by different entities, they output different results, have different purposes, and need different tools. They have nothing in common other than taking place in the same house.

The same goes for things happening on a server. A server is actually a computer with some specific software installed, and computers can be used for different things that are not necessarily related between them other than using the same environment.

The example I wanted to give was about two things that happen on a server, both of which include the usage of fonts in two very different ways.

The two things are: server-side PDF generation and dynamic content generation with a CMS.

What is a CMS?

CMS stands for Content Management System, and we have the most popular example of CMS out there: WordPress. It’s a software that takes the content you write in a dashboard and creates a page with it using a pre-built template. This operation is done on the server, where the content is stored in a database.

But whether using a CMS or not, all websites need a server to be hosted on to be viewable/accessible online, and they all use the same font format — .woff2 and .woff. Woff2 is the newest version of .woff, with improved compression algorithm.

What exactly is .woff2/.woff format?

Woff stands for Web Open Font Format and is a web-exclusive font format that cannot be used anywhere else or in any other environment. It’s a compressed format created especially to be “read” by browsers that will then render the website texts in it.

It cannot be installed on a computer, and it cannot be converted back to desktop font.

You can learn about how to embed web fonts self-hosted with @font-face, from Google Fonts, or correctly include them in WordPress, with the quick guide to using web fonts.

How difficult is it to create .woff fonts?

Not at all. It only takes seconds to convert a desktop font to web format (woff). It can be done with FontSquirrel’s free webfont generator for example (though please note that your font license must allow that), or in almost all cases font creation software has buil-in option to export in different formats, including web.

No extra work from the font’s author is necessary.

What do CMS and PDF generation have in common?

Short answer is: nothing much. Other than being software that runs on a computer, nothing. Content generation has nothing to do with PDF generation.

Actually software itself is a very broad term that includes a huge amount of types, purposes, programming languages, and environments under the same generic name.

Font formats currently in use

Font format Use Installable on a computer/server
Desktop:

.otf

.ttf

PostScript
Everything that requires locally installable fonts, including branding/logo, graphic design, video production, PDF generation, server install, and mobile apps. Yes ✓
Web:

.woff2

.woff
All types of websites, including websites that use a CMS like WordPress or a platform like Shopify No ×
Proprietary formats Only included in the apps they were designed for. An example would be LaTeX No ×

Logos, graphic illustrations, and banners you see on websites are images made with desktop fonts. Web fonts are used only for content text (like the one you’re reading now).

Although OTF and TTF are the standard for digital (not web), DTP (desktop publishing) and print industry still frequently use Adobe’s older standard format — PostScript. PostScript fonts have multiple extensions:

  • .pfb, .pfm, .afm (Windows)
  • .pfm, .afm, .inf (MacOS)
  • .pfa, .afm (Linux)
  • .ofm (OS/2)

The proprietary font formats are a bit beyond the scope of this article, as their use is strictly limited to the app they were designed for and were mostly created before the current standard formats.

Legacy web font formats not in use anymore

Note: EOT, TTF, and SVG (mentioned below) can still be seen on websites created a few years ago.

  • TrueDoc — developed by Bitstream in 1994, it was included with Netscape Navigator from version 4 to 6. While while not specifically a webfont format, it was the first standard for embedding fonts on web
  • EOT (Embedded OpenType) — a proprietary format owned by Microsoft and used in Internet Explorer from version 4 to 11
  • SVG (Scalable Vector Graphics) — used in old versions of Webkit-based browsers, mainly in Safari and iOS Safari but also available in Chrome 4-37 and Opera 10-24, it has been replaced by the standard .woff. This format should not be confused with the currently available svg format which is desktop installable only and can only be used in graphic software such as Adobe Illustrator.
  • TTF (TrueType Font) — While some browser compatibility still exists, this is absolutely not recommended for use, as woff format is essentially a compressed form of .otf and .ttf with additional metadata that can be read by the browser.

Legacy desktop font formats not in use anymore

Bitmap/raster — First type of fonts available in computers. You’ll recognize them as having a pixelated aspect and not being scalable. Each glyph is a bitmap (array of pixels).

There were a lot of non-standardized formats, as each operating system and software created its own:

  • PCF (Portable Compiled Font)
  • BDF (Glyph Bitmap Distribution Font)
  • SNF (Server Normal Font)
  • DWF (DECWindows Font)
  • BF, AFM (Sun X11/NeWS Font)
  • FON (Microsoft Windows)
  • Amiga Font
  • ColorFont
  • AnimFont
  • BMF (ByteMap Font)
  • PSF (PC Screen Font)
  • PK (Packed bitmap font bitmap file for TeX DVI drivers)
  • FZX (proportional bitmap font for ZX Spectrum)

149 comments

  1. Hi, Neat post. There is a problem together with your website
    in internet explorer, would check this? IE still is the market leader and
    a big component to people will leave out your fantastic writing because of this problem.

  2. Excellent pieces. Keep posting such kind of info on your blog.
    Im really impressed by your site.[X-N-E-W-L-I-N-S-P-I-N-X]Hey
    there, You have performed a fantastic job.

    I’ll definitely digg it and personally recommend to my friends.
    I’m confident they will be benefited from this web site.

    my web blog – http://www.lubertsi.net

  3. Excellent post. I used to be checking continuously this blog and I am impressed!
    Very helpful information particularly the remaining section 🙂 I deal with such info much.

    I was looking for this certain info for a long time. Thank
    you and best of luck.

    my site – http://www.cyberangels.pl

  4. Oh my goodness! Impressive article dude! Thank you so much, However I am encountering problems with your
    RSS. I don?t understand why I am unable to join it.
    Is there anyone else having similar RSS issues?
    Anybody who knows the solution will you kindly respond?

    Thanx!!

    Also visit my web page :: clubriders.men

  5. My partner and I stumbled over here different page and thought I should check things out.
    I like what I see so now i am following you. Look forward
    to looking over your web page for a second time.

    Feel free to visit my web-site: live222 Download

  6. Hi there! This post could not be written any better!

    Going through this article reminds me of my previous roommate!
    He constantly kept preaching about this. I’ll forward this
    post to him. Fairly certain he will have a good read.
    Thanks for sharing!

    Check out my page purry888

  7. I have noticed that costs for on-line degree pros tend to be a greqt value.
    For instance a full 4-year college Degree in Communication in the
    University of Phoenix Online consists of Sixty creditss with $515/credit or
    $30,900. Also American Intercontinental University Online
    comes with a Bachelors of Business Administration with a whole course element of 180 units and a price of $30,
    560. Online learning has made obtaining yur college diploma far lsss
    difficult because you could earn your degree through the comfort of your dwelling pace and when you finijsh
    from work. Thanks for all tis I have learned from your site.

  8. Very good blog! Do you have any recommendations for aspiring writers?
    I’m hoping to start my own blog soon but I’m a little lost on everything.
    Would you propose starting with a free platform like WordPress or go
    for a paid option? There are so many options out there that I’m totally confused
    .. Any suggestions? Many thanks!

    my web page joker888 download for android

  9. naturally like your web-site however you have to check the spelling on quite a few of your posts.
    A number of them are rife with spelling issues and I find
    it very troublesome to inform the truth however I will certainly come again again.

    Also visit my web blog http://www.zgyssyw.com

  10. Definitely believe that which you stated. Your favorite reason seemed to be
    on the web the easiest thing to be aware of.

    I say to you, I definitely get irked while people consider worries
    that they just don’t know about. You managed to hit the nail upon the top and defined
    out the whole thing without having side-effects , people can take a signal.
    Will likely be back to get more. Thanks

  11. Hello my friend! I want to say that this article is amazing,
    nice written and include approximately all vital infos.
    I’d like to see extra posts like this .

    Here is my webpage; Rollex11 Pc

  12. Hey There. I discovered your weblog the use of msn. This is an extremely well written article.
    I will make sure to bookmark it and return to learn extra of your useful info.
    Thanks for the post. I’ll definitely return.

    my website … scr ace333

  13. Hey tһere! I know thiѕ is somewhat off topic but I was wondering which blog plwtform are
    you using for thіs sіte? I’m getting sick and tired of Worⅾpress because
    Ι’ve had problems wiyh hackers and I’m looiing at alternativeѕ for another platform.

    I would be аwesome if you could point me in the direction of a good platform.

  14. Oh my goodness! Awesome article dude! Thank you so much,
    However I am encountering troubles with your RSS.
    I don?t understand the reason why I am unable to subscribe to it.
    Is there anybody else getting the same RSS problems?

    Anyone that knows the solution will you kindly respond? Thanx!!

    Here is my web-site kebe.top

  15. Thanks a lot for being my own teacher on this theme.
    My spouse and i enjoyed your own article a lot and most of all
    appreciated the way in which you handled the aspect I regarded as being controversial.
    You happen to be always really kind to readers much like me and assist me to in my living.
    Thank you.

    my page: portaldocloud.com

  16. I in addition to my guys have already been going through the
    nice tips from your web page then the sudden came up with a horrible feeling I never expressed respect
    to you for those techniques. All the young men happened to be as a result thrilled
    to read all of them and now have actually been loving them.
    I appreciate you for truly being so considerate and also for going for this sort of impressive information most
    people are really desirous to be informed on. My honest regret for not expressing gratitude to you earlier.

    Feel free to surf to my website; dysonvacuumdc24.com

  17. wonderful publish, very informative. I wonder why the opposite specialists of this sector don’t notice this.
    You should continue your writing. I am confident, you have a huge readers’ base already!

    Here is my webpage :: mpc-install.com

  18. Aw, this was an exceptionally good post. Spending some time and actual effort to make a very
    good article… but what can I say… I put things off a
    lot and don’t manage to get anything done.

    Feel free to visit my webpage … mpc-install.com

  19. Hey There. I found your weblog the usage of msn. That is a really well written article.
    I will make sure to bookmark it and return to read extra
    of your useful information. Thank you for the post. I’ll certainly return.

    Here is my site … http://www.atomy123.com

  20. An impressive share! I have just forwarded this onto a colleague who had been conducting a little research on this.

    And he actually ordered me lunch because I discovered it
    for him… lol. So let me reword this….
    Thank YOU for the meal!! But yeah, thanx for spending some time
    to talk about this issue here on your site.

    Also visit my site; http://fenshuajiang88.com/

  21. Thanks on your marvelous posting! I genuinely enjoyed reading it, you’re a great author.
    I will be sure to bookmark your blog and will eventually come back later in life.

    I want to encourage you to ultimately continue your great posts,
    have a nice weekend!

    Feel free to surf to my blog post :: frun-test.sakura.ne.jp

  22. Admiring the commitment you put into your site and detailed information you offer.

    It’s nice to come across a blog every once in a while that isn’t the same old rehashed
    information. Great read! I’ve bookmarked your site and I’m including your RSS feeds to my
    Google account.

    My webpage … lovegamematch.com

  23. I feel that is among the such a lot important
    information for me. And i am glad reading your article.
    But want to observation on few basic issues, The website taste is wonderful, the articles is in point of fact nice : D.

    Good activity, cheers

    Here is my site http://www.qijiang520.com

  24. Hi there to all, the contents existing at this website are truly remarkable for people knowledge, well, keep up
    the good work fellows.

    Also visit my homepage … kebe.top

  25. I and also my buddies have been looking at the best things on your
    web site and so all of a sudden came up with a terrible suspicion I had not thanked the
    blog owner for those techniques. Those guys happened to
    be so joyful to learn them and now have really been enjoying them.

    I appreciate you for turning out to be quite considerate and for considering variety
    of fine subject areas millions of individuals are really desirous to
    learn about. Our own honest regret for not expressing appreciation to you earlier.

    Feel free to visit my homepage https://mpc-install.com/punbb-1.4.6/viewtopic.php?id=377921

  26. Nice post. I learn something totally new and challenging on websites
    I stumbleupon everyday. It’s always helpful to read through articles from
    other writers and practice a little something from
    other websites.

    Take a look at my blog ibbs.uu.cc

  27. hello there and thank you for your information ?
    I’ve definitely picked up something new from right here.
    I did however expertise some technical points using this web site, as I experienced to reload the web site a lot
    of times previous to I could get it to load correctly. I had been wondering if your
    web host is OK? Not that I am complaining, but sluggish loading instances
    times will often affect your placement in google and can damage your high quality
    score if advertising and marketing with Adwords. Anyway I
    am adding this RSS to my e-mail and can look out for much more of your respective
    fascinating content. Ensure that you update this again soon.

    My web blog – https://aida-ro.com

  28. hello there and thank you for your information ?
    I have certainly picked up anything new from right
    here. I did however expertise some technical issues
    using this web site, since I experienced to reload the web
    site many times previous to I could get it to load properly.

    I had been wondering if your web host is OK? Not that
    I’m complaining, but slow loading instances times will
    very frequently affect your placement in google and can damage
    your high-quality score if advertising and marketing with Adwords.

    Well I’m adding this RSS to my email and could look out for a
    lot more of your respective interesting content.
    Ensure that you update this again soon.

    my web blog :: mpc-install.com

  29. Link exchange is nothing else however it is only placing the other person’s
    webpage link on your page at proper place and other person will also
    do same for you.

    Take a look at my web page; lubertsi.net

  30. This is very interesting, You are a very skilled blogger.

    I have joined your feed and look forward to seeking more
    of your wonderful post. Also, I’ve shared your web site in my social networks!

  31. Terrific paintings! This is the kind of information that are meant to be shared around
    the net. Disgrace on Google for now not positioning
    this publish upper! Come on over and discuss with my site .

    Thank you =)

    Feel free to surf to my page … kebe.top

  32. Thank you for all of the efforts on this site. Gloria really loves engaging in internet research and it’s easy to see why.
    We notice all relating to the powerful mode you produce worthwhile techniques on your blog and even attract contribution from website visitors about
    this subject then our daughter has been becoming educated a whole lot.
    Have fun with the rest of the new year. You’re the one conducting a
    useful job.

    Look at my blog – chengdian.cc

  33. Excellent article. Keep posting such kind of info on your page.
    Im really impressed by it.[X-N-E-W-L-I-N-S-P-I-N-X]Hi there, You’ve done an incredible
    job. I will definitely digg it and personally recommend to my friends.
    I’m confident they will be benefited from this web site.

    my webpage https://kebe.top

  34. I am curious to find out what blog system you happen to be working
    with? I’m having some minor security issues with my latest
    blog and I’d like to find something more safeguarded.

    Do you have any recommendations?

    Feel free to visit my web page – bbs.yunweishidai.com

  35. This is very interesting, You are a very skilled blogger.
    I’ve joined your feed and look forward to
    seeking more of your fantastic post. Also, I’ve shared your site in my social networks!

    Here is my blog Blanca

  36. I want to to thank you for this very good read!! I absolutely enjoyed every bit of it.

    I have got you bookmarked to check out new stuff you post?

    My webpage: Edna

  37. Howdy! This article couldn?t be written any better!
    Reading through this article reminds me of my previous roommate!
    He always kept talking about this. I am going to forward this information to him.
    Fairly certain he’s going to have a very good read. Thanks for sharing!

    Feel free to visit my blog – mpc-install.com

  38. I do not even know how I finished up here, but I believed
    this post was good. I do not recognize who you are however certainly you are
    going to a famous blogger should you aren’t already.
    Cheers!

    Here is my web site; mpc-install.com

  39. Its like you read my mind! You seem to know so much about
    this, like you wrote the book in it or something.
    I think that you can do with a few pics to drive the message
    home a bit, but other than that, this is wonderful blog.
    An excellent read. I will definitely be back.

    My page; http://www.mhes.tyc.edu.tw

  40. A person essentially help to make significantly articles I might state.
    That is the very first time I frequented your
    website page and up to now? I surprised with the research you
    made to create this actual puut up incredible.
    Wonderful task!

  41. Hey I know this is off topic but I was wondering if you knew of any widgets I could add to my blog that automatically tweet my newest twitter updates.

    I’ve been looking for a plug-in like this for quite some time and was hoping maybe you
    would have some experience with something like this.
    Please let me know if you run into anything. I truly enjoy reading your blog and
    I look forward to your new updates.

    Feel free to visit my page: mpc-install.com

  42. F*ckin’ amazing things here. I’m very happy to look your post.
    Thanks a lot and i’m taking a look forward to contact you.
    Will you kindly drop me a e-mail?

    My web-site :: silvanus.us

  43. Good ? I should certainly pronounce, impressed with your site.
    I had no trouble navigating through all the tabs and related information ended up being truly
    simple to do to access. I recently found what I hoped for before you know it in the least.
    Reasonably unusual. Is likely to appreciate it for those who add forums or anything, website theme .
    a tones way for your client to communicate.
    Nice task.

    Look into my blog post; http://anapa-alrosa.com.ru/modules.php?name=Your_Account&op=userinfo&username=AbtFrancesca

  44. My husband and i felt really happy that Emmanuel could do his preliminary research through
    your precious recommendations he received out of your web page.
    It’s not at all simplistic to simply choose to be giving away points that some other people could
    have been selling. And we also consider we now have
    the blog owner to appreciate for this. All the illustrations you made, the
    simple website navigation, the friendships you will help to promote – it
    is many fabulous, and it is letting our son and us reason why that situation is brilliant,
    and that’s extraordinarily serious. Thanks for the whole thing!

    Here is my homepage :: lovegamematch.com

  45. I do not even know the way I finished up right here, but I believed this put up used to be good.
    I don’t recognize who you are but definitely you’re going to a well-known blogger when you
    are not already. Cheers!

    Feel free to surf to my blog: Alfonzo

  46. My partner and I absolutely love your blog and find
    almost all of your post’s to be exactly what I’m looking for.
    can you offer guest writers to write content for you personally?
    I wouldn’t mind creating a post or elaborating on a lot of
    the subjects you write regarding here. Again, awesome web site!

    My web site :: http://www.mhes.tyc.edu.tw

  47. Undeniably consider that which you stated. Your favorite reason appeared to be at the net
    the easiest thing to be mindful of. I say to you, I definitely get irked
    even as other folks think about worries that they plainly do not know about.
    You controlled to hit the nail upon the highest as smartly as outlined out the whole thing
    with no need side effect , other people can take a signal. Will
    probably be back to get more. Thank you

    My web page motofon.net

  48. I wanted to follow along and allow you to know how
    considerably I cherished discovering your blog today.
    I will consider it a honor to operate at my business office and be able to operate
    on the tips discussed on your website and also be involved in visitors’
    reviews like this. Should a position regarding guest article writer become offered at your end, i highly
    recommend you let me know.

    Here is my webpage; forum.bokser.org

  49. A fascinating dіscuesion is defіnitely worth comment. I believe that
    youu should publish mгe on this ѕubject, it may not be a taboo matter Ƅut typically peοple don’t
    diѕcuss such issues. To the next! Many thanks!!

  50. I think this is one of the most vital information for me.

    And i’m glad reading your article. But want to remark on some general
    things, The website style is ideal, the articles is really great :
    D. Good job, cheers

    My webpage :: Blast Desktop AC

  51. Thank you a lot for giving everyone an exceptionally pleasant chance to discover important secrets from this site.
    It’s always so nice plus jam-packed with a lot
    of fun for me personally and my office peers to search your blog at minimum 3
    times in a week to see the fresh guidance you will have. And lastly, I
    am at all times happy concerning the amazing
    guidelines you give. Selected 2 points in this posting are undoubtedly the very best we have had.

    My blog post: Tri-Bol Testo Review

  52. I’m curious to find out what blog platform you are using?
    I’m experiencing some minor security issues with my latest website and
    I would like to find something more risk-free. Do you have any
    recommendations?

    Also visit my webpage; Kali

  53. Outstanding post, I conceive website owners should learn a lot
    from this blog its real user genial. So much great info
    on here :D.

    Feel free to surf to my blog post Tri-Bol

  54. I was just seeking this information for some time. After 6 hours of continuous Googleing,
    at last I got it in your site. I wonder what’s the lack of Google strategy that don’t
    rank this kind of informative web sites in top
    of the list. Normally the top web sites are full of garbage.

    my web-site Kodo Detox Patches

  55. I’m truly enjoying the design and layout of your blog.
    It’s a very easy on the eyes which makes it much more pleasant for me to come here and visit more often. Did you hire
    out a developer to create your theme? Outstanding work!

    Here is my website: Kodo Detox Patch

  56. An outstanding share! I have just forwarded this onto a friend who has
    been conducting a little homework on this. And he actually bought me lunch due
    to the fact that I found it for him… lol. So let me reword this….
    Thank YOU for the meal!! But yeah, thanks for spending
    the time to talk about this topic here on your site.

    Here is my blog post: http://www.fotosombra.com.br

  57. Appreciating the time and effort you put into your
    website and detailed information you present.
    It’s awesome to come across a blog every once in a while that isn’t the
    same out of date rehashed information. Wonderful read! I’ve bookmarked your site
    and I’m including your RSS feeds to my Google account.

    Also visit my web site … http://www.dumankayahifit.com

  58. I happen to be writing to make you be aware of what a
    terrific encounter my friend’s child experienced visiting
    yuor web blog. She discovered such a lot of issues, most notably how it is like to possess an ideal giving style to
    let men and women with ease have an understanding of several complex matters.
    You undoubtedly exceeded people’s desires. Thanks for providing these useful,
    safe, edifying and cool tips on your topic to Emily.

    My site :: VitaSilkLux Serum

Leave a Reply

Your email address will not be published.