Diseño de Pagina Web
-
Upload
rocmarilu -
Category
Technology
-
view
184 -
download
0
description
Transcript of Diseño de Pagina Web
Es una red social que permite al usuario escribir mensajes con caracteres q se
publican en una pagina web personal . Los mensajes se pueden insertar atreves de la
propia web personal , vía mensajes , mensajes instantáneos de chat . También se puede sincronizar las actualizaciones
con redes sociales como Facebook .
La primera web fue publicada en el año 1991 por Tim Berners-lee.
Trece años después en el año 2004, el descubrimiento de Berners-lee
se reinvento, no porque cambiara de un día para otro, sino como
suele ocurrir en el mundo de internet alguien le puso un nuevo
nombre: web 2.0.
La llegada de la web 2.0 ha supuesto una revolución en el diseño.
Desde el punto de vista visual este nuevo modo de hacer webs a
supuesto una estandarización .
La webs 2.0 ha sido creada por creadores especializados en el diseño
de webs.
DISEÑO DE WEB
La web 2.0 a creado una serie de clichés (películas) de elementos
comunes, que configuran un estilo propio, hasta el punto de que a
la hora de abordar el diseño de una pagina se habla del grado de
aplicación del arquetipo ( modelo original) 2.0 que debe tener.
Aunque existen unas característica concretas, que abordaremos a
continuación, podemos definir el diseño 2.0 como una conjunción de
estilo cuya máxima es la sutileza y la combinación de elementos
dispares.
Grandes masas con volumen utilizando técnicas de 3D.
Estilo 2.0
Uso de colores vibrantes contrastados : se caracteriza por el uso
de colores con mucho contraste. Bargés: se tata de una serie de botones con forma de chapas, consiste
en una estrella con bordes redondeados. Brillos destellos y reflejos: Tanto los logotipos como las barras de
menú y los distintos elementos cuentan con detalles de luz y pequeñas zonas sobreexpuestas.
Bordes Redondeados: La llegada del Web 2.0 ha supuesto el fin de las esquinas dando paso a un nuevo arquetipo, en el que todo los bordes son redondeados.
Degradados: Es una de las técnicas visuales más pronunciados o más sutiles, los gradientes de color son empleados desde los fondos de las páginas.
Características:
Líneas Diagonales: Se emplean en los fondos de las páginas y
en los titulares como motivos decorativos, el contraste siempre
es leve para no dificultar la lectura ni centrar la atención sobre
elementos decorativos.
Desenfoques: Se hacen especialmente patente en las sombras.
En lugar de ser sombras duras, los diseñadores utilizan leves
desenfoques.
Logotipos Reflejados: Se convirtieron prácticamente en un
estándar los logotipos reflejados de forma que según van
separándose el dibujo del reflejo va desenfocándose como si se
tratara de un papel mojado
Simplicidad: Es igualdad de condiciones de solución más sencilla y
que exijan menos esfuerzos a los usuarios.
Diseño Centrado: Debido a que se muestra mejor presentación
mejorando la visualización de los contenidos.
Menos Columnas: Reducir a lo mínimo el uso de las columnas ya que
esto da la impresión de un diario (Periódico)
Separa la Navegación: En un área definida para su navegación o
interacción.
Navegación Simple: Organizar la página con iconos familiares para
y sepa para que sirve cada elemento .
Conceptos para un buen Diseño Web
Las hojas de estilo en cascada (Cascading Style
Sheets, CSS) son un lenguaje usado para definir la
presentación de un documento estructurado
escrito en HTML o XML. Consiste en uno o varios
documentos en los que se escriben las
características que va a tener cada uno de los
elementos de la página: titulares, párrafos,
columnas, enlaces, etc., de modo que afectan o
pueden afectar al conjunto del site.
Hoja de estilo (ccs)
Es más sencillo realizar cambios globales: si queremos realizar un
cambio en el diseño, como puede ser la distancia entre las fotos el
texto, el color de los hipervínculos o el tamaño de los titulares, será
más sencillo hacerlo en las CSS ya que bastará con modificar un
archivo y no página por página.
El estilo del site se mantiene en toda su extensión: salvo que
marquemos lo contrario, todas las páginas tendrán el titular y los
párrafos en el mismo formato, los mismo márgenes entre los
elementos, etc.
El site es más accesible, ya que pueden definirse estilos para cada
tipo de navegador. Pueden crearse distintos formatos para que cada
navegador lo interprete como le señalemos.
Las principales ventajas para usar CCS son
Rápida descarga: en general las páginas son más ligeras, ya que
toda la información de estilo está en los archivos CSS, que
cargamos al acceder al site, y no hay que cargar unos estilos cada
vez que cambiamos de página.
Separación del diseño y la programación. Los dos pueden trabajar
en la web sin interferir uno en el trabajo del otro.
Está optimizado para buscadores: hay menos código en los archivos
y resulta más fácil para el buscador encontrar palabras clave.
El usuario puede usar sus propias normas de estilo: algunos
navegadores de Internet permiten personalizar las CSS de las
páginas, por lo que son ellos quienes eligen cómo visionarlas
Tipografía más Grande: Esto cosiste en usar las
fuentes un poco más grande para ser visualmente
atractivas.
Leads en Negrita: Al usar los Leads, usar de
preferencia de color negro, de tal manera que no
se confundan con los colores del diseño de la
página.
Usar Iconos Atractivos: El uso de los iconos hace
mas interesante la navegación para los usuarios
Un navegador es un programa que se utiliza para
acceder a la web.
A pesar de que las estadísticas actuales nos dicen
que IE sigue caminando, las corrientes alternativas
van abriéndose paso. Opera abrió el camino y, hoy en
día, Mozilla FireFox está haciendo “pupa” al dominio
de IE con cuotas del 20% en algunos países europeos.
NAVEGADORES
Internet Explorer
Firefox
Opera
Safari…
Principales Navegadores
Entender el contenido de la web, determinar los servicios que se ofrecen y a quién
está dirigida la web.
Realizar estudios de card sorting. Se trata de un ejercicio que consiste en utilizar a
usuarios potenciales de nuestra para web para que organicen el contenido a través de
fichas, ordenándolo según sus esquemas mentales. Esto hace que la estructura
resultante se adecúe más a lo que el internauta espera encontrarse.
Elaborar un borrador del árbol de la web, agrupando la información y estableciendo
jerarquías.
Evaluar la correspondencia entre nuestro árbol y los resultados del card sorting.
Crear el mapa del sitio.
Definir las funcionalidades de la página y cómo se llega a ellas.
Contrastar la organización de la información que hemos propuesto con el resto de
miembros del equipo.
ARQUITECTURA DE LA INFORMACIÓN
No está claro de donde provino el estilo 2.0. Nos recuerda elementos
muy dispares: desde la portada del disco Tubular Bells de Mike
Oldfield, hasta los reflejos de las obras de Roy Lichtenstein o las
siluetas contrastadas de Keith Haring. Pero lo que sí está claro que
esta forma de diseñar está traspasando los límites de las pantallas de
ordenador, para convertirse en un referente del diseño digital como
se aprecia, por ejemplo, en los grafismos de televisión.
Toda la imagen corporativa de las cadenas, desde los printers con el
nombre de los presentadores hasta las ráfagas entre programas o los
gráficos explicativos de las noticias, la pantalla va llenándose de
degradados, reflejos y demás. ¿Supondrá la
CONCLUSIONES
Toda la imagen corporativa de las cadenas,
desde los printers con el nombre de los
presentadores hasta las ráfagas entre
programas o los gráficos explicativos de las
noticias, la pantalla va llenándose de
degradados, reflejos y demás.
RECOMENDACIONES
ROCIO MARILU OMERO CHAVEZ