Using True type fonts in web applications

Question

HTML5 allows to use TTF fonts in your CSS:

@font-face {
  font-family: 'Tagesschrift';
  src: url('tagesschrift.ttf');
}

To use it:

h1, h2, h3 { font-family: 'Tagesschrift', 'Georgia', serif; }

Check more information in html5rocks.

You use Font Embedding.

It will affect the overall load time of the page as the font data has to be downloaded as well as the other content, styles etc. However, it will be cached so only impacts on the first view of the page.

I want to update the accepted answer due to a significant passage of time. The following is what Font Squirrel outputs under their recommended 'Optimal' setting. Supporting .ttf at this point is no longer important and should be ignored.

font-family: 'Tagesschrift';
  src: url('tagesschrift.woff2') format('woff2'),
       url('tagesschrift.woff') format('woff');
  font-weight: normal;
  font-style: normal;