Recomendaciones para diseñadores Web

Dados los inconvenientes que hemos tenido al recibir material, hemos redactado una serie de consejos para los diseñadores. A fin de agilizar el desarrollo de los proyectos.

Diseños en pixel para 72ppp:

Uno de los problemas más usuales de los materiales que recibimos, son diseños realizados en formatos vectoriales, sean Freehand, Illustrator, Corel Draw, etc.

Los software de tipo vectorial no permiten una visualización rasterizada (En pixel real, tal cual como se muestran las imágenes en un ordenador).

El trabajo de rasterización del formato vectorial, tiene como consecuencia la formación de halos o moaré, esto sucede porque un trazado vectorial no encaja en una cuadrícula de pixeles, por lo tanto el proceso crea en los bordes de un rectángulo o de otras formas rectas, un suavizado innecesario que quita legibilidad. Este efecto también suele suceder con las tipografías, produciendo así un problema más importante.

Recomendación: recomendamos la producción de los bocetos en software especializados en la generación de gráficos para pantallas, sean: Photoshop o Fireworks. Este último tiene la posibilidad de trabajar con vectores y una rasterización constante para evitar moaré no deseado en formas y/o tipografías.

El uso de otros programas implica el trabajo extra de adaptar el diseño a un formato de archivo y una herramienta que pueda ser maquetada para una presentación correcta en Internet.

Diseño en proporciones web:

Este es otro punto muy importante, ya que aumentará considerablemente la producción de la maquetación, y mejorará la vista en el navegador haciéndola adecuada para el visitante del sitio.

• Proporciones web:

1. Para generar sitios pensados para monitores de 800x600: el contenido principal del sitio se verá en un área de 760x420.

2. Para monitores de 1024x768: 900 x 600.

Lo que exceda este tamaño no se vera en pantalla desde un primer momento y el usuario deberá realizar scroll para ver el resto del contenido. Esto afecta la forma en que el usuario percibe el sitio. Es importante que pueda visualizarse la mayor cantidad de contenido sin necesidad de hacer scroll.

Los sitios que no responden a estos estándares de diseño para web, deben ser reprocesados y re dibujados en un software de diseño en pixeles, teniendo que escalar los elementos de diseño para adaptarlos a las proporciones correctas. Este trabajo demora mucho tiempo, debiendo realizarse de un cambio importante del diseño original.

Tipografías:

Con cierta frecuencia recibimos bocetos cuyo contenido o cuerpo de texto no poseen tipografías de sistema, de tratarse para un sitio en flash, no habría problema. Pero de tratarse para una maquetación HTML, los cuerpos de textos se deberán pasar a una tipografía de sistema (Arial, Tahoma, Courier, Courier New, Times New Roman, Trebuchet MS).

Los encabezados o títulos principales pueden llevar otras tipografías, pero deberán transformarse en imágenes, afectando el posicionamiento en buscadores.

Uso de Imágenes:

Es necesario tener en cuenta que el aumento en la cantidad de imágenes que requiere un sitio para representar un diseño determinado afecta los tiempos de bajada del sitio. Esto afecta directamente en la forma en que el usuario percibe el sitio web, ya que demorará en visualizar el mismo y lo verá por partes.

Es recomendable para evitar estos problemas utilizar un fondo único para todo el sitio web o limitar la cantidad de fondos que se utilicen.

Así también es recomendable utilizar la mayor cantidad posible de colores planos, que no requieren de imágenes para visualizarse.

En el caso de los menús, barras de botones, o vínculos en serie, es conveniente utilizar un mismo diseño para todos a fin de poder reutilizarlo, y no requerir duplicar información de estilos.

Para aquellos diseñadores que sigan prefiriendo el formato vectorial para diseñar, recomendamos no utilizar efectos propios de cada programa (transparencias, degradados). En caso de necesitarlos, sugerimos que las imágenes sean trabajadas previamente en Photoshop u otro software similar, para luego llevarlas al programa de diseño que se esté utilizando.

Esto se debe a que por cuestiones de estabilidad y pre visualización, cualquier boceto vectorial lo corremos en Adobe Illustrator, el cual nos permitirá corregir de forma manual el moaré no deseado y trabajar las proporciones, para luego llevarlas a otra herramienta de maquetación donde recortar las imágenes para su posterior maquetación.

Estos consejos tienen como fin llevar a la producción de sitios de una forma profesional, soportando los nuevos estándares web, mejorando la bajada de los sitios, la visualización en los ordenadores de los visitantes, la indexación en los buscadores, y la posibilidad de realizar ampliaciones, teniendo estos una codificación legible para cualquier diseñador web que maneje los estándares.

Organización de los archivos:

Al enviar los bocetos es recomendable que cada pantalla o sección esté en un archivo individual, esto mejorará la estabilidad y la velocidad para realizar el trabajo.

Creemos que la mejor manera de realizar sitios es con una buena producción, desde que son diseñados, hasta que son funcionales como sitios en internet.

Dado que la correcta producción de sitios ha respondido favorablemente al publico receptor de tal información, y brindando una imagen profesional ante otras prestadoras de servicios similares al nuestro.