viernes, 11 de julio de 2014

Dejar las pantallas a medias

Hoy vengo a discutir un tema en el cuál diseñadores e informáticos parece que no nos podemos de acuerdo. 

La pregunta es la siguiente:

¿Deben tener las páginas webs un ancho fijo o deben adaptarse a la pantalla?

La mayoría de diseñadores lo tienen claro y votan por el ancho fijo.  Yo voy a votar por la otra opción. Aunque con matices.  Vamos a la discusión.

El primer argumento de los diseñadores es que 'todos los buenos' hacen diseños con ancho fijos. Subrayan lo de TODOS  y me citan Facebook y alguna web más para zanjar la discusión.

Lo que sigue es una imagen de la web  del ayuntamiento de Granada en una pantalla con cierta resolución...


Se me antoja que podía aprovechar mejor el espacio.

Un caso parecido, los vídeos verticales

Hay otra discusión que considero muy relacionada. Aunque algunos dirán que no tiene nada que ver, a mi se me antoja que es el mismo problema.  Me refiero al 'problema' de los vídeos verticales.  Una simpática campaña los ridiculizó con el siguiente vídeo:



Para mi el problema es el mismo, así que voy a definirlo.   Consiste en elaborar un producto audiovisual que se muestra en un marco.... al que no se adapta.  Las pantallas de televisiones, o lo que es lo mismo, los monitores de ordenadores, al igual que las pantallas de cine y otros dispositivos, son alargados.  En gran parte motivado porque tenemos dos ojos uno a lado del otro, que no uno encima del otro (el vídeo anterior te lo deja claro). Así que si quieres presentar algo en una pantalla horizontal parece razonable que ese algo sea horizontal en la mayoría de los casos.

Centrémonos en el caso de las webs.  Estoy delante de mi ordenador, uno de sobremesa, con una pantalla de resolución 1280x1024. Una resolución que podemos considerar 'normalita'. No es una pantalla panorámica sino discreta. Ahora entro en una web y me encuentro que sobran cerca de 10 cms por cada lado y que conforme la voy viendo me tengo que desplazar hacia abajo para acceder a la información.   Creo que debo llamarla ... ¡Una web vertical en una pantalla horizontal! y a mi me parece ver los mismos problemas que denunciaba el vídeo anterior.

El lenguaje HTML

Siguiente aspecto que quiero discutir es técnico pero obedece a una necesidad muy relacionada con lo que discutimos.  HTML son las iniciales de 'HyperText Markup Language' que podemos traducir como Lenguaje de marcas para hipertexto.  Se trata de un conjutno de reglas que permiten confeccionar un texto multimedia en el ordenador.   Para ver los textos que elaboramos con HTML usamos los navegadores, como Firefox, IExplorer o Chrome.  Estos navegadores interpretan lo que hemos escrito en HTML y nos lo muestran. O dicho de una forma que a algunos le asusta: El navegador 'interpeta' el texto y nos lo muesta.  El susto al que hago alusión es la palabra 'interpreta'.  Da sensación de pérdida de control. Y claro a algunos diseñadores esto les desconcierta: ¿Hago un folleto y luego se puede ver en otro color, las imágenes crecen, las letras cambian?  ¡¡¡ Ahhhh !!! una herejía.  Muchos diseñadores  verifican los trabajos de las imprentas, para evitar desviaciones de lo que han elaborado. Así que esto les parece inadmisible.

Veamos un ejemplo.   Si uno escribe en lenguaje HTML algo así como:
<h1>Don Quijote de la Mancha</h1>

le estamos diciendo al navegador que es un título (eso es lo que indica el H1), así que lo pondrá más grande que el resto, en letra negrita y con alguna característica más.  Puede ser que en un sitio se vea así:

Don Quijote de la Mancha

Y en otro se vea distinto, por ejemplo:

Don Quijote de la Mancha

Evidentemente es un problema para el diseño.  El problema se resuelve porque HTML cuenta con herramientas para precisar muchas cosas, tales como el tamaño de los títulos, fuente, color y otras caracteríticas. Además se pueden crear diferentes tipos de titulares.

Esto parece una complicación innecesaria. Alguien puede pensar que HTML no sirve de nada. Sería mejor hacer los textos con 'mejores herramientas'.   Por ejemplo con Word no hay ningún problema. Uno elige la fuente, el tamaño y todo sale 'tal y como queremos'.   Es lo que se conoce como WYSIWYG, en inglés "What You See Is What You Get", que podemos traducir por "lo que se ve es lo que se obtiene".

Para mi esa 'solución' es un grave error.  Pienso que WYSIWYG es de por sí un error.  Pero de eso hablaré otro día.  Hoy vamos a centrarnos en HTML.   Lo que parece ser un problema, el que HTML contiene intrucciones vagas que luego el navegador interpreta a su manera, no es sino la ventaja del lenguaje.  Justamente eso permita que HTML funcione en un gran número de dispositivos y de circunstancias distintas.

Una página web bien diseñada puede verse en pantallas pequeñas, grandes, panorámicas, móviles, tablets y dónde haya un navegador con un buen grado de eficacia.  Diseñar exigiendo una pantalla concreta a menudo proviene de  la falta de recursos más que de necesidades reales.

Los ebooks

Voy a poner otro ejemplo (lo usaré cuando ataque el modelo WYSIWYG), los formatos de ebooks.  Hay un formato propio para los que no conciben adaptarse a distintas circunstancias, el PDF. En un PDF está todo definido, el salto de página, el salto de línea, las fuentes, los tamaños. Todo.  Eso sí, un PDF cómodo para una pantalla de 21" es inútil para un ebook de 6" y viceversa. Sin embargo hay formatos que se pueden ver en ambos casos con mejores prestaciones gracias a que son dinámicos.  Si uno olvidó las gafas de leer de cerca, pulsando unos botones puede leer con las letras a mayor tamaño.


Atenuantes

Ahora voy a dar algunas circunstancias que disculpan o aconsejan los diseños de webs a tamaño fijo.

En primer lugar cabe pensar en que no siempre se cumple lo que indiqué de las pantallas horizontales.  Ciertamente con los móviles y otros dispositivos (incluidas pantallas que pueden girar 90º) cabe pensar en que la pantalla sea vertical.  Es una opción que puede justificar algunos diseños.

En segundo lugar hay informaciones que requieren usos concretos de espacios.  Por ejemplo, un texto en una pantalla panorámica puede ser incómodo de leer y es preferible que ocupe una porción de la pantalla. Eso sí dentro de algún diseño medianamente coherente con esa pantalla.


Conclusiones

Pido un diseño de webs versátiles, que no sean verdaderos desastres fuera de unas pocas pantallas, las del diseñador y sus amigos.  Tiene que se suficientemente dinámica para adaptarse a un conjunto amplio de situaciones, aunque no sea ilimitado.