Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

I'm curious, as to what is the right way to have UTF-8 encoding on all web files

All my files (incl. CSS and JS) are made and saved in UTF-8 encoding

In PHP, I set the char-set on top of the main page (this page includes all others) with:

header('Content-type: text/html; charset=utf-8');

In the same page I have this html meta tag:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

Then I stubled upon an external css file that has this on first line:

@charset "UTF-8";

And now I wonder, should I set the charset INSIDE all my CSS/JS files too, like that?

And/or should I serve each file with charset=utf-8 in the meta tag? UPDATE: Character encoding of the linked resource (charset="utf-8") is obsolete

share|improve this question

2 Answers 2

The best place for the character set declaration when served from your webserver is in the "Content-Type" header. You are doing it correctly when serving it from PHP. You could also set the header for CSS and JS. Assuming that your CSS and JS are not served through PHP, but as static files, you could add the following to your .htaccess file:

AddCharset utf-8 .js
AddCharset utf-8 .css

When linking to to your JavaScript files from your HTML you can also include the character set there:

<script type="text/javascript" src="/js/file.js" charset="utf-8"></script>

The in body charset declarations are most useful for when your files get downloaded and opened locally. In those cases meta information in the headers is lost.

share|improve this answer
    
Character encoding of the linked resource (charset="utf-8") is obsolete –  mowgli Jun 12 at 19:09

The purpose of the meta element setting utf-8 is so user's browsers can properly read the page should they save it to their desktop where a server won't be serving the page and include the utf-8 header. In PHP, you set it in the header which actually makes including it in the page redundant (and repetitive, too :) ) but a good idea for the reason I gave.

I've forgotten what the @charset would be for but I've never used it which shows how important including that is.

btw, meta tags do not have a closing slash.

share|improve this answer
    
HTML5 doesn't need the closing tag in meta tags, but it's perfectly ok to do it.. You made me read up on it :) –  mowgli Jun 12 at 17:35
    
@mowgli If you read up on it, you'll find you're right. It's now allowed but 1) it's not needed 2) browsers ignore it 3) it doesn't affect anything in any way 4) it only takes up space and data on the wire and therefore 5) is totally useless. Remove it and quit using it. –  Rob Jun 12 at 18:53
    
Yeah I removed it :) Damn, I thought HTML5 would be more precise "THIS is correct". Anyway, overall things are much better now than 10-15 years ago –  mowgli Jun 12 at 19:06
    
@mowgli Well, if you look at the spec, nowhere will you find them ever mentioning using the closing slash, and it's not in any of the examples, except under "void elements". iirc, that is where it says you can do that but it's pointless. –  Rob Jun 12 at 19:18

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.