Pautas de Diseño Web

 

 

Tal como al leer un libro, visitar un sitio web puede ser una experiencia agradable o irritante, las páginas mal diseñadas son en cierto modo, agresivas. Por el contrario un diseño cuidado, que trata de facilitar la vida al lector, mostrará cordialidad y preocupación. Así, un sitio web es también expresión de la buena o mala educación de sus creadores.

 

Personalidad
 

La personalidad de un sitio es importante. Antes se usaba la impersonalidad para dar la sensación de grandeza o importancia, grandes empresas como IBM o General Motors eran conducidas por grises ejecutivos desconocidos del público y lo que importaba entonces era la imagen corporativa de una gran organización. Las empresas pequeñas, aún de una sola persona, también se escondían detrás de sonoros nombres de fantasía para causar una impresión de importancia.

Pero los tiempos han cambiado, Microsoft está claramente ligada a la persona de Gates, Pepsi a la de Roger Enrico y así tantas otras. Las empresas hoy se muestran tal como son, la expresión del ego de sus directores y todo eso de la imagen corporativa impersonal es algo que ha caído en desuso.

Una buena página siempre debe tener un toque personal, nombres, historias, unas fotos. Debe establecer -en mi opinión -una comunicación real, de persona a persona lo que es mucho más efectivo que un ente anónimo que habla al público en general. Yo a ti, en lugar de nosotros a ellos. Una buena página debe provocar simpatía.

Pero no hay que perder de vista que la "personalidad" es solo un medio para entregar el mensaje de manera más efectiva. Nada más irritante que un sitio cuyo tema es "yo, mi perro, mi gato, mis hijos...etc.", cosas que casi seguramente a nadie importan, a menos que se trate de una celebridad exhibicionista.

También existe el riesgo de que una personalidad desagradable se deje traslucir en el estilo del sitio, por eso es importante dar con el toque justo de los elementos personales que se incluirán; ni tan pocos que resulte anónima, ni tantos que sea ególatra o desagradable y sobre todo, que el contenido tenga un real interés para la audiencia a la que apunta el sitio.

  

Lo Malo

 

Claro que todo lo que escribo aquí es muy personal y se basa en mis propios gustos y criterios, pero creo que hay consenso en considerar algunas cosas como malas, mi lista personal de lo que me irrita en un sitio es la siguiente:

  • Exceso de efectos: flash, gif animados, textos que se desplazan, marquesinas, etc. deben ser usados mesuradamente. Tal como un buen libro no abusa jamás de los adjetivos, los efectos especiales en un sitio deben ser cuidadosamente medidos. Cada efecto que se use debe estar sólidamente justificado por el contenido. Las páginas "árbol de pascua" llenas de colgajos inútiles encabezan la lista de lo que no me gusta

  • Links ocultos, páginas-laberinto que obligan a probar distintos caminos presumiendo que a mi me interesará hacerlo y que no me importará perder mi tiempo. Creo que es una actitud muy desconsiderada

  • Sitios-árbol con multitud de ramas, que obligan a pasar por muchas hojas previas antes de llegar adonde yo quiero. Esa es una práctica típica que deja muy orgulloso al diseñador y furioso al usuario.

  • Sitios recargados de imágenes que demoran excesivamente en cargarse. Un error bastante estúpido y frecuente es pensar que todo el mundo tiene conexión de alta velocidad

  • Los frames, odio los frames, son francamente feos y su utilidad es minúscula. Claro que esa es solo mi opinión.

  • Poco contraste entre texto y fondo, el uso inadecuado de los colores no solo es signo de mala educación, es casi agresivo

  • Exceso de orden o desorden, un sitio web demasiado ordenado o simétrico es frío como una tumba, si, por el contrario el sitio es muy asimétrico o disperso cansa la vista, confunde y da la sensación de haberse hecho sin cuidado. Aquí tiene que haber un equilibrio

 

Planificación
 

Esta etapa se pasa por alto muchas veces y consiste en determinar a priori el enfoque y los principales criterios de diseño que se usarán en cada una de las secciones del sitio. En esta etapa se debe definir la personalidad y los contenidos del sitio.

Si será diseñado por un equipo de personas deberá existir un jefe de proyecto responsable global del desarrollo del sitio. En la etapa de planificación es indispensable:

  • Determinar a quienes está dirigido el sitio, este es el punto más importante porque condiciona muchas de las demás especificaciones del diseño. Al conocer la audiencia tendremos el pie forzado para cosas tales como

- el nivel de formalidad de la redacción
- el "peso" en kilobytes de cada página
-  el mensaje implícito en la gráfica y el diseño
-  los contenidos

  • Distribución del trabajo, en caso que el sitio sea elaborado por un grupo de personas, el trabajo se debe distribuir, a lo menos, en:

- Jefe de proyecto
- Generadores de contenido
- Diseñador gráfico
- Corrector de pruebas

 

Layout
 

El layout es el plano o distribución de la información a través de la pantalla. esta distribución tiene dos objetivos importantes:

  • Facilitar la lectura
  • Hacer la página atractiva a la vista y organizada

Para aprender a diseñar layouts es bueno estudiar como distribuyen la información los diarios en sus páginas. La información de un diario que mezcla imágenes y textos de distinto contenido en espacios limitados es una buena escuela para aprender a distribuir la información en pantalla de manera atractiva.

En las páginas web la distribución se hace combinando tablas y sangrías. El layout debe ser ordenado pero no aburrido, los párrafos deben tener una separación conveniente y los textos e imágenes deben seguir un orden lógico, los textos deben ir siempre sangrados, nunca escritos hasta el borde.

 

Tipografía
 

Escoger la tipografía es asunto bastante personal, pero hay un principio básico; un  diseño debe ser igualmente bueno en toda clase de equipos. Como las páginas HTML ocupan los fonts del equipo cliente que las descarga el sentido común aconseja que solo usemos aquellos font que sabemos que están instalados en la mayoría de los equipos. Esto nos reduce al Arial, Times New Roman y unos pocos más, de otro modo nos arriesgamos a que todos nuestros esfuerzos tipográficos se vean arruinados solo porque el que descargó la página no tiene instalado el font correspondiente.

Los tipos de Arial 12, Arial 10 (normal y negrita) y Arial Black para los títulos son mis favoritos, sin embargo en este documento he usado Times New Roman en negrita de 12 para el cuerpo y 24 en negrita cursiva para los títulos. La regla general es que la tipografía, el layout y los colores se deben mantener a lo largo de todo el sitio, pues forman parte de la "personalidad" del mismo, este documento quiebra la regla para mi propio sitio.

El uso de cursivas para enfatizar una idea es muy recomendable, aunque tampoco se debe abusar, como me pasa a mi algunas veces.

Colores
 

Los colores y fondos son una parte muy importante de la personalidad de un sitio web. Los colores son a un sitio lo que la ropa es a las personas, pueden darle una apariencia profesional, chapucera, chistosa, grosera, agresiva, nerd, estúpida, artística, intelectual o lo que sea. Los colores pueden ayudar pero también son muy eficaces destruyendo o causando impresiones negativas.

No hay regla fija porque "de gustos no hay nada escrito", pero hay ciertas cosas que siempre deben tenerse en cuenta:

  • La legibilidad: Jamás usar letras claras sobre fondo claro u oscuras sobre fondo oscuro. La letra negra sobre fondo blanco es insuperable en cuanto a legibilidad en pantalla, la sigue la letra blanca sobre fondo azul, hay estudios al respecto y por eso la gran mayoría de los sitios profesionales usan estas combinaciones

  • Si se usa una imagen de fondo, esta jamás debe ser distractiva respecto del contenido. La verdad es que en la práctica casi todos los fondos resultan distractivos y producen cansancio visual.. Si insistimos en usar un fondo, nunca debe escribirse directamente sobre el y solo debe ser un marco que soporte al texto que debe ir sobre colores puros de máximo contraste

  • El fondo negro es una gran tentación y, aunque no está definitivamente prohibido debe usarse con mesura y solo en unas pocas combinaciones como negro-rojo-blanco (la más usual)

  • Colores que deben usarse con máximo cuidado son el amarillo (causa gran fatiga visual), verde claro (peor), rojo. Por regla general yo prefiero usar colores primarios antes que los compuestos y evito como al diablo el color café. Los colores fatigantes como el amarillo y rojo están prohibidos para cubrir grandes áreas pero son muy adecuados para cuadros que contengan títulos o información muy destacada

  • Por último las reglas se hicieron para romperse, lo que he colocado aquí son las normas generalmente aceptadas pero si alguien da con una combinación de colore prohibidos que lo deja satisfecho, entonces adelante, total, sobre gustos no hay nada escrito.

 

Imágenes
 

Esas, que valen por mil palabras, si son fotografías deben tener formato jpg y los dibujos formato gif. Hay que recordar que la compresión del jpg se puede aumentar con la mayoría de los programas gráficos populares (Paint Shop Pro, por ejemplo), lo ideal es mejorar la compresión, creando archivos más pequeños, claro que esto afecta a la calidad de imagen así es que hay que buscar un punto de equilibrio. Una buena página se descarga rápidamente en cualquier equipo, incluso en los más lentos. 

No hay que abusar de las imágenes porque a nadie le gusta una página recargada y lenta. Si demora mucho en descargarse la mayoría de las personas simplemente se desconectará sin siquiera verla.

Las imágenes deben concordar con el contenido, tener significado. Muchas páginas caen en el error de colocar imágenes de adorno, sin relación con el contenido de la página eso es pura grasa, molesta y no sirve para nada. Los adornos (como la manito que encabeza cada párrafo en este artículo) deben usarse con gran mesura y ser muy pequeños en tamaño

 

Estilo

 

En cuanto al estilo de los contenidos también es cosa de preferencias personales. Yo creo que un poco de informalidad casi siempre es posible y deseable, aunque todo depende de la audiencia objetivo y el mensaje que se desea transmitir. Sin embargo informalidad no debe ser nunca sinónimo de improvisación o mala calidad, así es como por mi parte yo me atengo a manuales de estilo periodísticos como por ejemplo las "Normas Básicas para los Servicios Informativos" de la Agencia EFE, algunas normas interesantes, por ejemplo son:

  • Una información debe estar redactada de manera precisa, correcta, concisa, clara, imparcial, pulcra y sencilla.

Las palabras y locuciones no imprescindibles (pues, entonces, por consiguiente, conviene o cabe recordar, hay que pensar, no hay que olvidar, es evidente, es obvio, no cabe duda que, tenemos que, en otro orden de cosas) son hilvanes innecesarios que han de evitarse. (Este es un vicio del que a mi me cuesta mucho desprenderme)

  • En la redacción periodística es aconsejable seguir el orden lógico de la oración castellana: sujeto, verbo y complementos.

  • Una información se considera incompleta si no recoge las diversas posiciones existentes.

  • En el texto de una información debe evitarse la introducción de cualquier ambigüedad que de pie a interpretaciones diversas.

  • En un texto que vaya a emitirse por las líneas informativas nunca deben utilizarse expresiones vulgares, insultantes, obscenas o blasfemas.

  • El título debe ser la síntesis más depurada de la información. su función es denotar la importancia, el interés y la novedad de ésta y animar a su lectura.

  • Su extensión no debe sobrepasar los 65 espacios.

  • Hay que evitar títulos negativos o interrogativos; los afirmativos resultan, en general, más acertados.

  • El lead o primer párrafo es una síntesis que resume de modo escueto y autónomo la esencia de la información.
  • El lead debe incluir los datos básicos más importantes, llamativos o insólitos de la información y la fuente de origen.

  • Su extensión no debe rebasar cinco líneas en pantalla.

  • Debe estar redactado en forma diáfana y atractiva, de modo que induzca a proseguir la lectura o la audición.

  • En el comienzo de un lead deben evitarse los vocablos "No", "Hoy" o "Mañana".

Bueno, hay varias otras normas por el estilo que yo mismo no siempre respeto, pero creo que son una buena guía para redactar los contenidos de manera clara y agradable.

Volver al Principio