The best way to define character set of an HTML5 Web Page? - html

So what is the best way to define? Thanks!
<meta charset='utf-8'>
or
<meta http-equiv='Content-Type' content='text/html; charset=utf-8'>
or
<meta http-equiv='charset' content='utf-8'>

The first option, <meta charset='utf-8'>, is preferred, primarily because it's shortest.
Note that the charset declaration should be the first child of the <head>, before any user-controlled content. (in particular, before the <title>)

They are equivalent in HTML5, but I'd recommend using the first form, because it's shorter and easier to remember and was designed for backwards compatibility with older browsers, even in Internet Explorer 6 (see).

The best, and recommended, way is to specify the character encoding (“charset”) both in a Content-Type HTTP header and in a meta tag or, in the case of UTF-8, using a Byte Order Mark at the start. Note that any conflict between the HTTP header and a meta tag is resolved in favor of the HTTP header.
It is much less relevant which of the two forms of meta you use, but the shorter is safer (less opportunities for mistyping or copy error).
References: Specifying the document's character encoding in HTML5 CR and W3C page Character encodings.
The third tag mentioned in the question, <meta http-equiv='charset' content='utf-8'>, is invalid and has no effect. (The W3C validator says: “Bad value charset for attribute http-equiv on element meta.”)

the best way to define the Meta Charset follows:
<meta http-equiv='Content-Type' content='text/html; charset=utf-8'>
The TAG above is the more complete.
http://www.w3.org/International/O-HTTP-charset.pt-br.php

Related

Is there any reason to use <meta charset="utf-8">?

I understand that <meta charset="utf-8"> declares the character encoding of the document to be UTF-8.
According to the HTML specs <meta charset="utf-8"> is not mandatory and the only allowed charset for HTML5 is UTF-8 anyways. So leaving it out does not hold back any useful information in an HTML5 document.
Regardless of whether a character encoding declaration is present or not, the actual character encoding used to encode the document must be UTF-8.
However, almost every resource on HTML5 urges to use the tag despite it being redundant and unnecessary with regards to the specs.
Is there any reason to use it?

Setting two charsets? utf-8 and text/html

I'm new to learning HTML and learning about metadata in a webpage. It seems like people prefer you have to set the character set to support utf-8 and people are also saying have charset="text/html" so browsers know what kind of information they are receiving. How can I set both since it seems like both use the same attribute?
text/html is a media type, not a character set. The server can send a Content-Type: text/html; charset=utf-8 header to identify the content as HTML encoded as UTF-8. When you’re using a <meta> tag, though, the content is already known to be HTML and the only thing that matters is the charset, so HTML5 introduced the option to write <meta charset="utf-8"> as shorthand for <meta http-equiv="Content-Type" content="text/html; charset=utf-8">. (Older browsers also support this because people had a habit of forgetting quotes in the original.)
In short, if you’re using a <meta> tag, just write this:
<meta charset="utf-8">
and you’re done. The page is already HTML.

Meta tags stopping website from HTML5 validating

I am trying to improve the validity of the HTML on my website, but several errors in the meta tags are showing up as invalid, and I'm unsure how to alter them in order to remove the errors.
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
Bad value X-UA-Compatible for attribute http-equiv on element meta.
<meta name="msvalidate.01" content="4E24196986E1212B82C272A021495004"/>
Attribute name not allowed on element meta at this point.
<meta name="msvalidate.01" content="4E24196986E1212B82C272A021495004"/>
Element meta is missing required attribute itemprop.
<meta name="p:domain_verify" content="5dd1c5f2db0ac0b521f08d56b4cd271b">
Attribute name not allowed on element meta at this point.
Element meta is missing required attribute itemprop.
<meta http-equiv="content-language" content="en">
Attribute http-equiv not allowed on element meta at this point.
Element meta is missing required attribute itemprop.
<meta http-equiv="content-language" content="en">
Using the meta element to specify the document-wide default language is obsolete. Consider specifying the language on the root element instead.
Thanks in advance for any help!
D.
You have to bear in mind that the validator says:
The validator checked your document with an experimental feature:
HTML5 Conformance Checker. This feature has been made available for
your convenience, but be aware that it may be unreliable, or not
perfectly up to date with the latest development of some cutting-edge
technologies.
If your code would be in HTML4 I think we could morally say you could remove some of those meta tags in order to conform to the spec, but there is no definitive spec for HTML5, and so far there are so many features that are being experimented with that will/should end up in the spec, like the ability to use any name/content pairs in the meta tags, or having http-equiv as something acceptable, or, for that matter, a new syntax for meta tags, that your document will probably validate in the future.
So if validating is really important to you, you are in a bit of a rub since there's no precise or right way to validate HTML5 yet; removing those tags would make it validate against the w3c validator, but it would only "look" valid; even to people who believe that validating is more than just a badge.
Be that as it may, you could get rid of the
<meta http-equiv="content-language" content="en">
since you will probably specify the language (if not, please do) in many other attributes and places.

What meta tags does HTML5 require?

Here it the start of my HTML5 web application:
<!DOCTYPE html>
<html>
<head>
<meta content='text/html; charset=utf-8' http-equiv='Content-Type'>
Is the meta content tag needed. Is HTML / UTF-8 a default?
I just removed the namespace in the html tag as this is not needed.
Was wondering if I can remove the meta tag here.
UTF-8
Yes; typically this is simply <meta charset='utf-8'> in HTML5, since the actual content-type is always determined by the corresponding HTTP header instead:
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
You can continue using what you already have, but the content-type must be text/html followed by the character encoding for it to validate as HTML5. For simplicity, just go with the new recommended syntax. See the W3C HTML5 spec for details.
There are two distinct issues here: the content type (media type, MIME type), and the character encoding (“charset”). For the latter, see <meta charset="utf-8"> vs <meta http-equiv="Content-Type">. Note that there is no universal default for character encoding in HTML, and a meta tag is just one way of specifying the encoding and may be trumped by HTTP headers or BOM.
But the title of the question asks “Does HTML5 require content-type to be set?”, and the answer is that it does not require it to be set in the HTML document and it cannot be set in the HTML document. If some software parses a meta tag and inteprets it as having a specific meaning, it has already decided to process the document as an HTML document.
General Internet protocols specify how clients are informed of content types (in HTTP headers, e-mail message headers, etc.), and for an HTML document transmitted over HTTP, the server should announce the content type as text/html (or as a content type defined for genuine XHTML, if you want Draconian XML error processing and other serious consequences). Without such information, browsers will have to guess the content type, and they may guess wrong

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> Where it should be place in <head>to render doucment as IE7 properly in IE8?

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> Where it should be place in <head> to render document as IE7 properly in IE8?
Seeing as this meta tag changes the way the document is rendered, and could cause visual changes, I would apply the same rule as that for the content-type header, which is
as early in the <head> as possible.
From the W3C encoding specs:
The META declaration must only be used when the character encoding is organized such that ASCII-valued bytes stand for ASCII characters (at least until the META element is parsed). META declarations should appear as early as possible in the HEAD element.
In the document's head, where the other meta tags are, after <meta http-equiv="content-type" ...>.
Anywhere within the <head> element.
You can also send it directly as an HTTP header if you choose to. For a complete site it may make sense just to configure the server to send out this additional header than touching each and every file.