| Mostrar/ocultar el texto oculto |
La elección de una fuente es un paso de muy importante cumplimiento porque influye de manera relevante en el acabado gráfico de una página web. Para hacerse una idea, basta decir que más del 90% de la información en la Web es textual. Resulta por tanto fundamental utilizar para los textos de un sitio web fuentes no solo bonitas sino también fácilmente leíbles en pantalla, además de tener la certeza de que todos nuestros visitantes puedan visualizarlas correctamente, independientemente del dispositivo y del explorador que utilicen para la navegación.
La legibilidad de una fuente depende fundamentalmente de factores como el tipo al que pertenece, la "altura de la x" y el tamaño general del carácter.
|
Además de la legibilidad, hasta que se introdujo el CSS3, otro factor que influía gravemente en la elección de fuentes para páginas web era la compatibilidad ofrecida por los exploradores. De hecho, se estaba obligado a utilizar únicamente fuentes estándar, es decir juegos de caracteres con difusión universal y por tanto ya presentes en la mayor parte de los ordenadores. En la práctica, cuando se desarrolla una página web se dice al cliente qué fuente utilizar para renderizar el texto. El cliente busca entre las fuentes presentes en el ordenador que se está usando para ver si está disponible la requerida: si está presente, procede según las instrucciones, en caso contrario utiliza una fuente por defecto. Este mecanismo imponía por tanto el utilizar siempre las mismas fuentes (Arial, Verdana, Georgia y pocas más) a fin de poder mantener el resultado visual deseado para las páginas web, limitando fuertemente la creatividad de los autores. |
Con el CSS3 se introdujo la posibilidad de utilizaren las páginas web también fuentes no estándar: por medio del comando @font-face, en efecto, es posible enviar al cliente el archivo (en formato TTF, EOT, WOOF o SVG según el Explorador que se esté usando) que contiene el juego de caracteres para utilizar en una determinada página. De esta manera el cliente ya no tiene que buscar si la fuente está ya instalada en el ordenador que se está usando, sino que utiliza un juego de caracteres vinculado a la hoja de estilo de la página misma. Así, gracias al CSS3 se ha hecho posible introducir en una página web cualquier Fuente Web dejando que el usuario lo descargue directamente. Existen 2 técnicas principales para utilizar las Fuentes Web:
Una desventaja de estas soluciones es que las Fuentes Web tiene que descargarlas el usuario, por tanto tienen un impacto más o menos significativo en el tiempo de carga de la página. Frente a esto, la ventaja que ofrecen es que se tiene mucha más libertad a la hora de dar formato a los textos y la posibilidad de obtener aspectos gráficos más atractivos e interesantes. Además en el caso de las Fuentes Google las fuentes permanecen archivadas en los servidores de Google y no se necesita siquiera publicarlas en el servidor del sitio web. |
Ahora que gracias a las Fuentes Web también se puede disfrutar en la Web de la misma libertad creativa a la que se está acostumbrado trabajando en el escritorio del propio ordenador, es necesario tener cuidado de no abusar de ella. Algunos consejos que estaría bien tener en cuenta:
|
Son muchos los puntos en los que WebSite X5 da la posibilidad de elegir las fuentes que se quiere utilizar: naturalmente la opción para la selección de la fuente está disponible en el editor del Objeto Texto, pero también en el editor del Encabezado/Pie de página de la Plantilla gráfica, y en general cada vez que se trabaja con un texto, ya sea este un contenido, un elemento del menú, una etiqueta, etc. En cada caso, la elección del tipo de carácter se realiza mediante un menú en el que se muestran automáticamente todas las fuentes instaladas en el ordenador. Esta lista se puede ampliar añadiendo, sin tener que instalarlas en el sistema, Fuentes Web tomadas de Internet (ver Cómo utilizar las Fuentes Web). En el menú de selección, todas las fuentes del sistema y las Fuentes Web añadidas se muestran juntas en una lista en orden alfabético, pero es fácil distinguirlas gracias a los iconos que las acompañan:
|
Best practice:
