SlideShare ist ein Scribd-Unternehmen logo
1 von 24
Downloaden Sie, um offline zu lesen
Presentación1
La primera web fue publicada en el año 1991
por Tim Berners-Lee. El padre de la World
Wide Web elaboró un documento informático
que rompía con lo anterior porque contenía
hipervínculos, es decir, ofrecía posibilidad de
ir a otro texto al pulsar sobre una palabra.
Trece años después, en el año 2004, el
descubrimiento de Berners-Lee se reinventó,
y no porque cambiara de un día para otro,
sino porque, como suele ocurrir en el mundo
de Internet, alguien le puso un nuevo
nombre: Web 2.0
El usuario adquiere un nuevo
papel dentro del soporte, ya
que     deja    de    ser    un
“escaneador” de contenidos
para ser el que elige, el que
participa e incluso el que crea
esos contenidos.
La Web 2.0 ha supuesto el
nacimiento de los estilos.
La Web 2.0 ha supuesto la creación de una serie de clichés
de diseño, de elementos comunes, que configuran un estilo
propio.
    Aunque existen unas características concretas, podemos
   definir el diseño 2.0 como una conjunción de estilos cuya
        máxima es la sutileza y la combinación de elementos
                                                   dispares.
Uso de colores vibrantes y contrastados

                Badges

      Brillos, destellos y reflejos

         Bordes redondeados

             Degradados

          Líneas diagonales

             Desenfoques
Logotipos reflejados
Todos los movimientos artísticos se
caracterizan porque mucha gente hace
lo mismo, hasta que alguien lo rompe y
crea algo más innovador. Por esta
razón la Web 2.0 está generando un
movimiento en contra de estos
estándares.
Apuestan por utilizar las tendencias
actuales estéticas como base para los
nuevos cánones web, creando sites en
los que no aparezca ninguno de los
clichés.
Navegador Wed:
Es un programa que se utiliza para
acceder a la web. Desde el primer
explorador, llamado NCSA Mosaic
de principio de los noventa hasta
hoy.
Netscape consiguió ser el navegador de referencia desde el
1994 hasta que, en el año 1997, Microsoft introdujo el
Internet Explorer en el Sistema Operativo Windows 98.
A pesar de que las
estadísticas actuales nos
dicen que IE sigue
caminando, las corrientes
alternativas          van
abriéndose paso. Hoy en
día, Mozilla Fire Fox está
haciendo     “pupa”     al
dominio de IE con cuotas
del 20% en algunos países
europeos.
Otros Navegadores:
 Existen otras aplicaciones
 que      están    ganando
 importancia como son los
 navegadores para móviles
 y    para      PDA,    los
 navegadores     de    sólo
 texto….
Lo más importante es que cada navegador interpreta a su
modo el código HTML, por lo que los desarrolladores web
se ven obligados a que sus páginas puedan ser consultadas
por distintos medios.
Los archivos elaborados con el programa de animación 2D
por excelencia en el campo web, Flash, han pasado de ser la
solución definitiva cuando deseamos hacer una web
visualmente atractiva, a una posición mucho más 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 de las webs, en los
                         banners o para ilustrar noticias.
                         Como un ingrediente más del
                         diseño, pero no como plato único.
Es el nombre que se le puso
a una serie de técnicas y
combinación de tecnologías
ya existentes.

El uso de Ajax ha supuesto una revolución en el concepto
de interacción del usuario con la página web. Ya podemos
mover las ventanas a nuestro gusto y ponerlas en donde nos
apetezca, eliminarlas de la vista o añadir nuevas ventanas
con nuestras RSS favoritas en servicios como Netvives o
Igoogle.
Como en el famoso caso del
                        huevo y la gallina, no está claro
                        quién nació antes, pero parece
                        evidente que con el surgimiento
                        de las aplicaciones 2.0 los
                        usuarios comenzaron a exigirlas.
Atrás queda aquella web 1.0 donde los internautas eran
meros espectadores que perdían más tiempo buscando que
utilizando los sites y que simplemente leían texto con
hipervínculos.
Los usuarios son más exigentes

Los usuarios saben dónde está o
   debería estar cada botón

Los usuarios no quieren diseñar

Los usuarios quieren participar

  Los usuarios quieren crear
Usabilidad:
El considerado gran gurú de la
Usabilidad, Jacob Nielsen, la
definió así en el año 2003: “El
atributo de calidad que mide
lo fáciles que son de usar las
interfaces Web”              El considerado gran gurú de la
                             Usabilidad, Jacob Nielsen, la
     Aprendizaje             definió    así    en     el    año
       Eficacia              2003: “El atributo de calidad que
    Memorización             mide lo fáciles que son de usar las
                             interfaces Web”
Principios de la Usabilidad
                                 Anticipación
                                 Autonomía
                                 Los colores han de
                                   utilizarse con precaución
                                 Consistencia
   Eficiencia del usuario
   Reversibilidad           - Aprendizaje
                             - El uso adecuado de metáforas
   Ley de Fitts
                             - Legibilidad
   Reducción del tiempo     - Interfaz visible
    de latencia
Usabilidad frente al diseño:
se desarrolla con la parte
izquierda del cerebro y
representa la razón y la acción
lógica; por lo tanto se            El diseño necesita que la
corresponde con Marte. Por         Usabilidad le diga cómo
su parte, el Diseño reside en la   navega el usuario, y la
parte derecha del cerebro y se     Usabilidad necesita que el
identifica con lo emocional y      diseño le ayude a organizar,
la acción intuitiva, así que se    y en conjunto, a mejorar el
corresponde con Venus.             producto.
Arquitectura de la información:
                           Entender el contenido de la
                            web
                           Realizar estudios de card
                            sorting
                           Elaborar un borrador del árbol
                            de la web
 Evaluar la correspondencia     -Crear el mapa del sitio
  entre nuestro árbol y los      -Definir las funcionalidades
  resultados del card sorting.   de la página.
Son las normas que permiten que las
webs se puedan visionar no sólo en
Internet Explorer o Mozilla Firefox,
sino 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 transferencia
baja.
Derivado de los estándares nació el concepto de accesibilidad,
orientado precisamente a integrar en la web a las personas
con minusvalías mentales o físicas.
CCS:
                          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.
-Es más sencillo realizar cambios globales.
-El estilo del site se mantiene en toda su extensión.
-El site es más accesible.
-Rápida descarga
-Separación del diseño y la programación.
-Está optimizado para buscadores.
-El usuario puede usar sus propias normas de estilo.
-Una mayor libertad en la maquetación.
XHTML:
Es el lenguaje de marcado pensado
para sustituir al HTML, pero aún le
queda camino por recorrer. Cuando se
daba por muerto el HTML 4.0 surge
una nueva revisión del W3C el HTML
5.0 lo que hace que seguramente
convivan durante un largo periodo de
tiempo ambos.
Es una versión más estricta del código HTML para conseguir
reducir las posibilidades de su uso y que la interpretación por
los distintos dispositivos sea más simple
Principales ventajas:
 La compatibilidad con navegadores antiguos
 La independencia del diseño. Pudiendo adoptar
   presentaciones distintas según el dispositivo.
 Facilidad de edición del código y su mantenimiento
 Mejoras de rendimiento.
Podemos resumir todo lo
expuesto hasta ahora en que el
diseño Web 2.0 pronto estará
pasado de moda. Cuando las
normas de un estilo están tan
claras, es porque el siguiente
paso será su redefinición. El
diseño supone en gran medida
romper los cánones, así que
debemos estar preparados para
la llegada de la próxima
tendencia.

Weitere ähnliche Inhalte

Was ist angesagt? (16)

Diseño web
Diseño webDiseño web
Diseño web
 
Web 2
Web 2 Web 2
Web 2
 
Web de diseño
Web de diseñoWeb de diseño
Web de diseño
 
W ebb pdf
W ebb pdfW ebb pdf
W ebb pdf
 
Wed
WedWed
Wed
 
Presentación1
Presentación1Presentación1
Presentación1
 
Diseñowebs
DiseñowebsDiseñowebs
Diseñowebs
 
Diseño web
Diseño webDiseño web
Diseño web
 
Web 2.0
Web 2.0Web 2.0
Web 2.0
 
Web 2.0 vs Web 1.0
Web 2.0 vs Web 1.0Web 2.0 vs Web 1.0
Web 2.0 vs Web 1.0
 
Diseño web semana 3
Diseño web semana 3Diseño web semana 3
Diseño web semana 3
 
La web (1)
La web (1)La web (1)
La web (1)
 
web 2.0 y algunos presentadores online
web 2.0 y algunos presentadores onlineweb 2.0 y algunos presentadores online
web 2.0 y algunos presentadores online
 
presentaciones online
presentaciones onlinepresentaciones online
presentaciones online
 
PRESENTACIONES ONLINE
PRESENTACIONES ONLINEPRESENTACIONES ONLINE
PRESENTACIONES ONLINE
 
La web 2
La web 2La web 2
La web 2
 

Ähnlich wie Presentación1 (20)

Lidia
LidiaLidia
Lidia
 
Lidia
LidiaLidia
Lidia
 
Diseño de web.03
Diseño de web.03Diseño de web.03
Diseño de web.03
 
Alberto
AlbertoAlberto
Alberto
 
Alberto
AlbertoAlberto
Alberto
 
Diseño web
Diseño webDiseño web
Diseño web
 
Lyseth (1)
Lyseth (1)Lyseth (1)
Lyseth (1)
 
Web 2
Web 2Web 2
Web 2
 
Diseño web
Diseño webDiseño web
Diseño web
 
Diseñowebs
DiseñowebsDiseñowebs
Diseñowebs
 
Diseñowebs
DiseñowebsDiseñowebs
Diseñowebs
 
Presentacion dante 01 semana 3 tic
Presentacion dante 01 semana 3 ticPresentacion dante 01 semana 3 tic
Presentacion dante 01 semana 3 tic
 
Presentacion dante 01 semana 3 tic
Presentacion dante 01 semana 3 ticPresentacion dante 01 semana 3 tic
Presentacion dante 01 semana 3 tic
 
Diseño web
Diseño webDiseño web
Diseño web
 
LA EVOLUCION DE LA WEB
LA  EVOLUCION DE LA WEBLA  EVOLUCION DE LA WEB
LA EVOLUCION DE LA WEB
 
Hist. diseño web
Hist. diseño webHist. diseño web
Hist. diseño web
 
Que Es La Web1.0 Y 2.0
Que Es La Web1.0 Y 2.0Que Es La Web1.0 Y 2.0
Que Es La Web1.0 Y 2.0
 
Design web2.0 hersic
Design web2.0 hersicDesign web2.0 hersic
Design web2.0 hersic
 
Web
WebWeb
Web
 
Web 1.0 2.0 3.0 4.0
Web 1.0 2.0 3.0 4.0Web 1.0 2.0 3.0 4.0
Web 1.0 2.0 3.0 4.0
 

Presentación1

  • 2. La primera web fue publicada en el año 1991 por Tim Berners-Lee. El padre de la World Wide Web elaboró un documento informático que rompía con lo anterior porque contenía hipervínculos, es decir, ofrecía posibilidad de ir a otro texto al pulsar sobre una palabra. Trece años después, en el año 2004, el descubrimiento de Berners-Lee se reinventó, y no porque cambiara de un día para otro, sino porque, como suele ocurrir en el mundo de Internet, alguien le puso un nuevo nombre: Web 2.0
  • 3. El usuario adquiere un nuevo papel dentro del soporte, ya que deja de ser un “escaneador” de contenidos para ser el que elige, el que participa e incluso el que crea esos contenidos. La Web 2.0 ha supuesto el nacimiento de los estilos.
  • 4. La Web 2.0 ha supuesto la creación de una serie de clichés de diseño, de elementos comunes, que configuran un estilo propio. Aunque existen unas características concretas, podemos definir el diseño 2.0 como una conjunción de estilos cuya máxima es la sutileza y la combinación de elementos dispares.
  • 5. Uso de colores vibrantes y contrastados Badges Brillos, destellos y reflejos Bordes redondeados Degradados Líneas diagonales Desenfoques
  • 7. Todos los movimientos artísticos se caracterizan porque mucha gente hace lo mismo, hasta que alguien lo rompe y crea algo más innovador. Por esta razón la Web 2.0 está generando un movimiento en contra de estos estándares. Apuestan por utilizar las tendencias actuales estéticas como base para los nuevos cánones web, creando sites en los que no aparezca ninguno de los clichés.
  • 8. Navegador Wed: Es un programa que se utiliza para acceder a la web. Desde el primer explorador, llamado NCSA Mosaic de principio de los noventa hasta hoy. Netscape consiguió ser el navegador de referencia desde el 1994 hasta que, en el año 1997, Microsoft introdujo el Internet Explorer en el Sistema Operativo Windows 98.
  • 9. A pesar de que las estadísticas actuales nos dicen que IE sigue caminando, las corrientes alternativas van abriéndose paso. Hoy en día, Mozilla Fire Fox está haciendo “pupa” al dominio de IE con cuotas del 20% en algunos países europeos.
  • 10. Otros Navegadores: Existen otras aplicaciones que están ganando importancia como son los navegadores para móviles y para PDA, los navegadores de sólo texto…. Lo más importante es que cada navegador interpreta a su modo el código HTML, por lo que los desarrolladores web se ven obligados a que sus páginas puedan ser consultadas por distintos medios.
  • 11. Los archivos elaborados con el programa de animación 2D por excelencia en el campo web, Flash, han pasado de ser la solución definitiva cuando deseamos hacer una web visualmente atractiva, a una posición mucho más 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 de las webs, en los banners o para ilustrar noticias. Como un ingrediente más del diseño, pero no como plato único.
  • 12. Es el nombre que se le puso a una serie de técnicas y combinación de tecnologías ya existentes. El uso de Ajax ha supuesto una revolución en el concepto de interacción del usuario con la página web. Ya podemos mover las ventanas a nuestro gusto y ponerlas en donde nos apetezca, eliminarlas de la vista o añadir nuevas ventanas con nuestras RSS favoritas en servicios como Netvives o Igoogle.
  • 13. Como en el famoso caso del huevo y la gallina, no está claro quién nació antes, pero parece evidente que con el surgimiento de las aplicaciones 2.0 los usuarios comenzaron a exigirlas. Atrás queda aquella web 1.0 donde los internautas eran meros espectadores que perdían más tiempo buscando que utilizando los sites y que simplemente leían texto con hipervínculos.
  • 14. Los usuarios son más exigentes Los usuarios saben dónde está o debería estar cada botón Los usuarios no quieren diseñar Los usuarios quieren participar Los usuarios quieren crear
  • 15. Usabilidad: El considerado gran gurú de la Usabilidad, Jacob Nielsen, la definió así en el año 2003: “El atributo de calidad que mide lo fáciles que son de usar las interfaces Web” El considerado gran gurú de la Usabilidad, Jacob Nielsen, la Aprendizaje definió así en el año Eficacia 2003: “El atributo de calidad que Memorización mide lo fáciles que son de usar las interfaces Web”
  • 16. Principios de la Usabilidad  Anticipación  Autonomía  Los colores han de utilizarse con precaución  Consistencia  Eficiencia del usuario  Reversibilidad - Aprendizaje - El uso adecuado de metáforas  Ley de Fitts - Legibilidad  Reducción del tiempo - Interfaz visible de latencia
  • 17. Usabilidad frente al diseño: se desarrolla con la parte izquierda del cerebro y representa la razón y la acción lógica; por lo tanto se El diseño necesita que la corresponde con Marte. Por Usabilidad le diga cómo su parte, el Diseño reside en la navega el usuario, y la parte derecha del cerebro y se Usabilidad necesita que el identifica con lo emocional y diseño le ayude a organizar, la acción intuitiva, así que se y en conjunto, a mejorar el corresponde con Venus. producto.
  • 18. Arquitectura de la información:  Entender el contenido de la web  Realizar estudios de card sorting  Elaborar un borrador del árbol de la web  Evaluar la correspondencia -Crear el mapa del sitio entre nuestro árbol y los -Definir las funcionalidades resultados del card sorting. de la página.
  • 19. Son las normas que permiten que las webs se puedan visionar no sólo en Internet Explorer o Mozilla Firefox, sino 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 transferencia baja. Derivado de los estándares nació el concepto de accesibilidad, orientado precisamente a integrar en la web a las personas con minusvalías mentales o físicas.
  • 20. CCS: 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. -Es más sencillo realizar cambios globales. -El estilo del site se mantiene en toda su extensión. -El site es más accesible. -Rápida descarga
  • 21. -Separación del diseño y la programación. -Está optimizado para buscadores. -El usuario puede usar sus propias normas de estilo. -Una mayor libertad en la maquetación.
  • 22. XHTML: Es el lenguaje de marcado pensado para sustituir al HTML, pero aún le queda camino por recorrer. Cuando se daba por muerto el HTML 4.0 surge una nueva revisión del W3C el HTML 5.0 lo que hace que seguramente convivan durante un largo periodo de tiempo ambos. Es una versión más estricta del código HTML para conseguir reducir las posibilidades de su uso y que la interpretación por los distintos dispositivos sea más simple
  • 23. Principales ventajas:  La compatibilidad con navegadores antiguos  La independencia del diseño. Pudiendo adoptar presentaciones distintas según el dispositivo.  Facilidad de edición del código y su mantenimiento  Mejoras de rendimiento.
  • 24. Podemos resumir todo lo expuesto hasta ahora en que el diseño Web 2.0 pronto estará pasado de moda. Cuando las normas de un estilo están tan claras, es porque el siguiente paso será su redefinición. El diseño supone en gran medida romper los cánones, así que debemos estar preparados para la llegada de la próxima tendencia.