1. DISEÑO DE WEB
la primera web fue publicada en el
año 1991 por Tim Berners-Lee.
A la llegada de la web 2.0 ha supuesto una
revolución en el diseño, se refiere ala concepción
artística como en las interfaces. Desde el punto de
vista visual este nuevo modo de hacer webs ha
supuesto una estandarización .Mientras la web
1.0 los diseñadores realizaban paginas sin base
previo porque existían pocas diferencias.
2. NESESIDADES DE NEGOSIO DE LA
EMPRESA QUE PUEDE CUBRIR.
• Comunicación interna.-los empleados que viajan pueden twitear
desde cualquier lugar a su pagina personal para que en la oficina
puedan saber en todo momento que hace y en donde esta el
empleado.
• Comunicación externa.-la empresa puede recibir en tiempo real lo
que los usuarios piensan de sus productos y servicios.
• Promoción.-es posible utilizar la herramienta para promocionar la
empresa.
ESTILO 2.0 .-la web 2.0 ha supuesto la creación de una serie de clichés
de diseño , 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 2.0 que
debe tener.
3. CARACTERISTICAS
• 1.- Uso de colores vibrantes y contrastados. La web 2.0 se caracteriza por el uso de colores con
mucho contraste.
• 2.-Badges.es una serie de botones en forma de chapas o placas.
• 3.-Brillos destellos y reflejos. Las barras de menú y los demás elementos de las composiciones
cuentan con destello de luz.
• 4.-Bordes redondeados. A la llegada de la web2.0 a supuesto el fin de las esquinas.
• 5.-Degradados.
• 6.-Lineas diagonales.
• 7.-Desenfoques.
• 8.-Logotipos reflejados.
4. CARACTERISTICAS POR BEN HUNT
• 1.-Simplisidad.
• 2.- Diseño centrado.
• 3.-Menos columnas.
• 4.-Separar la navegación.
• 5.-navegacion simple.
• 6.-Tipografias mas grandes.
• 7.-Leads en negrita.
• 8.-Iconos atractivos.
5. FUTURO DEL DISEÑO 2.0
• Todos los movimientos artísticos se
caracterizan porque mucha gente hace lo
mismo , hasta que alguien lo rompe y hace
algo mas innovador .
• Por esta razón la web 2.0 esta generando un
movimiento en contra de estos estándares
6. EVOLUCION TECNOLOGICA y su uso
• 1Navegadores web.- es un programa que se itiliza
para acceder a la web. Desde el primer
explorador , llamado NCSA Mosaic de principio
de los noventa hcy ,la evolución ha sido
espectacular.
• A pesar de que las estadísticas actuales nos dicen
que Ie sigue cambiando ,las corrientes
alternativas van abriéndose paso .Opera abrió el
camino y, hoy en día ,Mozilla FireFox esta
haciendo pupa al dominio de IE con cuotas del
20% en algunos países europeos.
7. Los otros navegadores
• hoy en día existen otras aplicaciones que están ganando
importancia como son los navegadores para móviles y para PDA, los
navegadores de solo texto.
• inicialmente se opto por hacer versiones especificas para cada tipo
de navegador , pero es un costo inasumible ante la gran
proliferación de aplicaciones y dispositivos
• No queda mas remedio que utilizar un estándar común.
• FLASH. Los archivos elaborados en el programa de animación
2Dpor excelencia en el campo web, flash, han pasado de ser la
solución definitiva cuando deseamos hacer una web visualmente
atractiva , a una posesión mas discreta.
• la utilización de este tipo de animaciones ha pasado como
decíamos a una posición secundaria , que es en animaciones en las
cabeceras delas web , en los banners o para ilustrar noticias. Como
un ingrediente mas del diseño , pero no como plato único.
8. • AJAX.-el termino AJAX al igual que el de la web 2.0, no
es ningún invento ,ni u n gran avance tecnológico ,es el
nombre que se le puso a una serie de técnicas y
combinación de tecnologías ya existentes .
• El uso del AJAX ha supuesto una revolución en el
concepto de interacción del usuario con la pagina web.
Ya podemos mover las ventanas a nuestro gusto y
ponerlas en donde nos apetezca ,eliminarlas o añadir
nuevas ventanas con nuestras RSS favoritas en
servicios como Netvives o Igoogle.
9. • EL INTERNAUTA 2.0.-Los usuarios quieren crear el
objetivo ultimo de la web 2.0 .Un internauta que
crea contenidos y que, por lo tanto , no se
encuentra ante una pagina diseñada con mejor o
peor resultado, sin ante una interface. No se trata
de hacer una aplicación amable por fuera y dura
por dentro, sino que es necesario poner a la vista
las entrañas de la web para que nuestro visitante
suba documentos , organice videos o retoque
fotos. cada una de estas entrañas debe estar
diseñadas cumpliendo unos principios
reusabilidad.
10. Interface para un internauta 2.0
• 1. USABILIDAD. Se trata de una disciplina cuyo objetivo
es facilitar la interacción del usuario y, por esta razón,
es lógico que naciera o, mas bien, cobrara fuerza, con
la llegada de la web 2.0 .
• De ahí el nacimiento de una nueva profesión
inexistente hace poco: los expertos en usabilidad,
personas especializadas en la interacción entre los
ordenadores y las personas , y concretamente, entre
los sitios web y los internautas de hoy en día .Para
hacernos idea de cómo funciona , podemos ver los
cinco componentes con los que Jacob Nielsen mide la
usabilidad.
11. • 2. PRINCIPIOS DE LA USABILIDAD.
• 2.1Anticipacion. Es el sitio web debe anticiparse a las necesidades del
usuario.
• 2.2Autonomia. Los usuarios deben tener el control sobre el sitio web.
• 2.3Los colores a utilizarse con precaución. Para no dificultar el acceso a los
usuarios con problemas de distinción de colores.
• 2.4Consistencia. Las aplicaciones deben de ser consistentes con las
expectativas de los usuarios.
• 2.5Eficencia del usuario. Los sitios web se deben centrar en la
productividad del usuario ,no en la del propio sitio web.
• 2.6Rebersabilidad.un sitio web ha de permitir deshacer de las acciones
realizadas.
• 2.7. Ley de fitts. Indica el tiempo para alcanzar un objetivo con el raton
esta en función de la distancia y el tamaño del objetivo.
12. • 2.8Reduccion de tiempo de latencia.
• 9.9Aprendizaje.
• 2.10 El uso adecuado de metáforas.
• 2.11 la protección del trabajo de los usuarios.
• 2.12 Legibilidad.
• 2.13 Seguimiento de las acciones del usuario.
• 2.14 Interfaz visible.
13. USABILIDAD FRENTE AL DISEÑO
• La usabilidad se desarrolla con la parte izquierda del
cerebro y representa la razón y la acción lógica , por lo
tanto se corresponde con marte. Por su parte el diseño
reside en la parte derecha del cerebro y se identifica
con lo emocional y la acción intuitiva, así que se
corresponde con venus.
• El paso del tiempo a demostrado que ninguna web
puede prescindir de la usabilidad , porque el usuario se
frustra y se va si no sabe manejar la interface y , al
mismo tiempo , si algo no es atractivo visualmente
para el internauta es difícil que se desarrolle como
producto: no se diferencia de los demás pareciera
anticuado, nadie recordaría la web etc.
14. ARQUITECTURA DE LA INFORMACION
• Tomando como punto de partida el articulo de rain Baker podemos definir
los siguientes pasos necesarios para una arquitectura de la información
acertada.
• 1. entender el contenido de la web.
• 2. realizar estudios de card Stirling.
• 3. elaborar un borrador del árbol de la web, agrupando la información
estableciendo jerarquías.
• 4. evaluar la correspondencia de nuestro árbol y los resultados del card
sorting.
• 5. crear el mapa del sitio.
• 6. definir las funcionalidades de las pagina y como se llega a ellas.
• 7. contrastar la organización de la información que hemos propuesto con
el resto de miembros del equipo.
• 8. elaborar el wireframe que le pasaremos al departamento de diseño y al
e programación.
15. ESTANDARES
• EL VERDADERO TRIUNFO DE LAS WEB 2.0 HA SIDO EL
TRIUNFO DE LOS ESTANDARES .Web se define como el
conjunto de recomendaciones dados por el Word Wide
web consortium y otras organizaciones internacionales
acerca de como crear e interpretar documentos basados en
el web.
• Son normas que permiten alas webs se puedan visionar no
solo en el internet exploer , si no también en los
navegadores para personas ciegas o dispositivos móviles
como PDA o teléfonos móviles , as como para los
internautas que utilizan velocidades de transparencia baja.
En un papel de guía de los desarrolladores web , law3c
recomienda el uso de dos estándares :CCS Y HTML.
16. CCS
• Son un lenguaje usado para definir la presentación de
un documento estructurado escrito en HTML o XML.
• 1. VENTAJAS:
• Es mas sencillo realizar cambios globales.
• El estilo del site se mantiene en toda su extensión .
• El site es mas accesible.
• Rápida descarga.
• Separación del diseño y la programación.
• Esta optimizado para buscadores.
• El usuario puede utilizar sus propias normas de estilo.
• Una mayor libertad en la maquetación.
17. XHTML
• Es el lenguaje demarcado pensando para sustituir al HTML ,pero
aun le queda camino por recorrer .
• El HTML es una versión mas estricta del código HTML para
conseguir reducir las posibilidades de uso y que la interpretación
por los distintos dispositivos sea mas simple, y que pequeños
positivos , con menor capacidad que los ordenadores de mesa
tradicionales puedan soportar , como los móviles
• VENTAJAS.
• La compatibilidad con navegadores antiguos.
• La independencia del diseño.
• Facilidad de edición del código y su mantenimiento.
• Mejoras de rendimiento.