| Una consideración importante directamente relacionada con el texto de las páginas HTML es la codificación de los caracteres y la inserción de caracteres especiales. Algunos de los caracteres que se utilizan habitualmente en los textos no se pueden incluir directamente en las páginas web. En el caso de Blogger los caracteres que utilizamos, con las etiquetas por ejemplo, para crear las entradas en la edición HTML, serán interpretados por los navegadores, para estructurar y dar formato al texto, pero, lógicamente no aparecerán en la entrada. - Los caracteres que utiliza HTML para definir sus etiquetas (
<, > y ") no se pueden utilizar libremente.
- Los caracteres propios de los idiomas que no son el inglés (
ñ, á, ç, ¿, ¡, etc.) pueden ser problemáticos dependiendo de la codificación de caracteres utilizada.
La solución a la primera limitación consiste en sustituir los caracteres reservados de HTML por unas expresiones llamadas entidades HTML y que representan a cada carácter: | Entidad | Carácter | Descripción | Traducción |
| < | <
| less than | signo de menor que |
| > | > | more than | signo de mayor que |
| & | & | ampersand | Sin |
| " | " | quotation mark | comillas |
| | (espacio en blanco) | non-breaking space | espacio en blanco |
| ' | ' | apostrophe | apóstrofo |
Teniendo en cuenta lo anterior y considerando el siguiente texto: Los caracteres <, >, " y & pueden dar problemas con los textos en HTML |
Para mostrarlo correctamente en una página HTML, se debe sustituir cada carácter especial por su entidad HTML: <p>Los caracteres <, >, " y & pueden dar problemas con los textos en HTML</p> |
La siguiente es una sección de código de una plantilla de Blogger: <Variable name="bgColor" description="Page Background Color"
type="color" default="#efefef" value="#efefef">
<Variable name="textColor" description="Text Color"
type="color" default="#333333" value="#333333">
<Variable name="linkColor" description="Link Color"
type="color" default="#336699" value="#336699"> |
Para mostrarla correctamente en un post, se debe sustituir, en la Edición HTML, cada carácter especial por su entidad HTML: <Variable name="bgColor" description="Page Background Color" type="color" default="#efefef" value="#efefef"> <Variable name="textColor" description="Text Color" type="color" default="#333333" value="#333333"> <Variable name="linkColor" description="Link Color" type="color" default="#336699" value="#336699"> |
Ejercicio No.4 Determinar el código HTML que corresponde al siguiente documento: | Sintaxis de la etiqueta <blockquote> La sintaxis de la etiqueta <blockquote> se muestra a continuación:
<blockquote cite="...direccion original de la cita...">Texto que se cita</blockquote> |
Solución <h3>Sintaxis de la etiqueta <blockquote></h3>
<p> La sintaxis de la etiqueta <blockquote> se muestra a continuación: <br/><br/>
<blockquote cite="<em>...direccion original de la cita...</em>">Texto que se cita</blockquote> |
En cuanto a los caracteres propios de los idiomas diferentes al inglés también pueden ser problemáticos. El motivo es que desde que se crea una página web hasta que llega al navegador del usuario, intervienen numerosos procesos: - El diseñador crea la página web con su editor HTML (por ejemplo Dreamweaver).
- Si se trata de una aplicación dinámica, el programador recorta la página HTML del diseñador y la mezcla con el resto del código de la aplicación (por ejemplo PHP).
- El servidor web almacena las páginas HTML estáticas o el código de la aplicación web y sirve las páginas solicitadas por los usuarios.
- El usuario solicita y visualiza las páginas web a través de su navegador.
Si en todos los procesos anteriores se utiliza la misma codificación de caracteres, los caracteres propios de los idiomas se pueden escribir directamente, ejemplo: <p>Este párrafo contiene caracteres acentuados y se almacena en formato UTF-8</p> |
La palabra párrafo del ejemplo anterior incluye la letra á. Si el editor HTML del diseñador utiliza la codificación UTF-8 (como es el caso de las plantillas de Blogger), el entorno de desarrollo del programador también utiliza UTF-8, el servidor web sirve las páginas con esa codificación y el navegador del usuario es capaz de visualizar las páginas con formato UTF-8, el texto anterior se verá correctamente en el navegador del usuario. Sin embargo, muchas veces no es posible que todos los procesos involucrados utilicen la misma codificación de caracteres. Por limitaciones técnicas o por decisiones de los diseñadores y programadores, los textos pueden pasar de codificación UTF-8 a codificación ISO-8859 en cualquier momento. Si se produce este cambio sin realizar una conversión correcta, el navegador del usuario mostrará caracteres extraños en todos los acentos y en todas las letras como la ñ. La solución más sencilla para asegurar que todos estos caracteres potencialmente problemáticos se van a visualizar correctamente en el navegador del usuario consiste en sustituir cada carácter problemático por su entidad HTML: | Entidad | Carácter | Descripción oficial |
| ñ | ñ | latin letter n with tilde |
| Ñ | Ñ | latin capital n letter with tilde |
| á | á | a acute |
| é | é | e acute |
| í | í | i acute |
| ó | ó | o acute |
| ú | ú | u acute |
| Á | Á | A acute |
| É | É | E acute |
| Í | Í | I acute |
| Ó | Ó | O acute |
| Ú | Ú | U acute |
| € | € | euro |
Utilizando el mismo ejemplo anterior: <p>Este párrafo contiene caracteres acentuados y se almacena en formato UTF-8</p> |
El diseñador de la página web (editor HTML de Blogger) debería escribirlo así: <p>Este párrafo contiene caracteres acentuados y se almacena en formato UTF-8</p> |
...para que lo puedan presentar corectamente navegadores que no visualicen la codificación UTF-8. |
0 comentarios :
Este blog ya cumplió su ciclo, por esta razón, aunque sigue a disposición de los usuarios, no se harán más publicaciones ni se atenderán más consultas. La respuesta a su inquietud puede estar entre los comentarios hechos hasta aquí.
El autor.