Cómo utilizar etiquetas Meta Charset para la codificación de caracteres en HTML5

click fraud protection

Antes de la introducción de HTML5, configurar la codificación de caracteres en un documento con un elemento requería que escribiera la línea algo detallada que se ve a continuación. Estos son los elementos del Meta Charset si estaba usando HTML4 en su página web:


Lo que es importante notar en este código son las comillas que ve alrededor del contenido atributo: contenido ="texto / html; juego de caracteres = iso-8859-1". Como todos los atributos HTML, estas comillas definen el valor del atributo, lo que indica que toda la cadena texto / html; juego de caracteres = iso-8959-1 es el contenido de este elemento. Este es el código HTML adecuado, y así es como se pretendía escribir esta cadena. ¡También es difícil de manejar, largo y feo! ¡Tampoco es algo que probablemente recordarías de la cabeza!

En la mayoría de los casos, los desarrolladores web tendrían que copiar y pegar este código de un sitio en cualquier sitio nuevo que estuvieran desarrollando porque escribir esto desde cero requería mucho.

instagram viewer

HTML5 elimina las "cosas" adicionales

HTML5 no solo agregó algunos elementos nuevos al lenguaje, sino que también simplificó en gran medida gran parte de la sintaxis de HTML, incluido el elemento Meta Charset. Con HTML5, puede agregar su codificación de caracteres con la sintaxis mucho más fácil de recordar para el META elemento que ves a continuación:


Compare esa sintaxis simplificada con lo que escribimos al principio de este artículo, la antigua sintaxis utilizada para HTML4, y verá cuánto más fácil es escribir y recordar la versión HTML5. En lugar de tener que copiar y pegar esto de un sitio existente en uno nuevo en el que estaba trabajando, esto es absolutamente algo que, como desarrollador web front-end, podría recordar. Este ahorro de tiempo puede no ser mucho, pero si considera las otras áreas de sintaxis que HTML5 simplificó, ¡los ahorros se acumulan!

Incluya siempre la codificación de caracteres

Siempre debe incluir codificación de caracteres para sus páginas web, incluso si nunca tiene la intención de usar ninguna caracteres especiales. Si no incluye una codificación de caracteres, su sitio se vuelve vulnerable a un ataque de secuencias de comandos entre sitios utilizando UTF-7.

En este escenario, un atacante ve que su sitio no tiene una codificación de caracteres definida, por lo que engaña al navegador haciéndole creer que la codificación de caracteres de la página es UTF-7. A continuación, el atacante inyecta secuencias de comandos codificadas en UTF-7 en la página web y su sitio es pirateado. Esto es problemático para todos los involucrados, desde su empresa hasta sus visitantes. La buena noticia es que es un problema simple de evitar: asegúrese de agregar codificación de caracteres a todas sus páginas web.

Dónde agregar codificación de caracteres

La codificación de caracteres para una página web debe ser la primera línea de su HTML.

elemento. Esto asegura que el navegador sepa cuál es la codificación de caracteres antes de hacer cualquier otra cosa en la página que no sea determinar el tipo de documento e identificar que es una página HTML. Su HTML debería leer:




...

Uso de encabezados HTTP para mayor seguridad

También puede especificar la codificación de caracteres en los encabezados HTTP. Esto es incluso más seguro que agregarlo a la página HTML, pero necesitaría tener acceso a las configuraciones del servidor o .htaccess archivos, lo que significa que es posible que deba trabajar con el proveedor de alojamiento de su sitio web para obtener este tipo de acceso o hacer que realice los cambios para usted. El acceso es el desafío aquí. El cambio en sí es simple, por lo que cualquier proveedor de alojamiento debería poder realizar este cambio por usted con relativa facilidad.

Si esta usando apache, puede establecer el juego de caracteres predeterminado para todo su sitio agregando: AddDefaultCharset UTF-8 a tu raíz .htaccess expediente. El juego de caracteres predeterminado de Apache es ISO-8859-1.

instagram story viewer