What is character set?
It is a predefined list of characters that are used by web browsers to display the web page. Each character is defined by value and information is in the stream of bytes which is converted into readable characters by the browser.
There are several types of character set but presently the most preferred one is UTF-8. The character set which is defined by the website will determine how the site is displayed to the visitor.
Here are a few examples of character sets:
- ASCII: It defines every upper and lowercase letter in the alphabet, numbers from 0-9 and some special characters.
- ISO-8859: It is an extended version of ASCII that includes the international characters.
- ANSI: The default character set in windows up to windows 95.
- UTF-8: Unicode that covers worldwide. It is the default character set that is presently used by HTML-5 and has solved many problems that existed in the previous character sets.
What is meta tag?
It is an HTML tag that is used to display a snippet of text to describe the page’s content. It only appears in the page’s source code. This tag is added to the head of an HTML document.
The meta tag looks like below.
<head>
<title>Site title</title>
<meta name="description" content="Description of this page">
<meta http-equiv="content-type" content="text/html;charset=UTF-8">
</head>
As one can see in the above example there are two meta tags defined:
- One contains the description of the page. This is used by google to display it in the SERPs.
- Another contains the charset that the browser will use when accessing the webpage.
Why avoid the character set in meta tag?
This duplicates the information and therefore increases loading time for the user. Moreover, it disables the lookahead in IE8.
How to fix the problem of Character set in the meta tag?
It all depends on the server-side language or web server that can define the character set so as to display it within the HTTP response header. You can check the code below to set the character set in Php, Apache or Nginx.
Php
Add the below code to the top of your Php file.
header("Content-Type: text/html; charset=utf-8");
Apache
Add the below code to your .htaccess file and enable the character set HTTP response header.
AddType 'text/html; charset=UTF-8' html
Nginx
Add the below code to the config file.
http {
include /etc/nginx/mime.types;
charset UTF-8;
...
}
Conclusion
Whenever you get a recommendation by PageSpeed Testing Tools (Pingdom, GTmetrix, or Google PageSpeed Insights) to avoid the character set in the meta tag. You can simply apply one of the methods discussed above to improve the page loading time.