HTML and CSS Reference
In-Depth Information
How Web Fonts work
With Web Fonts you can take advantage of a new capability of modern browsers that allows
you to deliver new fonts directly to your users. Once the font is delivered, the browser can
then make use of the Web Font just like it can any other font, and you can even style your
text with CSS. Let's look at how Web Fonts work in a little more detail:
Here's
a font file
you've
stored
on your ser
ver.
abcdefg
hijklmn
opq stuv
wxyzABCD
EFGHIJKL
crazyfont.woff
T
he
font
file
con
tain
s
every
thin
g a
brow
ser
need
s to
use
the
font
in yo
ur w
eb p
age.
www.starbuzzcoffee.com
N
otice this
font use
s
a
“.woff” f
ile exten
sion,
w
hich mean
s web ope
n
f
ont forma
t.
To make use of Web Fonts, the browser first retrieves an
HTML page that references them.
1
“I need index.html”
abcdefg
hi lmn
opq st v
wxyzABCD
EFGHIJKL
crazyfont.woff
www.starbuzzcoffee.com
“Here ya go”
index.html