Webfont Service

Text with Small Caps

To use Small Caps combined with Upper and Lower case, you need to create two different webfont projects. One for setting normal next, the other for the small caps.

What is your average uptime for hosted webfonts?

In 2019, our combined CDN network averaged 99.94% uptime. You can see the live stats for the last week on our Pingdom page.

Webfont options

Typotheque offers three different ways of using fonts on the web. Hosted Webfonts is the simplest option, ready to use in minutes. Clients receive CSS code for using fonts online, and manage their project via Typotheque online account. Actual font files are hosted on a remote network of servers (CDN), and clients don't have direct access to the files. This removes the complexity of serving the right font formats to the right browser. With the hosted webfonts, clients receive 500MB of free font bandwidth per months. If the website exceeds this limit, clients will pay for the extra bandwidth. In our experience, 90% of websites never exceed the free allocated bandwidth limit. If you are not certain how much traffic your website generated, you can always use the Free Webfont trial licence to get some data about your website's font use.

Read more about Webfont service (and watch the demo video).

For larger website that prefer to control their own assets we offer another option - Self-hosting webfont licence. With this webfont licence, the client manages the assets and has a full control over the files. It requires some programming skills as the fonts files will be installed on your own server, following our instructions. You can choose from two implementation methods, either using PHP scripts, or HTTP referrer script. Both ways are safe and reliable, and prevent fonts from being copied casually. Our self-hosting webfonts come with different tiers, depending on the monthly page views. When you exceed the number of page views, you are expected to upgrade the licence accordingly.

Finally, for very large sites, we also offer Server Licence, which don't come with any page view limitations. Server license fee is one time cost, there are no additional monthly or yearly annual charges.

OpenType features in CSS

Applying OpenType features in webfonts is a two step process. Typotheque webfonts are always generated for a specific webfonts, based on the requested language coverage and by default the OpenType features are removed. First, we need to make sure that the characters needed for the OpenType substitution are available.

Login to your Typotheque account and go to the My Webfonts section, click to Edit the Webfont project, and click the orange settings button ⚙️, to access the OpenType features. Click which OpenType features you would like to include, or, choose not to use any Font Subsetting, so you can access the full character set. Please note that when you use the full font, the file size will be very large. While a font subset size may be 20-30kb, the complete font file may be over 200-300kb. Click the Submit button, and Save Changes.

A new webfont will be generated, and you can access the OpenType features by calling the specific font-variant property in CSS. We prepared this tutorial about using OpenType features in CSS.

Do you allow self-hosting of webfonts?

Yes, we do.

While in most cases we recommend using Typotheque webfont service, some clients require self-hosting of font files on web servers, which we allow provided the fonts are installed following special instructions. You will need to acquire a Server Licence.

Font Subsetting

To make the webfont files as small as possible, we remove some inaccessible glyphs, and users can specify languages to support. Licensed fonts can use as many as 5 languages, trial licences work with a single language. You can also specify custom sets, and preview the glyph set directly. Besides the letters needed to render the specific languages, we add following glyphs automatically to every language: !"#$%&'()*+,-./0123456789:;<=>?@[\]_{|}†¢£§•®©™¥¿¡–—“”‘’¤‹›‰€«» ‹›

Canceling monthly subscription

If you'd like to cancel the monthly webfonts subscription, simply log in to your account, go to My Webfonts, and either Disable, or Delete the active project. Alternatively, you can keep it Active, setting the Monthly Budget to 0 Euro (in Stats).

Extra bandwidth

When reaching the limit of free 500MB per month, you will receive an invoice at the end of the month for the bandwidth that go over the free limit. There is currently no way to pre-pay the bandwidth, you receive an invoice after exceeding the limit.

You will be asked to pay by a credit card for the first monthly payment, and future extra bandwidth payments will automatically charge your credit card.

Text renders in Caps only, what to do?

Typotheque webfont system offers a possibility to apply Small Caps replacing the standard lower case letters with true small capitals. Sometimes people accidentally turn this feature on, which results in seeing all capital text. You can turn the Small Caps on and off at any time directly in your Account > Webfonts. Because we use a large network of distributed servers, changing the settings take a few hours. In some cases it may take up to 24 to update all the servers and files.

Can I change the billing address for the monthly subscription?

Yes, you can change the billing details at any time. Log in to your Account, and go to My Webfonts. Click on the tab Users, and enter the email address of the new user. The new user must have a Typotheque account with this email address. The new user will receive an email and will need to confirm the change.

Problem with anti-aliasing

A few users reported on issues with anti-aliasing of webfonts. Almost always these issues were local, and impossible to reproduce on other computers. While we don't know exactly the source of the problem, the problem seems to be caused by the OS, and not the fonts.

Using external monitors on MacOS is a possible problem, there is a bug in Snow Leopard that disables LCD font smoothing, and there is a Terminal command that fixes it. http://hints.macworld.com/article.php?story=20090828224632809

This is a known Webkit bug — any text with @font-face applied will be rendered without anti-aliasing if there is a text element without anti-aliasing applied preceding it. The bug is described here: http://konstruktors.com/blog/web-design/3190-webkit-bug-anti-aliasing-for-font-face-fonts/

If you experience a similar problem, please report the specific applications and OS that you use.

How many kb is your webfonts?

It depends. While the desktop font can be anything between 100 to 600kb, as Typotheque fonts include very extended language coverage, we subset webfonts. The number of supported languages increases the file size. A webfont with a couple of specified languages is usually just 10% of the original font’s size. If the file size is important to you, we suggest that you create a free webfont trial, to look at the specific font.

Some accented characters are missing in my text, how to fix it?

When you set up your Webfont project, you are asked which languages you plan to use. We then include the necessary characters for the given languages. Sometimes it happens that foreign names or words need other character. If this happens, simply add the missing language, or the specific glyph to the Webfont. Login to your Typotheque online account, go to Webfonts, and click to Edit your webfont project. Add more languages or create Custom set with the missing characters.