Query about unusual fonts on modern sites

Hi,

Often these days you see websites with really interesting fonts on them. When you dig into the html / css, the fonts come out like e.g.:

#projects h2 {
color: #5D2728;
font: normal 24px/30px "MinionPro", serif;
text-transform: uppercase;
}

or

#projects h1 {
color: white;
font: normal 75px "DINSchrift", sans-serif;
letter-spacing: 7px;
margin: 0 0 25px 0;
padding: 0 0 0 7px;
text-transform: uppercase;
}

Above are from:
My Name is Jarad Johnson

How can they make their fonts look so good, when I don’t have those fonts on my PC?

Is there a trick I’m missing - probably!

Thanks

This are webfonts, the enable you to use any font on your site. So we are no longer limited to the “safe” fonts

google webfonts

or visit:
Google Web Fonts

Wow! They look amazing - thanks for your reply.

… just out of interest, I can’t find any trace of the google fonts API on the jared site - is that still how he’s doing it?

Just found it:
http://www.jaradjohnson.com/media/styles/global.css

@font-face {
	font-family: 'MinionPro';
	src: url('../fonts/minionpro-boldcn-webfont.eot');
	src: local('☺'), url('../fonts/minionpro-boldcn-webfont.woff') format('woff'), url('../fonts/minionpro-boldcn-webfont.ttf') format('truetype'), url('../fonts/minionpro-boldcn-webfont.svg#webfonti50AtNAS') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'BlackJack';
	src: url('../fonts/black_jack-webfont.eot');
	src: local('☺'), url('../fonts/black_jack-webfont.woff') format('woff'), url('../fonts/black_jack-webfont.ttf') format('truetype'), url('../fonts/black_jack-webfont.svg#webfontfooJoIoN') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'DINSchrift';
	src: url('../fonts/din_30640_neuzeit_grotesk_bold_condensed-webfont.eot');
	src: local('☺'), url('../fonts/din_30640_neuzeit_grotesk_bold_condensed-webfont.woff') format('woff'), url('../fonts/din_30640_neuzeit_grotesk_bold_condensed-webfont.ttf') format('truetype'), url('../fonts/din_30640_neuzeit_grotesk_bold_condensed-webfont.svg#webfontEaGB2wlZ') format('svg');
	font-weight: normal;
	font-style: normal;
}