Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Aaron Coursolle
18,014 PointsCan I provide a font?
I still have one of those "2000 royalty-free fonts" CD-roms laying around. It probably wouldn't be worth it for paragraph text, but there were a few fonts that would look good as headlines in future designs. Is there any way I can include them so that people see them when they visit my site?
4 Answers
Colin Bell
29,679 PointsYou can, but you'd have to host the font yourself.
Self-hosting desktop fonts
Most font files you have installed will be TrueType (.ttf) with a smattering of OpenType (.otf). You can save these to your server and specify them in your CSS.
Support for .ttf and .otf file formats is widespread across all modern browsers except IE (even the latest version) and some mobile browsers (including legacy versions of iOS Safari).
To increase your coverage you’ll need several additional formats. .eot works for IE, .woff will work for most browsers and is the W3C’s preferred format, .svg will work on legacy browsers. There’s a number of web services that will generate these formats for you from your .ttf file, one of the most popular being Font Squirrel’s.
The downside with converting desktop fonts for use online is twofold: firstly, you are almost certainly not licensed to do so; and > secondly, desktop fonts are almost always optimized for print, they simply do not render well on screen.
Ryan Field
Courses Plus Student 21,242 PointsIn addition to the above-mentioned methods, there is one other way of getting custom fonts into your webpage, which is by using a base64-encoded font. Now, this isn't something you should do with all your fonts or very often at all, but it is a method you could use if you really wanted a font on a page and you had no place to host your own.
The explanation of how to do this is here, but it boils down to using Font Squirrel to turn your font into a string of data characters, and then just using that string in your CSS file.
Remember, use this sparingly if you do so at all. Also keep in mind that fancy fonts can have quite lengthy base64 strings, so just be mindful of not having a CSS file that is too large.
ellie adam
26,377 PointsHi Coursolle, People only see those font they already have on their pcs or global fonts. They can't see your selected fonts. That's why now these days we use google fonts and put google url in links. So everybody can see it on their pcs.
:)
ellie adam
26,377 PointsI think it is too much headache. I won't do it I will use google font :)
Aaron Coursolle
18,014 PointsGood point. I don't think I would ever go beyond google or installed fonts for paragraph text. This would be for headline text only and only in special cases.
Aaron Coursolle
18,014 PointsAaron Coursolle
18,014 Points"firstly, you are almost certainly not licensed to do so" Does that include royalty-free fonts, as well?
Colin Bell
29,679 PointsColin Bell
29,679 PointsI don't believe so, but I'm not sure.