Тег META, атрибут charset

HTML Кодировка

Чтобы правильно отобразить HTML страницу, веб браузер должен знать, какой набор символов использовать.

Что такое кодировка символов?

ASCII была первая стандартная кодировка символов (также называется набор символов). ASCII определенны 128 различных буквенно-цифровых символов, которые могут быть использованы в интернете: числа от (0-9), английские буквы (A-Z), и некоторые специальные символы, такие как ! $ + — ( ) @ < >.

ANSI (Windows-1252) был оригинальным Windows набор символов, с поддержкой 256 различных кодов символов.

ISO-8859-1 была кодировка по умолчанию для HTML 4. Этот набор символов тоже поддерживается 256 различных кодов символов.

Потому что ANSI и ISO-8859-1 были настолько ограничены, что HTML 4 также поддерживает UTF-8.

UTF-8 (Юникод) охватывает практически все знаки и символы в мире.

Кодировка по умолчанию для HTML5 является UTF-8.

HTML Атрибут charset

Для корректного отображения HTML страницы веб браузер должен знать набор символов, используемый на этой странице.

Если браузер обнаруживает ISO-8859-1 на веб странице, он по умолчанию использует ANSI.

Различия между наборами символов

В следующей таблице показаны различия между наборами символов, описанными выше:

Число	ASCII	ANSI	8859	UTF-8	Описание
32	Пространство
33	!	!	!	!	Восклицательный знак
34	«	«	«	«	Кавычки двойные
35	#	#	#	#	Знак числа
36	$	$	$	$	Знак доллара
37	%	%	%	%	Знак процента
38	&	&	&	&	Амперсанд
39	‘	‘	‘	‘	Кавычки одинарные
40	(	(	(	(	Левая собка
41	)	)	)	)	Правая скобка
42	*	*	*	*	Звездочка
43	+	+	+	+	Плюс
44	,	,	,	,	Запятая
45	—	—	—	—	Дефис-минус
46	.	.	.	.	Точка
47	/	/	/	/	Косая черта
48	0	0	0	0	Число нуль
49	1	1	1	1	Число один
50	2	2	2	2	Число два
51	3	3	3	3	Число три
52	4	4	4	4	Число четыре
53	5	5	5	5	Число пять
54	6	6	6	6	Число шесть
55	7	7	7	7	Число семь
56	8	8	8	8	Число восемь
57	9	9	9	9	Число девять
58	:	:	:	:	Двоеточие
59	;	;	;	;	Точка с запятой
60					Знак меньше чем
61	=	=	=	=	Знак равенства
62	>	>	>	>	Знак больше чем
63	?	?	?	?	Знак вопроса
64	@	@	@	@	Коммерческая в
65	A	A	A	A	Латинская буква A
66	B	B	B	B	Латинская буква B
67	C	C	C	C	Латинская буква C
68	D	D	D	D	Латинская буква D
69	E	E	E	E	Латинская буква E
70	F	F	F	F	Латинская буква F
71	G	G	G	G	Латинская буква G
72	H	H	H	H	Латинская буква H
73	I	I	I	I	Латинская буква I
74	J	J	J	J	Латинская буква J
75	K	K	K	K	Латинская буква K
76	L	L	L	L	Латинская буква L
77	M	M	M	M	Латинская буква M
78	N	N	N	N	Латинская буква N
79	O	O	O	O	Латинская буква O
80	P	P	P	P	Латинская буква P
81	Q	Q	Q	Q	Латинская буква Q
82	R	R	R	R	Латинская буква R
83	S	S	S	S	Латинская буква S
84	T	T	T	T	Латинская буква T
85	U	U	U	U	Латинская буква U
86	V	V	V	V	Латинская буква V
87	W	W	W	W	Латинская буква W
88	X	X	X	X	Латинская буква X
89	Y	Y	Y	Y	Латинская буква Y
90	Z	Z	Z	Z	Латинская буква Z
91	[	[	[	[	Левая квадратная скобка
92	\	\	\	\	Обратный солидус
93	]	]	]	]	Правая квадратная скобка
94	^	^	^	^	Циркумфлекс ударение
95	_	_	_	_	Низкая линия
96	`	`	`	`	Знак ударения
97	a	a	a	a	Латинская строчная буква a
98	b	b	b	b	Латинская строчная буква b
99	c	c	c	c	Латинская строчная буква c
100	d	d	d	d	Латинская строчная буква d
101	e	e	e	e	Латинская строчная буква e
102	f	f	f	f	Латинская строчная буква f
103	g	g	g	g	Латинская строчная буква g
104	h	h	h	h	Латинская строчная буква h
105	i	i	i	i	Латинская строчная буква i
106	j	j	j	j	Латинская строчная буква j
107	k	k	k	k	Латинская строчная буква k
108	l	l	l	l	Латинская строчная буква l
109	m	m	m	m	Латинская строчная буква m
110	n	n	n	n	Латинская строчная буква n
111	o	o	o	o	Латинская строчная буква o
112	p	p	p	p	Латинская строчная буква p
113	q	q	q	q	Латинская строчная буква q
114	r	r	r	r	Латинская строчная буква r
115	s	s	s	s	Латинская строчная буква s
116	t	t	t	t	Латинская строчная буква t
117	u	u	u	u	Латинская строчная буква u
118	v	v	v	v	Латинская строчная буква v
119	w	w	w	w	Латинская строчная буква w
120	x	x	x	x	Латинская строчная буква x
121	y	y	y	y	Латинская строчная буква y
122	z	z	z	z	Латинская строчная буква z
123			}	}	}	Правая фигурная скобка
126	~	~	~	~	Тильда
127	DEL
128	€	Знак евро
129				НЕ ИСПОЛЬЗУЕТСЯ
130	‚	Одинарная 9 низкая кавычка
131	ƒ	Латинская строчная буква f с крючком
132	„	Двойная 9 низкая кавычка
133	Горизонтальное многоточие
134	†	Кинжал
135	‡	Двойной кинжал
136	ˆ	Письмо модификатор облеченным ударением
137	‰	Знак промилле
138	Š	Латинская буква S с caron
139	‹	Одинарный угол влево низкая кавычка
140	Œ	Латинская заглавная лигатура OE
141				НЕ ИСПОЛЬЗУЕТСЯ
142	Ž	Латинская буква Z с caron
143				НЕ ИСПОЛЬЗУЕТСЯ
144				НЕ ИСПОЛЬЗУЕТСЯ
145	‘	Левая одинарная низкая кавычка
146	’	Правая одинарная низкая кавычка
147	“	Левая двойная низкая кавычка
148	”	Правая двойная низкая кавычка
149	•	Маркер
150	–	Тире
151	—	Длинное тире
152	˜	Маленькая тильда
153	™	Знак торговой марки
154	š	Латинская строчная буква s с caron
155	›	Одинарный угол вправо низкая кавычка
156	œ	Латинская строчная лигатура oe
157				НЕ ИСПОЛЬЗУЕТСЯ
158	ž	Латинская строчная буква z с caron
159	Ÿ	Латинская буква Y с diaeresis
160	Неразрывный пробел
161	¡	¡	¡	Перевернутый восклицательный знак
162	¢	¢	¢	Знак цента
163	£	£	£	Знак фунта
164	¤	¤	¤	Знак валюты
165	¥	¥	¥	Знак иены
166	¦	¦	¦	Прерывистая полоса
167	§	§	§	Знак раздела
168	¨	¨	¨	Трема
169	©	©	©	Знак авторского права
170	ª	ª	ª	Женский порядковый индикатор
171	«	«	«	Двойной угол влево
172	¬	¬	¬	Знак нет
173	­	­	­	Мягкий дефис
174	®	®	®	Зарегистрированный знак
175	¯	¯	¯	Макрон
176	°	°	°	Знак степени
177	±	±	±	Плюс-минус
178	²	²	²	Верхний индекс два
179	³	³	³	Верхний индекс три
180	´	´	´	Острый знак ударения
181	µ	µ	µ	Микро знак
182	¶	¶	¶	Знак абзаца
183	·	·	·	Точка посередине
184	¸	¸	¸	Седиль
185	¹	¹	¹	Верхний индекс один
186	º	º	º	Мужской порядковый индикатор
187	»	»	»	Двойной угол вправо
188	¼	¼	¼	Грубая дробь одна четвертая
189	½	½	½	Грубая дробь одна вторая
190	¾	¾	¾	Грубая дробь три четвертых
191	¿	¿	¿	Перевернутый вопросительный знак
192	À	À	À	Латинская буква A с grave
193	Á	Á	Á	Латинская буква A с acute
194	Â	Â	Â	Латинская буква A с circumflex
195	Ã	Ã	Ã	Латинская буква A с tilde
196	Ä	Ä	Ä	Латинская буква A с diaeresis
197	Å	Å	Å	Латинская буква A с ring above
198	Æ	Æ	Æ	Латинская буква AE
199	Ç	Ç	Ç	Латинская буква C с cedilla
200	È	È	È	Латинская буква E с grave
201	É	É	É	Латинская буква E с acute
202	Ê	Ê	Ê	Латинская буква E с circumflex
203	Ë	Ë	Ë	Латинская буква E с diaeresis
204	Ì	Ì	Ì	Латинская буква I с grave
205	Í	Í	Í	Латинская буква I с acute
206	Î	Î	Î	Латинская буква I с circumflex
207	Ï	Ï	Ï	Латинская буква I с diaeresis
208	Ð	Ð	Ð	Латинская буква Eth
209	Ñ	Ñ	Ñ	Латинская буква N с tilde
210	Ò	Ò	Ò	Латинская буква O с grave
211	Ó	Ó	Ó	Латинская буква O с acute
212	Ô	Ô	Ô	Латинская буква O с circumflex
213	Õ	Õ	Õ	Латинская буква O с tilde
214	Ö	Ö	Ö	Латинская буква O с diaeresis
215	×	×	×	Знак умножения
216	Ø	Ø	Ø	Латинская буква O с stroke
217	Ù	Ù	Ù	Латинская буква U с grave
218	Ú	Ú	Ú	Латинская буква U с acute
219	Û	Û	Û	Латинская буква U с circumflex
220	Ü	Ü	Ü	Латинская буква U с diaeresis
221	Ý	Ý	Ý	Латинская буква Y с acute
222	Þ	Þ	Þ	Латинская буква thorn
223	ß	ß	ß	Латинская строчная буква sharp s
224	à	à	à	Латинская строчная буква a с grave
225	á	á	á	Латинская строчная буква a с acute
226	â	â	â	Латинская строчная буква a с circumflex
227	ã	ã	ã	Латинская строчная буква a с tilde
228	ä	ä	ä	Латинская строчная буква a с diaeresis
229	å	å	å	Латинская строчная буква a с ring above
230	æ	æ	æ	Латинская строчная буква ae
231	ç	ç	ç	Латинская строчная буква c с cedilla
232	è	è	è	Латинская строчная буква e с grave
233	é	é	é	Латинская строчная буква e с acute
234	ê	ê	ê	Латинская строчная буква e с circumflex
235	ë	ë	ë	Латинская строчная буква e с diaeresis
236	ì	ì	ì	Латинская строчная буква i с grave
237	í	í	í	Латинская строчная буква i с acute
238	î	î	î	Латинская строчная буква i с circumflex
239	ï	ï	ï	Латинская строчная буква i с diaeresis
240	ð	ð	ð	Латинская строчная буква eth
241	ñ	ñ	ñ	Латинская строчная буква n с tilde
242	ò	ò	ò	Латинская строчная буква o с grave
243	ó	ó	ó	Латинская строчная буква o с acute
244	ô	ô	ô	Латинская строчная буква o с circumflex
245	õ	õ	õ	Латинская строчная буква o с tilde
246	ö	ö	ö	Латинская строчная буква o с diaeresis
247	÷	÷	÷	division sign
248	ø	ø	ø	Латинская строчная буква o с stroke
249	ù	ù	ù	Латинская строчная буква u с grave
250	ú	ú	ú	Латинская строчная буква u с acute
251	û	û	û	Латинская строчная буква с circumflex
252	ü	ü	ü	Латинская строчная буква u с diaeresis
253	ý	ý	ý	Латинская строчная буква y с acute
254	þ	þ	þ	Латинская строчная буква thorn
255	ÿ	ÿ	ÿ	Латинская строчная буква y с тремой

ASCII Набор символов

ASCII используются значения от 0 до 31 (и 127) для управляющих символов.

ASCII используются значения от 32 до 126 для букв, цифр и символов.

ASCII не используйте значения от 128 до 255.

ANSI Набор символов (Windows-1252)

ANSI идентичен ASCII для значений от 0 до 127.

ANSI имеет собственный набор символов для значений от 128 до 159.

ANSI идентична кодировке utf-8 для значений от 160 до 255.

ISO-8859-1 Набор символов

8859-1 идентичен ASCII для значений от 0 до 127.

8859-1 не используйте значения от 128 до 159.

8859-1 идентична кодировке utf-8 для значений от 160 до 255.

UTF-8 Набор символов

UTF-8 идентичен ASCII для значений от 0 до 127.

UTF-8 не используйте значения от 128 до 159.

UTF-8 идентичен ANSI и 8859-1 для значений от 160 до 255.

UTF-8 продолжается от значение 256 с более чем 10 000 различных символов.

Для более близкого взгляда, изучите наш Полный набор символов HTML справочник.

Правило CSS @charset

Вы можете использовать CSS правило @charset для указания кодировки символов, используемой в таблице стилей:

Пример

Установите кодировку таблицы стилей в Юникод UTF-8:

Подробнее о компании читайте здесь CSS Правило @charset.

Источник

Атрибут charset

Указывает кодировку документа. Атрибут введен в HTML5 и предназначен для сокращения формы тега , которая задавала кодировку в предыдущих версиях HTML и XHTML.

Синтаксис

Значения

Название кодировки, например UTF-8.

Значение по умолчанию

      
Типовой документ.
  

Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.

Типы тегов

HTML5

Блочные элементы

Строчные элементы

Универсальные элементы

Нестандартные теги

Осуждаемые теги

Видео

Документ

Звук

Изображения

Объекты

Скрипты

Списки

Ссылки

Таблицы

Текст

Форматирование

Формы

Фреймы

Источник

Html codepage utf 8

Пока я творю, я живу!
Блог посвящен: HTML, CSS, PHP, WordPress, Bootstrap

Как указать кодировку сайта на HTML. Основы HTML для начинающих. Урок №20

Всем привет!
Продолжаем изучать основы HTML. В этом уроке мы разберем, как указать HTML кодировку для сайта (веб-страницы).
Этот урок очень важен, так как незнание того, как указать кодировку для веб-страницы может привести к тому, что вашу страницу не смогут прочитать. Вы спросите: «Это как так, не смогут?».
Давайте я покажу, как выглядит мой блог с неправильной кодировкой:

Ну как вам? Все ли смогли прочитать ? Хотя, если постараться, то смысл сможете понять по картинкам. Но разве таким сайтом удержишь посетителя?

Итак, HTML кодировка – это таблицы соответствия кодов и символов алфавита. То есть, наш компьютер по кодировке поменяет код на понятные читабельные буквы .

Чтобы сообщить браузеру, в какой кодировке находятся символы веб-страницы, необходимо прописать между тегами вот такой мета тег:

Обратите внимание, в коде есть слово «имя кодировки». Здесь нужно указать HTML кодировку.
Обычно это utf-8 или windows-1251 .

Кодировка для utf-8:

Кодировка для windows-1251:

Если забыть указать браузеру, в какой кодировке сайт или веб-страница, то браузер попытается определить кодировку автоматически, но не всегда у него это выходит правильно. В итог результат будет такой, который я показал на картинке выше.

Как создать HTML документ с
кодировкой utf-8

Открывайте стандартный блокнот. «Все программы» => «Стандартные» => «Блокнот» :

Далее вставляете в блокнот стандартный код HTML:

     Здравствуйте, это моя первая страница на StepkinBlog.ru.  

Теперь указываем, в какой кодировке сохранена веб-страница. Для этого разместите между тегами вот этот мета-тег:

Вот так должно получиться ( строка №4 ):

     Здравствуйте, это моя первая страница на StepkinBlog.ru.  

Жмите в блокноте «Файл» => «Сохранит как…» :

Там, где пункт «Имя файла» напишите название веб-страницы на латинице и с расширением «.html» . Я думю, вы это помните еще с первых уроков.
Там, где пункт «Кодировка:» укажите «UTF-8» .
Жмите «Сохранить» :

Как создать HTML документ с кодировкой windows-1251

Открывайте стандартный блокнот. «Все программы» => «Стандартные» => «Блокнот» .
Далее вставляете в блокнот стандартный код HTML:

     Здравствуйте, это моя первая страница на StepkinBlog.ru.  

Теперь указываем, в какой кодировке сохранена веб-страница. Для этого разместите между тегами вот этот мета-тег:

Вот так должно получиться ( строка №4 ):

     Здравствуйте, это моя первая страница на StepkinBlog.ru.  

Жмите в блокноте «Файл» => «Сохранит как…» :

Там, где пункт «Имя файла» напишите название веб-страницы на латинице и с расширением «.html» . Я думю, вы это помните еще с первых уроков.
Там, где пункт «Кодировка:» укажите «ANSI» .
Жмите «Сохранить» :

Большинство вебмастеров выбирают кодировку UTF-8 . Причины говорить не буду, так как боюсь нагрузить вас информацией, которая на вашем этапе познания HTML еще не нужна.

Для примера в блокнте установите код:

И укажите при сохранении «ANSI» :

Так как это неправильно, результат будет вот таким:

Сохраняйте правильно ваши веб-страници во избежание вот таких результатов

Источник