principios basicos del diseño web

1/ Página principal

La página principal debe indicar claramente de qué se trata el sitio. En esta página sitúe el menú de navegación, su logo, y un texto que explique al visitante qué puede encontrar en su sitio web. Su página principal debe ser informativa y debe impulsar a la acción al visitante. La página inicial es el lugar donde el visitante decide qué hará: si pinchar sobre alguno de sus enlaces o abandonar el sitio. Si usted ofrece alguna promoción, descuento o servicio gratuito con el objetivo de hacer contacto con posibles clientes, asegúrese de colocar un enlace a dicho servicio en su página principal.
Si decide insertar una introducción Flash en su página principal, asegúrese de ofrecer al visitante la posibilidad de saltarse la introducción. El enlace “saltar presentación” debe situarse fuera de la celda que contiene el elemento Flash, de otro modo usted estará obligando al visitante a esperar hasta que la película Flash se haya cargado.

2/ Tamaño de la fuente

El tamaño de la fuente tipográfica que use debe ser lo suficientemente grande como para que se lea sin esfuerzo. Hay mucha gente que no se molesta en leer la letra pequeña. No pierda visitantes a causa de un tamaño de fuente incorrecto. Corte el texto en párrafos y hará su lectura más fácil.

3/ Largo de las líneas

El largo de una línea de texto debe permitir una lectura cómoda. La medida óptima para material
impreso parece ser de alrededor de 10 o 12 palabras, lo que equivale a 60 o 70 caracteres. Las líneas
más cortas pueden ser adecuadas para textos muy extensos. Si la línea es demasiado larga, el lector se verá forzado a buscar el principio con la barra de desplazamiento; si es demasiado corta, partirá las palabras o las frases de una manera incómoda.

4/ Crear énfasis

Crear énfasis es un aspecto importante e integral del diseño y la redacción. Manejado con buen gusto y juicio, el texto puede dirigir e informar al lector. Cuando faltan estas cualidades, o si siente que cada palabra es importante y debe ser enfatizada de algún modo, su página web comenzará a parecerse a un campo de batalla y su lectura se tornará muy difícil.

5/ Gráficos

Es bien sabido que una imagen vale por mil palabras. Esta regla también se aplica en Internet. Haga lo mejor posible para mostrar una foto clara y atractiva de su producto. Si ofrece un servicio, encuentre la imagen que mejor lo describa. Tenga cuidado, sin embargo, con el tamaño del archivo. No comprima su foto a tal punto que no se vea claramente, pero tampoco la inserte con su máxima calidad. Ésto hará que el archivo sea demasiado pesado y aumente el tiempo de descarga de la imagen.
GIF vs. JPEG: Los diseñadores web menos experimentados a veces usan el formato erróneo para guardar sus imágenes. Aquí le ofrezco algunos consejos para evitar esos errores. Si su foto tiene pocos colores (menos de 64), GIF será la mejor opción. Además, asegúrese de reducir su paleta de colores.
Quiero decir que si su imagen tiene sólo 10 a 15 colores, reduzca su paleta a 16 o 32 colores.
Del mismo modo, si su imagen contiene texto, el formato GIF es el mejor. JPEG utiliza un método de compresión inexacto, lo que hará que los bordes del texto se vean borrosos.Si tiene una fotografía, guárdela como JPEG. Las imágenes JPEG pueden tener más de 32 millones de colores. Ésto es mucho más de lo que el ojo humano puede captar.
Si quiere incorporar un texto largo a una imagen fotográfica, JPEG será un buen formato. Aunque los bordes tipográficos pueden quedar borrosos, el peligro de que se vuelvan ilegibles es mínimo. Si piensa que su imagen es más importante que el texto, adelante, use el formato JPEG.

6/ Velocidad

Haga lo posible por reducir el tiempo de descarga. Vivimos en un mundo ajetreado y la gente no está dispuesta a esperar mucho tiempo. Trate de reducir el tamaño de sus gráficos tanto como pueda sin destruir la imagen. Los gráficos deben lucir bien, pero el tamaño (en KB) debe ser el mínimo posible.

7/ Haga una prueba antes de publicar

Haga los deberes, y hágalos bien. Sus visitantes no se molestarán en enviarle un e-mail avisándole
que algunos de sus links no funcionan o que algunas de sus imágenes no aparecen. Incluso si alguno lo hiciera, resultaría embarazoso para usted. Revise la ortografía y la gramática. Recuerde que en muchos casos el visitante se formará una opinión de su empresa basada en su sitio web. Cuando lo publique, el sitio no debe contener ningún mensaje del tipo de “en construcción” o “volvemos pronto”.

8/ Accesibilidad

Un sitio web accesible es aquél cuyo contenido puede ser correctamente usado por el mayor número posible de usuarios. Lo más importante para hacer un sitio web accesible es comprender que la gente accede a la Web de modos muy diferentes.
Para un sitio web accesible deberá presentar la información de tal manera que los usuarios puedan acceder a ella independientemente del equipo físico y los programas que estén usando, e independientemente de qué capacidades físicas y sensoriales utilicen para interactuar con el ordenador.
El primer principio del diseño accesible es por tanto crear páginas que se transformen correctamente y cuyo contenido sea correctamente reproducible bajo distintas circunstancias. Hay que crear páginas que sean accesibles a pesar de las deficiencias cognitivas leves, físicas o sensoriales de los usuarios. Hay que considerar también las posibles restricciones debidas al lugar de acceso y las barreras tecnológicas.
Además los elementos gráficos y multimedia correctamente usados contribuyen a mejorar la accesibilidad del sitio web, pues ayudan a conseguir el otro principio importante del diseño accesible: la comprensión del contenido y la navegación fácil por el sitio.

9/ Usabilidad

La usabilidad se refiere a la capacidad de un software de ser comprendido, aprendido, usado y ser atractivo para el usuario, en condiciones específicas de uso. La distinción entre usabilidad – facilidad de uso – y accesibilidad, es difícil y en muchos casos innecesaria. Además, la accesibilidad debe ser entendida como parte de y al mismo tiempo requisito para la usabilidad, puesto que la accesibilidad no sólo implica la necesidad de facilitar acceso, sino también la de facilitar el uso.
La usabilidad parte de los principios del diseño universal o diseño para todos. La buena usabilidad puede lograrse mediante el diseño centrado en el usuario (que no necesariamente dirigido por él), aunque se emplean diversas técnicas.
La usabilidad implica hacerse preguntas como las siguientes, que pueden responderse realizando análisis de usuarios / visitantes y tareas al planificar un proyecto web:

• ¿Quiénes son los usuarios, cuáles sus conocimientos, y qué pueden aprender?
• ¿Qué quieren o necesitan hacer los visitantes?
• ¿Cuál es la formación general de los usuarios?
• ¿Cuál es el contexto en el que el visitante está trabajando?
• ¿Qué debe dejarse a la máquina? ¿Qué al usuario?

Sugerencias:

• No hacer que los usuarios piensen
• No abusar de la paciencia de los usuarios.
• Administrar y centrar la atención de los usuarios.
• Esforzarse para ofrecer una clara exposición de los elementos del sitio.
• Hacer uso eficaz de la escritura (textos).
• Luchar por la simplicidad.
• No tener miedo a los espacios en blanco.
• Comunicarse eficazmente con un “lenguaje visible”.

10/ Composición de página

El éxito de una buena composición de página consiste en una organización balanceada, clara y concisa de la información usando las herramientas básicas de diseño: formato editorial, tipografía, color y uso de gráficas. La composición debe guiar al usuario visualmente. Distinguir en un principio las áreas de información, navegación principal, secundaria, local, etc. El contraste es importante y nos ayuda a mantener módulos de información y a facilitar la lectura. Usar plantillas. Usar una misma plantilla no quiere decir que la página sea aburrida, al contrario utilizar la misma plantilla mantiene una página consistente, limpia y ORDENADA.

11/ Dimensiones

El diseño de Web implica una serie de limitaciones. Dada la naturaleza del medio, nuestras páginas deben de funcionar en diferentes plataformas y con distintas dimensiones de pantalla. Comenzaremos por hablar de las dimensiones de pantalla. Debemos mantenernos al corriente de estadísticas del usuario. Actualmente la mayor parte de usuarios usa una resolución de pantalla de 1024 x 768 y en segundo lugar sigue la resolución de 800×600. Antes de empezar el diseño y la producción de un sitio de Web, debemos definir con nuestro equipo de trabajo que formato seguiremos.

12/ Tablas

El uso de tablas es sumamente importante. No solo sirven para presentar datos de forma tabular, o como las conocemos fuera del contexto de Web, sino porque nos ayudan a crear espacios editoriales.
Usar tablas para crear columnas. Dividir la página en varias columnas facilita la distribución de información, así como mantener separadores de columnas y márgenes.

13/ Tipografía

La selección y uso de tipografía es quizá el elemento más difícil dentro del proceso de diseño. La tipografía asume un doble papel tanto como comunicador visual y como verbal. La tipografía nos ayuda a distinguir visualmente grupos de texto y de esta manera ayuda al usuario a predecir que tipo de información encontrara en ciertas áreas de la página. Lo que hacemos al diseñar páginas Web es básicamente “pintar” el texto, no solo aplicando color al texto sino al combinarlo con otros bloques de texto y con el fondo de la página. El ojo viajara de bloque en bloque a lo largo de la página y es gracias a estos bloques tipográficos que podemos alcanzar una buena jerarquía de información.
Sugerencias:

• Para el cuerpo del texto utilice tipografías diseñadas para pantalla como lo son: Verdana, Georgia o Trebuchet o tipografías que han sido adaptadas para pantalla como Times New Roman.
• No escoja demasiadas fuentes o estilos en una misma página
• En textos largos, evite tipografía clara o muy brillante sobre colores oscuros. Es muy incomodo leer la pantalla bajo estas condiciones.
• Utilice texto convertido a gráficos únicamente para encabezados o botones de navegación, no utilice gráficos para representar párrafos completos de texto.
• Evite alinear el texto al centro o a la derecha cuando se trate de mucho texto o de un párrafo muy amplio. El alineado más recomendable es a la izquierda.

14/ Color

El balance de color puede ayudar a nuestros usuarios a navegar con mayor facilidad por nuestra página al delimitar áreas y al agrupar diferente tipo de información. Cuando se habla de contraste no necesariamente quiere decir que haya contraste entre un claro y un oscuro. Al contrario, el contraste debe de ser muy sutil, muchas veces se logra entre variaciones de un mismo color, hay sitios que son monocromáticos en su totalidad o sitios que usan diferentes porcentajes y variaciones de color en varias secciones, eso es suficiente para facilitar la lectura y layout de la página.

Sugerencias:

• Evitar colores muy vibrantes como fondo de página.
• No usar colores fluorescentes en texto ni en el fondo.
• Utilizar color para distinguir secciones en nuestra página.
• Seleccionar una paleta de color y mantenerse constante o a ella, utilizar variantes de los colores de esa misma paleta (porcentajes por ejemplo) en vez de introducir nuevos colores.
• Utilizar el espacio VACIO, en blanco, como elemento de diseño.