HTML and CSS Reference
In-Depth Information
Adding a meta tag to specify the character encoding
Character encodings give us a way to represent all the letters, numbers and other symbols in our
language on the computer. You might know of some of these encodings, like ASCII or even Morse
code, and there are many other encodings out there. Luckily, the world has now standardized on
the Unicode character encoding. With Unicode, we can represent all languages with one type of
encoding. But, given there are other encodings out there, we still need to tell the browser we're using
Unicode (or another encoding of your choice). To specify Unicode for your web pages, you'll need a
<meta>
tag in your HTML that looks like this:
The c
harset
attri
bute is w
here
we sp
ecify th
e
chara
cter enc
oding.
<meta charset="utf-8">
“u
tf-8
” is an
enco
ding i
n the
U
nicod
e fam
ily of
encod
ings (
one
Just
like
other
HTM
L t
ags, t
he
<me
ta> t
ag ha
s
att
ribute
s.
o
f seve
ral).
“utf-
8” is
the ve
rsion
w
e use
for w
eb pa
ges.
Q:
Doctypes, <meta> tags…ugh, do I need to really do all this
to write web pages?
A:
Specifying a doctype and character encoding with a <meta>
tag are kind of like taxes: you gotta do them to be compliant. Look
at it this way: you already understand them more than 98% of the
web page writing population, which is great. But at the end of the day,
everyone just puts the doctype and <meta> tag in their HTML and
moves on with life. So make sure you've got them in your HTML, and
then go do something much more fun.
Q:
utf-8?
A:
Work with us here. It's like WD-40; you don't worry about
why it's called that, you just use it. As we said, utf-8 (also written
sometimes as UTF-8) is part of the Unicode encoding family. The
u
in utf-8 means Unicode. Unicode is a character set supported across
many commonly used software applications and operating systems,
and is the encoding of choice for the Web, because it
supports all languages, and multilingual documents (documents
that use more than one language). It's also compatible with ASCII,
which was a common encoding for English-only documents. If you're
interested in learning more about Unicode or character encodings in
general, check out the information on character encoding at
http://www.w3.org/International/O-charset.html.
Q:
I've also seen <meta> tags that look like this: <meta http-
equiv="Content-Type" content="text/html;charset=utf-8" >. Do I
need to use this instead sometimes?
A:
No. That is the format for the <meta> tag in HTML 4.01 and
earlier. In HTML5, you can just write <meta charset="utf-8">.
Q:
Is this why you had us save our files using utf-8 for the
encoding way back in Chapter 1?
A:
Yes. You want the encoding of the file you're serving to the
browser to match the encoding you specify in the <meta> tag.
