Webmaster

Cómo puedes mostrar los acentos y las ñ en HTML

html acentos

Muchas veces cuando nos disponemos a crear una nueva página web desde cero, olvidamos ciertos detalles que pueden empeorar la estética de un sitio web. Y es que, son los pequeños detalles los que marcan la diferencia. Por eso en Zonautas te mostraremos cómo mostrar acentos en html y otros caracteres como los acentos, las ñ o tildes.

¿Porqué veo signos raros en vez de tildes o eñes?

Puede ocurrir que, al introducir caracteres “extraños” como las tildes, acentos o las ñ en una página HTML se muestre un interrogante u otro signo extraño. Esto se debe a que el navegador no sabe qué juego de caracteres debe utilizar, por lo que recurre a uno básico que puede no contener todos estos caracteres.

Para solucionar esto, simplemente deberemos abrir el archivo HTML de la página y añadir una línea dentro de la etiqueta <head>.

La línea en cuestión es la siguiente:

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

Antes de poner la línea que hemos sugerido, quedaría de la siguiente manera con el código correspondiente a continuación:

pruebatildes antes
<html>
<head>

	<title>Prueba de tildes de Zonautas</title>
	
</head>
<body>

	Zonautas es un blog de tecnología en español.
	
</body>
</html>

Tras aplicar el código, queda de la siguiente manera:

pruebatildes despues
<html>
<head>
	
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<title>Prueba de tildes de Zonautas</title>
	
</head>
<body>

	Zonautas es un blog de tecnologí­a en español.
	
</body>
</html>

¿Qué es UTF-8 y porqué debería usarlo?

UTF-8 es un juego de caracteres estandarizado por el Unicode Consortium el cual representa cualquier caracter en el estandar Unicode compatible con ASCII. Aunque existen otras versiones como UTF-16 y UTF-32, estas no se suelen implementar como versión “por defecto” porque sólo son indicadas si se utilizan caracteres de alfabetos diferentes como el chino, tailandés u otros.

De hecho, ¡UTF-16 no llegó a estar implementado en HTML hasta su quinta versión!

Puedes ver si necesitas UTF-16 usando las tablas de caracteres Unicode en esta página. Al acceder a la página de cualquier caracter saldrá la codificación en todos los tipos de UTF, para la letra Z mayúscula es así, por ejemplo:

letraz unicode

Como se puede apreciar, su valor en binario es el mismo independientemente de que utilicemos UTF-8, 16 o 32. Este no es el caso para el símbolo de alfa minúscula griego (α), el cual necesita dos bytes como mínimo para representarse, incluso en UTF-8:

letraalfa unicode

La ventaja de UTF-8 es que está ampliamente arraigado en todos los lenguajes de programación que utilizamos a día de hoy. Esto incluye al HTML, XML, Java, PHP o JavaScript.

¿Qué opinas del artículo? ¿Te ha ayudado? ¡Dínoslo en los comentarios!

Comparte este artículo en las redes sociales
Tags

4 comentarios

Haz clic aquí para publicar un comentario