Rutarelativa

Como mostrar acentos en HTML

(6)

16 / Febrero / 2010

Desarrollo

Cuando comencé con las páginas Web, hace ya bastante tiempo, uno de los problemas que me enfrentaba día a día era el de como mostrar acentos en el HTML. Utilizaba millones de funciones en PHP, como utf8enconde, utf8decode, sin saber realmente que estaba haciendo. Hasta que un día leí sobre las codificaciones de los documentos y sus cabeceras. Mostrar acentos en un documento HTML “es fácil”, aquí no vamos a explicar qué es la codificación o cómo se inventó el UTF-8, para eso podéis visitar la Wikipedia, con bastante más información de la que puedo dar. Nos centraremos en como crear una página Web con acentos sin ningún tipo de problema.

Como mostrar acentos en HTML

Cuando creamos un documento tenemos que saber que su codificación se encuentra en UTF-8; en cualquier editor actual podremos ver nuestra codificación y cambiarla. En este ejemplo usaremos Notepad++, creando un archivo index.html y cambiando su formato a UTF-8.

Como mostrar acentos en HTML

Una vez que tenemos nuestro archivo en UTF-8 debemos decirle a nuestro documento HTML que usaremos un contenido con UTF-8.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="es-ES">
      <head>
            <title>titulo</title>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            <meta name="language" content="es" />
      </head>
      <body>
            á é í ó ú ñ
      </body>
</html>

Todo el contenido que escribamos, ya sean carácteres extraños o con acentos se mostrarán perfectamente, ya sean escritos directamente en HTML o por PHP.

Como mostrar acentos usando MYSQL

Si utilizamos cualquier gestor base de datos, debemos especificarle a la hora de crear nuestra de base que los datos que se encuentran también en UTF-8 para que pueda soportar acentos y otros carácteres. En MYSQL se especifica cuando se crea la base de datos.

Como mostrar acentos en HTML

Utilizar la codificación correcta en nuestros documentos hará que se muestre todos los caracteres correctamente por pantalla, ya sean acentos o cualquier otro carácter. Si tenéis alguna duda tan sólo preguntar por que he visto bastantes personas con problemas sobre como mostrar acentos en HTML.

Trackback en Como mostrar acentos en HTML

Hasta el momento el artículo Como mostrar acentos en HTML no tiene Trackbacks.

Comentarios en Como mostrar acentos en HTML

ya pegue tu codigo y nada de nada y e pegado estos otros y nada el problema es que cuando pego el codigo se mira bien en la pagina, pero al hacer un cambio interno en la pagina se descompone lo que escribi y tengo que volver a escribirlo asi se mira â¢ Ã¡ Cuando Pablo predicaba de la escritura. cuando se tendria que ver asi á Cuando Pablo predicaba de la escritura puedes ver el error asi lo voy a dejar talvez me ayudas a repararlo con algun codigo o un programa

alejandor 13/04/2010 04:08:45

No se necesita ningún programa o código para que nuestras webs tenga una codificación UTF-8. Seguramente algunos de los archivos que utilizas en tu proyectos no estarán con la codificación correcta. Te sugiero que revises todos los archivos para ver si están codificados a UTF-8 como dice el tutorial.

Saludos y suerte!

Sampedro 13/04/2010 13:45:23

Bueno creo que estoy confundido yo uso HTML-Kit pero te hare 2 preguntas 1. cuando escribes en html tu tienes que escribes asi : año o asi: año porque cuando escribo asi: año no me cambia la palabra pero el problema es que me tardo un mundo para hacer ese trabajo
2. habra algun programa para ahorrarme este trabajo

alejandor 14/04/2010 03:43:07

disculpa pero cuando te escribo lo que quiero no me aparece porque me lo transforma pero eso responde a mi primera pregunta que cuando escribes en html el codigo te transforma los acentos y la ñ y no tienes que escribir quote bueno solo respondeme la segunda pregunta

alejandor 14/04/2010 04:05:43

Hola alejandor me instalado HTML-Kit y el problema de que no muestre los acentos es que no trabaja con archivos UTF-8 (http://www.html-kit.com/support/292/utf-8/) por ello te aconsejo que si trabajas solo con HTML puedes hacerlo desde el notepad++ si necesitas un autocomplete de código podrías utilizar netbeans o eclipse, que trabajan con archivos UTF-8 y no tendrás problemas si escribes con acentos, Japonés o cualquier idioma.

Saludos!

Sampedro 15/04/2010 08:32:52

Ok estoy descargarndo ECLIPSE SDK 3.5.2 me puedes ayudar a usarlo o es igual que el html-kit

alejandor 16/04/2010 04:38:58

Escribir comentario en Como mostrar acentos en HTML

¡Tu opinión nos interesa!. Escribe tu opinión lo más clara posible para que todos podamos entenderla, evita el spam, comentarios ofensivos, etc. ya que serán eliminados. Tu opinión sera moderada antes de ser publicada, por lo que su aparición en la web puede tardar unos minutos. Si deseáis ponerse en contacto para sugerencias o críticas podéis hacerlo desde el formulario de contacto.