{"id":84,"date":"2025-08-03T14:40:12","date_gmt":"2025-08-03T14:40:12","guid":{"rendered":"https:\/\/corporativa.biz\/wp1\/?p=84"},"modified":"2026-01-05T14:41:34","modified_gmt":"2026-01-05T14:41:34","slug":"utf8-n-tildes-y-caracteres-especiales","status":"publish","type":"post","link":"https:\/\/corporativa.biz\/wp1\/2025\/08\/03\/utf8-n-tildes-y-caracteres-especiales\/","title":{"rendered":"UTF8: \u00f1, tildes y caracteres especiales"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\"><strong>La utilizaci\u00f3n de caracteres especiales a lo largo del texto puede convertirse en un dolor de cabeza si se mezclan diferentes codificaciones o si se elige una inadecuada para el idioma a utilizar en el sitio o plantilla html de mailing.<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Para quienes no son expertos en los diferentes tipos de lenguaje de programaci\u00f3n, es muy probable que se vean enfrentados a dificultades en el mundo de la inform\u00e1tica a la hora de codificar un sitio web o&nbsp;dise\u00f1o html de correo electr\u00f3nico. Uno de los problemas m\u00e1s comunes es la aparici\u00f3n de caracteres extra\u00f1os debido a errores en la codificaci\u00f3n.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Todo en UTF-8<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Frente al dilema de qu\u00e9 tipo de codificaci\u00f3n utilizar en la programaci\u00f3n de un sitio web o dise\u00f1o de email, recomendamos que elijas hacerlo \u00fanicamente en UTF-8. As\u00ed evitar\u00e1s que los caracteres especiales sean interpretados de manera diferente por los navegadores, lo cual termina haciendo ilegibles los textos para los usuarios.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Si de antemano sabes que nunca aparecer\u00e1n tildes o \u201ce\u00f1es\u201d en tu html para el dise\u00f1o de campa\u00f1as de mailing o sitio, la codificaci\u00f3n no ser\u00e1 relevante (aunque podr\u00edan haber otros s\u00edmbolos que s\u00ed te ocasionen problemas).<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">No obstante, si el contenido de la web o del html del correo est\u00e1 en idioma espa\u00f1ol, por ejemplo, obligadamente necesitar\u00e1s usar tildes y e\u00f1es a lo largo de los textos. En ese caso, tendr\u00e1s que estar mucho m\u00e1s atento a la codificaci\u00f3n utilizada.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>C\u00f3mo corregir la configuraci\u00f3n del sitio<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">En el caso de que nuestra web o dise\u00f1o de plantilla html de mailing contenga demasiado texto, puede ser una tarea tit\u00e1nica el introducir los caracteres especiales manualmente. En ese caso, recomendamos destinar un poco m\u00e1s de recursos y corregir la configuraci\u00f3n completa de la p\u00e1gina o dise\u00f1o de mailing.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Primero, debemos asegurarnos de que nuestro sitio web o dise\u00f1o de correo est\u00e9 codificado con las&nbsp;etiquetas META deseadas.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>En el caso de UTF-8:<\/strong>&nbsp;&lt;meta http-equiv=\u201dContent-Type\u201d content=\u201dtext\/html; charset=UTF-8\u2033 \/&gt;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>En el caso de ISO-8859-1:<\/strong>&nbsp;&lt;meta http-equiv=\u201dContent-Type\u201d content=\u201dtext\/html; charset=ISO-8859-1\u2033 \/&gt;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>C\u00f3mo solucionar el problema de los caracteres especiales<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Cuando se trata de cambios puntuales, el est\u00e1ndar html est\u00e1 preparado para colocar todos los s\u00edmbolos y tildes que necesitemos, codific\u00e1ndolos de la siguiente forma:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Para los tildes y e\u00f1es, deber\u00edamos colocar:<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u00e1 -&gt; &amp;aacute;<br>\u00e9 -&gt; &amp;eacute;<br>\u00ed -&gt; &amp;iacute;<br>\u00f3 -&gt; &amp;oacute;<br>\u00fa -&gt; &amp;uacute;<br>\u00f1 -&gt; &amp;ntilde;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>En el caso de tildes abiertas:<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u00e0 -&gt; &amp;agrave;<br>\u00e8 -&gt; &amp;egrave;<br>\u00f2 -&gt; &amp;ograve;<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">De esta forma veremos todos los caracteres especiales correctamente, independiente del charset.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Diferencias entre ISO-8859-1 y UTF-8<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Las codificaciones m\u00e1s frecuentes son<a href=\"http:\/\/www.html5.showbizreal.com\/Columnas\/Atributos\/meta_charset.html\" target=\"_blank\" rel=\"noreferrer noopener\">&nbsp;ISO-8859-1 y UTF-8<\/a>. A continuaci\u00f3n, te explicamos de qu\u00e9 se trata cada una:<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>\u2013 UTF-8 (8-bit Unicode Transformation Format):<\/strong>&nbsp;Es un formato de codificaci\u00f3n de caracteres Unicode e ISO 10646, que utiliza s\u00edmbolos de longitud variable. Est\u00e1 definido como est\u00e1ndar por la RFC 3629 de la Internet Engineering Task Force (IETF).<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>Sus caracter\u00edsticas principales son:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Es capaz de representar cualquier car\u00e1cter Unicode.<\/li>\n\n\n\n<li>Usa s\u00edmbolos de longitud variable (de 1 a 4 bytes por car\u00e1cter Unicode).<\/li>\n\n\n\n<li>Incluye la especificaci\u00f3n US-ASCII de 7 bits, por lo que cualquier mensaje ASCII se representa sin cambios.<\/li>\n\n\n\n<li>Incluye sincron\u00eda. Es posible determinar el inicio de cada s\u00edmbolo sin reiniciar la lectura desde el principio de la comunicaci\u00f3n.<\/li>\n\n\n\n<li>No superposici\u00f3n. Los conjuntos de valores que puede tomar cada byte de un car\u00e1cter multibyte son disjuntos, por lo que no es posible confundirlos entre s\u00ed.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>&nbsp;ISO 8859-1:<\/strong>&nbsp;Es una norma de la ISO que define la codificaci\u00f3n del alfabeto latino. Incluyendo los diacr\u00edticos (como letras acentuadas, \u00f1, \u00e7), y letras especiales (como \u00df, \u00d8). Estos son necesarios para la escritura de las siguientes lenguas originarias de Europa occidental:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Afrik\u00e1ans, alem\u00e1n, castellano, espa\u00f1ol, catal\u00e1n, euskera, aragon\u00e9s, asturiano, dan\u00e9s,escoc\u00e9s, fero\u00e9s, fin\u00e9s, franc\u00e9s, ga\u00e9lico, gallego, ingl\u00e9s, island\u00e9s, italiano, Holand\u00e9s, noruego, portugu\u00e9s y sueco.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">La clave: No mezclar las distintas codificaciones<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">En conclusi\u00f3n, la generaci\u00f3n de caracteres extra\u00f1os se debe a la utilizaci\u00f3n de distintas codificaciones al mismo tiempo. Es decir, si usamos ISO-8859-1 para nuestra web o dise\u00f1o de plantilla html de email, todo deber\u00eda estar en ISO. No puede haber mezcla de algunas partes en ISO y otras en UTF-8.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Al usar ISO, por ejemplo, podemos tener una web o plantilla de correo en espa\u00f1ol con tildes y e\u00f1es funcionando. Incluso, en portugu\u00e9s, ya que tambi\u00e9n permitir\u00e1 el car\u00e1cter \u201c\u00e7\u201d. Sin embargo, a diferencia del UTF-8, no funcionar\u00e1 si lo que queremos hacer es una web con alfabeto chino, japon\u00e9s o griego.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Esperamos aliviarte el dolor de cabeza que significa encontrarse con caracteres extra\u00f1os en los dise\u00f1os html de mailing.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Fuente: <a href=\"http:\/\/blog.fidelizador.com\/2019\/12\/17\/utf8-n-tildes-y-caracteres-especiales\/\">http:\/\/blog.fidelizador.com\/2019\/12\/17\/utf8-n-tildes-y-caracteres-especiales\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>La utilizaci\u00f3n de caracteres especiales a lo largo del texto puede convertirse en un dolor de cabeza si se mezclan diferentes codificaciones o si se elige una inadecuada&#8230;<\/p>\n","protected":false},"author":2,"featured_media":142,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[72,73,9,29,76,66,71,77,75,78,74,70],"class_list":["post-84","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-fundamentos-y-dominios","tag-caracteres-especiales","tag-codificacion","tag-desarrollo-web","tag-email-marketing","tag-entidades-html","tag-html","tag-iso-8859-1","tag-meta-tags","tag-n","tag-solucionar-caracteres-extranos","tag-tildes","tag-utf-8"],"_links":{"self":[{"href":"https:\/\/corporativa.biz\/wp1\/wp-json\/wp\/v2\/posts\/84","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/corporativa.biz\/wp1\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/corporativa.biz\/wp1\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/corporativa.biz\/wp1\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/corporativa.biz\/wp1\/wp-json\/wp\/v2\/comments?post=84"}],"version-history":[{"count":3,"href":"https:\/\/corporativa.biz\/wp1\/wp-json\/wp\/v2\/posts\/84\/revisions"}],"predecessor-version":[{"id":143,"href":"https:\/\/corporativa.biz\/wp1\/wp-json\/wp\/v2\/posts\/84\/revisions\/143"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/corporativa.biz\/wp1\/wp-json\/wp\/v2\/media\/142"}],"wp:attachment":[{"href":"https:\/\/corporativa.biz\/wp1\/wp-json\/wp\/v2\/media?parent=84"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/corporativa.biz\/wp1\/wp-json\/wp\/v2\/categories?post=84"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/corporativa.biz\/wp1\/wp-json\/wp\/v2\/tags?post=84"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}