9 Principios para buen diseño Web

Cervera Carranco 4°L
Slide Set by Cervera Carranco 4°L, updated more than 1 year ago
Cervera Carranco 4°L
Created by Cervera Carranco 4°L over 5 years ago
7
0

Description

Slide Set on 9 Principios para buen diseño Web, created by Cervera Carranco 4°L on 03/05/2016.

Resource summary

Slide 1

     se trata de información. Una de las más grandes herramientas en tu arsenal para hacer esto es lapreferencia. 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.
    Preferencia 
    Caption: : http://fedrick.deviantart.com/art/Some-Web-61158902

Slide 2

    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íneasCuando tú presentas un texto, el espacio entre líneas afecta directamente a lo legible que aparece. – RellenoGeneralmente hablando, el texto nunca jamás debería tocar otros elementos. Las Imágenes– Espacio en blancoAntes que nada, el espacio en blanco no es necesariamente de color blanco. El término se refiere al espacio vacío en una página
                                      Espacio
    Caption: : http://sone-pl.deviantart.com/art/FP-website-31885626

Slide 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.Navegación – ¿Hacia dónde puedes ir?Hay algunas reglas con sentido común que hay que recordar. Los botones para navegar en el sitio deberían ser fáciles de encontrar.Orientación – ¿Dónde estas ahora?Hay muchísimas maneras en las que puedes orientar a un usuario, así que no hay excusa para no hacerlo. 
    Caption: : http://tit0.deviantart.com/art/INFINsite-V2-56491417

Slide 4

         Diseña para construir.
    Puedes haber escogido un tipo de letra sorprendente para la copia del cuerpo de tu site, pero ¿Es un tipo de letra estándar en HTML? Quizá tienes un diseño que se ve hermoso, pero su tamaño es de 1100px y como resultado, tendrán que recorrer la página horizontalmente para poder verlo. Es importante saber lo que se puede hacer y lo que no, por lo cual creo que todos los diseñadores web deberían incluso hacer sitios completos, al menos unas cuantas veces.– Para sitios grandes, particularmente, ¿puedes simplificar las cosas?Hubo una vez que solía hacer botones con imágenes para mis sites. Así, si había un botón de download, por ejemplo, lo hacia tipo imagen. En el último año más o menos, he cambiado a usar CSS para hacer mis botones y nunca más como antes. Claro, significa que mis botones no siempre tienen la flexibilidad que me gustaría, pero me ahorra bastante tiempo de creación por que ya no tengo que hacer docenas de pequeños botones. 
    Caption: :

Slide 5

                            Tipografía
    El texto es un elemento común en el diseño, así que no es sorpresa que muchos pensamientos se enfoquen en eso. Es importante considerar cosas como: Opciones de letras Tamaño de letras Espaciado  Anchura de las líneas Color Parrafeando  Esto no es bueno para tu ojo cuando estás leyendo, así que pega el alineamiento hacia la izquierda a menos que tengas un cuerpo de texto mágico que haga el espaciado perfecto.
    Caption: : http://tit0.deviantart.com/art/sport-deluxe-60969702

Slide 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.Esto puede significar que haya tareas comunes en tu homepage (por ejemplo, “empieza a comprar”, o “aprende lo que hacemos”, etc.) o incluso puede significar asegurar algo como tener un cuadro de búsqueda que esté siempre accesible fácilmente. Al final del día, tu diseño Web es una herramienta para que la utilice la gente, y a la gente no le gusta utilizar herramientas molestas!
    Caption: : http://nikeos.deviantart.com/art/evolve-website-V2-67108757

Slide 7

                              Alineación
    Mantener las cosas alineadas es tan importante en el diseño Web como lo es en un diseño de impresión. No quiere decir que todo tiene que estar derecho, 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.Quizá también quieras basar tus diseños en una cuadrícula específica.
    Caption: : http://es.wikihow.com/centrar-un-texto-en-lenguaje-HTML#/Imagen:Center-Text-in-HTML-Step-1Bullet1.jpg

Slide 8

    Claridad
    Mantener nítido tu diseño es súper 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  asegúrate de que el texto está creado usando el comando anti-alistado. 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.
    Caption: : http://previews.123rf.com/images/alexeysmirnov/alexeysmirnov1211/alexeysmirnov121100002/16236695-P-gina-Web-HTML-con-c-digo-fuente-t-tulo-del-documento-descripci-n-de-metadatos-y-enlaces-monitor-de-Foto-de-archivo.jpg

Slide 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.Mantener tu diseño consistente es lo que te hace un profesional. Las inconsistencias en un diseño son como cometer errores ortográficos en un ensayo. Lo único que hacen es bajar la percepción de calidad.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)
Show full summary Hide full summary

Similar

GCSE ICT Revision
Andrea Leyden
GCSE Maths Symbols, Equations & Formulae
Andrea Leyden
AQA GCSE Physics Unit 2.2
Matthew T
Basic Spanish Vocabulary
Alice ExamTime
Characters in "An Inspector Calls"
Esme Gillen
LINEA DEL TIEMPO DE LA EVOLUCION DEL MICROSCOPIO
Joset Brito
Mapa Mental para Resumir y Conectar Ideas
GABRIEL JARRO
CONTABILIDAD
marina salinas
La estadistica, mapa conceptual
Tirso Solano
1.6.3 PROCESO CONTABLE
JENNIFER giselle
Maths Revision- end of year test
Monica Harris