Principios de un diseño web

Principios para un diseño web

 El diseño Web puede ser decepcionante mente difícil, pues involucra lograr un diseño que sea usable a la vez que placentero, entrega información  y crea marcas, es técnicamente sonoro y visiblemente coherente..

1. Preferencia

Una de las más grandes herramientas en tu arsenal para hacer esto es la preferencia. Cuando navega por un buen diseño, el usuario debería ser guiado en la pantalla por el diseñador. Yo llamo a esto preferencia, y se trata de la carga visual que tienen las diferentes partes de tu diseño.

192ef6aa-ed8a-4f32-bf71-5f20bc457242 (image/jpg)

2. Espacio

El espacio hace las cosas más claras. En el diseño Web hay tres aspectos sobre espacio que deberías considerar:– Espacio entre líneas– Relleno– Espacio en blanco

cf3c0254-4f5d-411f-b7e2-8944d5966872 (image/jpg)

3. Navegacion

Una de las experiencias más frustrantes que puedes tener en un Web Site es cuando no sabes en donde estás ni para dónde vas. Quiero pensar que para la mayoría de los diseñadores Web, la navegación es un concepto que hemos pasterizado, pero aun encuentro algunos malos ejemplos por ahí. Hay dos aspectos sobre la navegación que hay que tener en cuenta:Navegación – ¿Hacia dónde puedes ir?Orientación – ¿Dónde estas ahora?

b48b9303-9265-45b1-a762-74e95d2a4bee (image/jpg)

4. Diseña para construir

La vida se ha vuelto más fácil desde que los diseñadores Web hicieron la transición a plantillas (layouts) CSS, pero incluso ahora es importante pensar acerca de cómo vas a construir tu sitio si aun estás en PhotoShop. Y tal vez te preguntes esto:– ¿De veras puede hacerse?–¿Es un tipo de letra estándar en HTML?– ¿Qué pasa cuando una pantalla cambia de tamaño?– ¿Algo de lo que estás haciendo es técnicamente difícil?– ¿Podrían algunos pequeños cambios en tu diseño simplificar enormemente cómo lo construiste?– Para sitios grandes, particularmente, ¿puedes simplificar las cosas?

be99c39e-3218-471d-a35c-1af611da8ab5 (image/png)

5. Tipografia

El texto es un elemento común en el diseño, así que no es sorpresa que muchos pensamientos se enfoquen en eso.Y es importante: – Opciones de letras  – Los diferentes tipos de letras dicen cosas diferentes sobre un  diseño. – Tamaño de letras. – Espaciado. – Anchura de las líneas. – Color. – Parrafeando .

40941c73-b29a-4f38-9b85-530f25c4b4e6 (image/jpg)

6. Usabilidad

El diseño Web no solo se trata de fotos bonitas. Con la tanta información e interacción que hay que efectuar en un web Site, es importante que tú, el diseñador, lo proveas para todo. Eso significa que hagas tu web Site utilizable.– Apegándose a los estándares.– Piensa sobre lo que los usuarios van a hacer.– Piensa en las tareas del usuario.

78cdcb13-f511-48aa-afff-d471f7993a7e (image/png)

7. Alineacion

Mantener las cosas alineadas es tan importante en el diseño Web como lo es en un diseño de impresión.sino que debes tratar de mantener las cosas bien colocadas en una página. La alineación hace tu diseño más ordenado y digerible, al igual que lo hace ver más pulido.

ff58c2b4-89a8-4c51-8fc2-9120c5389dff (image/jpg)

8. Claridad

Mantener nítido tu diseño es super importante en el diseño Web. Y en cuanto a la claridad, se trata de los pixeles.En tu CSS todo va a ser perfecto en cuanto los pixeles, así que no hay nada de que preocuparse, pero en PhotoShop no es así. Para lograr la nitidez tienes que:– mantén las formas de los límites pegados a los pixeles. Esto podrá incluir limpiar los límites manualmente, las líneas y los cuadros de texto si las estás creando en PhotoShop.– asegúrate de que el texto está creado usando el comando anti-alistado. Seguido usa “Nitidez”.– asegurarse que el contraste es alto para que los bordes estén claramente definidos.– sobre-enfatiza los bordes solo un poco para exagerar el contraste.

79c5c47a-aff9-4ec3-b10b-5c90d7e3df68 (image/png)

9. Consistencia

Consistencia significa hacer que todo combine. Tamaño de encabezados, tipos de letra escogidas, colores, estilos de botones, espaciado, elementos de diseño, estilos de ilustraciones, fotos escogidas, etc. Todo deberá basarse en un tema en específico. Para hacer tu diseño coherente entre páginas y en la misma página.La manera más simple de mantener la consistencia es hacer decisiones tempranas y pegarte a ellas. Tener un buen set de CSS también puede ayudar a hacer un diseño consistente. Trata de definir etiquetas básicas como <h1> (header 1) y(paragraph) de una manera para hacer que las predeterminadas encajen perfectamente y te evites el estar tratando de recordar nombres de clases específicas todo el tiempo.

0e970920-7628-406f-9421-7b0727f3212f (image/jpg)