Como mostrar los acentos y las ñ en HTML

Este articulo va especialmente dirigido a Victor y Petrus, dos usuarios que están siguiendo el curso de HTML que tengo en este blog, aunque los demás también podéis leerlo ;D. La razón es que han empezado a seguir el curso de HTML que hice y los dos se han encontrado con un problema, yo también lo tuve al principio y es que al escribir texto para mostrar en el navegador los acentos y las «ñ» no aparecen correctamente, en su lugar aparecen caracteres extraños, esto tiene muy fácil solución.

Este problema viene ya que no hemos definido el juego de caracteres que va a manejar la web, normalmente en un servidor esta definido por defecto uno que nos permitirá que la web se vea correctamente, pero tampoco esta de mas incluir la linea de código, por si acaso. Os voy a poner un código de ejemplo de una web muy sencilla que tiene los caracteres «conflictivos»:

<html>

<head></head>

<body>
Esto es una prueba con la ñ y los acentos ò
</body>

</html>

Si ejecutamos este código HTML en el navegador veremos algo como lo siguiente:

 

html-acentos-ñ2

 

Como podéis ver las «ñ» y los acentos no se muestran, en su lugar aparecen unos caracteres extraños. Esto lo podemos solucionar de dos formas principales, una es poner los códigos mediante unas tablas, pero eso en una web grande puede ser muy tedioso, en su lugar vamos a definir el juegos de caracteres que vamos a usar y así todo se mostrara correctamente.

La anterior pagina que os he puesto mas arriba quedaría de la siguiente forma:

<html>

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

<body>
Esto es una prueba con la ñ y los acentos ò
</body>

</html>

Hemos añadido una «meta» en la sección «head» para definir el juego de caracteres que queremos usar, si ahora ejecutamos esa pagina web veremos lo siguiente:

 

html-acentos-ñ

 

Como podéis ver el problema se soluciona ingresando la linea que os he comentado. Esta linea habría que incluirla siempre en nuestras webs, de esa forma no tendremos problemas, hay mas juegos de caracteres, pero esa nos servirá.

Un saludo.

79 comentarios
  1. 15 octubre, 2014
    • 15 octubre, 2014
  2. 15 octubre, 2014
    • 15 octubre, 2014
    • 5 junio, 2016
    • 14 julio, 2017
    • 2 abril, 2018
    • 23 febrero, 2019
  3. 15 octubre, 2014
    • 15 octubre, 2014
  4. 15 octubre, 2014
    • 15 octubre, 2014
  5. 27 abril, 2015
    • 28 abril, 2015
  6. 15 mayo, 2015
    • 16 mayo, 2015
  7. 8 junio, 2015
    • 11 junio, 2015
      • 29 julio, 2017
        • 24 septiembre, 2017
  8. 13 agosto, 2015
    • 13 agosto, 2015
  9. 24 octubre, 2015
    • 27 octubre, 2015
      • 26 enero, 2016
        • 29 enero, 2016
          • 7 junio, 2016
          • 14 junio, 2016
  10. 16 noviembre, 2015
    • 17 noviembre, 2015
  11. 17 diciembre, 2015
    • 6 enero, 2016
  12. 19 julio, 2016
    • 22 julio, 2016
  13. 29 julio, 2016
    • 10 agosto, 2016
  14. 6 septiembre, 2016
    • 10 septiembre, 2016
  15. 13 octubre, 2016
    • 13 octubre, 2016
  16. 23 octubre, 2016
    • 24 octubre, 2016
  17. 24 octubre, 2016
  18. 5 diciembre, 2016
    • 5 febrero, 2017
  19. 29 diciembre, 2016
  20. 21 febrero, 2017
    • 25 marzo, 2017
  21. 11 marzo, 2017
    • 25 marzo, 2017
  22. 21 marzo, 2017
  23. 11 abril, 2017
    • 12 abril, 2017
  24. 12 abril, 2017
    • 17 abril, 2017
      • 1 junio, 2017
        • 11 julio, 2017
  25. 2 junio, 2017
    • 11 julio, 2017
  26. 14 enero, 2018
    • 11 marzo, 2018
  27. 27 febrero, 2018
    • 11 marzo, 2018
  28. 21 abril, 2018
  29. 10 mayo, 2018
    • 26 agosto, 2018
  30. 12 febrero, 2019
    • 3 abril, 2019
  31. 18 marzo, 2019
    • 3 abril, 2019
  32. 18 marzo, 2019
  33. 18 marzo, 2019
  34. 18 marzo, 2019
  35. 18 marzo, 2019
  36. 18 marzo, 2019
  37. 1 abril, 2022

Deja un comentario

Tu dirección de correo electrónico no será publicada.