¿Te has preguntado cual fue el primer sitio web del mundo?, ¿Quién lo programó?, ¿Quién lo diseño?. Te presento un acercamiento a la respuesta a través de la evolución del Internet desde 1991 hasta 2014.

1. Tendencias de estilo en el Diseño
Web:
Un acercamiento a través del tiempo.
Por: L.D.G. Víctor Luis Juárez Estrada Especialista en Diseño
Interactivo

2. El origen: 1991
¿Quién comenzó todo ésto?

3. Tim Berners-Lee
Creador de la WorldWideWeb
Fundador de la W3C
El origen: 1991
Fuente: http://www.w3.org/People/Berners-Lee/Longer.html

4. Computador NeXT
Apple Inc.
El origen: 1991
Fuente: http://www.w3.org/People/Berners-Lee/Longer.html

5. La primer página Web del Mundo
El origen: 1991
Fuente: http://www.w3.org/History/19921103-hypertext/hypertext/WWW/TheProject.html

6. 1993
¡Vengan, vengan!
(Encontré algo que les va a gustar)

7. Se difunde la WWW.
1993
Fuente: http://www94.web.cern.ch/WWW94/Welcome.html

8. 1993
El primer navegador.
Fuente: http://home.mcom.com/home/welcome.html

9. 1994-1995
Ésto no va a durar mucho… No sirve para nada.

10. 1994-1995
Yahoo!

11. 1994

12. 1995

13. 1996

14. 1998

15. 2000

16. 2002

17. 2003

18. 2005

19. 2006

20. 2013

21. 1994-1995
¡Está bueno!
Quiero aprender a hacer páginas web.

22. 1994-1995
La primer guía para Webmasters.
Fuente: http://www.netside.net/boba/webmasters.html

23. 1994-1995
Tu Universidad on-line (Hungría).
Fuente: http://epa.oszk.hu/00000/00019/00059/

24. 1994-1995
Diseño Web “avanzado”.
Fuente: http://www.3riversstadium.com/index2.html

25. 1996-1997
¡Hola!
¿Hay alguien más ahí?

26. 1996-1997
Antes…
Fuente: http://www.google.com/about/company/history/

27. 1996-1997
Después…
Fuente: http://www.google.com/about/company/history/

28. 1996-1997
Google!
Fuente: http://www.google.com/about/company/history/

29. 1996-1997
Los grandes mitos on-line.
Fuente: http://www.princeton.edu/~accion/chupa.html

30. 1996-1997
Explotando Photoshop al máximo.
Fuente: http://www.cchaven.com/

31. 1996-1997
Explorando la composición.
Fuente: http://www2.warnerbros.com/spacejam/movie/jam.htm

32. 1996-1997
El auge de los GIF’s animados.
Fuente: http://www.snowcrest.net/kitty/hpages/index.html

33. 1998-1999
Los pioneros
Aquellos que sólo los conocen en su casa y en un Cyber-Café.

34. 1998-1999
Composición y Jerarquía.
Fuente: http://deniro.jvlnet.com/

35. 1998-1999
El PEOR navegador de la Historia.
Fuente: http://toastytech.com/evil/index.html

36. 1998-1999
Los efectos producidos por
computadora comunican la
vanguardia de todo tipo de
tecnología.
La usabilidad y
experiencia del usuario
eran temas aún
impensables.
Fuente: http://www.mipg.upenn.edu/~Vnews/

37. 1998-1999
El uso del color.
Fuente: http://www.randomhouse.com/features/iamjackiechan/

38. 1998-1999
El abuso en los elementos animados y
ausencia de composición y jerarquía.
Fuente: http://members.iinet.net.au/~rayis/pets.htm

39. 1998-1999
RESUMEN:
Al ser un campo emergente y en
constante cambio, los Sitios en Internet
eran creados por especialistas en áreas afines
a la Informática Administrativa o
Ingeniería en Sistemas.
El aprendizaje de los lenguajes de
programación ha sido siempre un campo
áspero para los profesionales del Diseño.
¿Qué hacían entonces los diseñadores?
Dominaban el mundo editorial impreso.

40. 2000-2009
Está divertido…
Hagámoslo útil.

41. 2000-2009
Estética y composición más cuidados.
Fuente: http://1997-2001.state.gov/

42. 2000-2009
Primeros intentos por mejorar la usabilidad y
lectura de los contenidos.
Fuente: http://www.dogmark.net/indexint.html

43. 2000-2009
La creación de encabezados y secciones
defindas ya es un “logro”.
Fuente: http://espn.go.com/wpb/wnba/statistics/index.html

44. 2000-2009
El mismo Portal en la actualidad (2013).
Fuente: http://sports.espn.go.com/sports/womenbb/index

45. 2000-2009
“INTERNET matará a las bibliotecas del mundo.”
Arquitectura de la información
+
Estética
+
Usabilidad
+
HTML+CSS+FLASH
(2005)

49. Composición en Plataforma Flash.

50. Composición en Plataforma Flash.

51. Composición en Plataforma Flash.

52. 2000-2009
Me cuesta trabajo leer en Internet…
Usabilidad
+
Experiencia del Usuario
(2009)

59. 2010-2012
Diseño sobre tendencias de estilo
(Objetivo: Impulsar la industria del Diseño Web)
o
Quiero un efectito padre…
Fuente: http://uxdesign.smashingmagazine.com/2012/03/15/symptoms-of-epidemic-web-design-trends/

60. Puntadas.

61. Bordes Zig-Zag.

62. Cintas con horquilla.

63. Texturas.

64. Tipografía para Internet.

65. Ilustración / Grabados del Siglo XIX

66. Tonos pastel.

67. Composiciones tipográficas en bloque.

68. Logotipos circulares / Lettering.

69. Skewomorphic / Texturas del mundo real.

70. 2012-2013…
Diseño Plano (Flat UI Design)
El aburrimiento sobre las texturas y la falsa realidad virtual.
¿Quien dijo que el mundo NO era plano?

71. Fuente: http://fltdsgn.com/

72. Fuente: http://fltdsgn.com/

73. 2013…
Cualquier estilo
demandado por la forma del dispositivo que lo contenga.
Realización de Sitios Web que respondan a los medios de
comunicación (Diseño Web Responsivo).
El contenido sobresale del diseño.

74. 2013…
FUENTE: http://www.nngroup.com/articles/computer-screens-getting-bigger/

75. 2013…
FUENTE: http://corporateskills.co.uk/?p=627

76. RESUMEN
“La red tiene aproximadamente un millón de millones de
páginas. El cerebro humano tiene alrededor de 100,000 millones
de neuronas”,
escribe Kevin Kelly en su libro de 2010, Lo que quiere la
tecnología (What Technology Wants).
FUENTE: http://mexico.cnn.com/tecnologia/2011/09/13/hay-mas-paginas-de-internet-que-neuronas-en-el-cerebro-
humano

77. RESUMEN
Puedes envejecer tratando de unificar el Diseño Web.

78. Para una mayor referencia de los contenidos, consulta y haz click en:
Archivo Histórico de Sitios en Internet (1993-2010)
Los mejores 50 Sitios del 2009
Los mejores 50 Sitios del 2010
Los mejores Sitios en Flash de todo el tiempo
CSS Design Awards
Flash Websites Awards
Smashig Magazine (Revista especializada en Diseño Web)
Descarga:
Libros complementarios: http://leucorama.mx/descargas/libros.zip
Esta presentación: http://leucorama.mx/descargas/estilo-web.pptx
+REFERENCIAS

79. Tendencias de estilo en el Diseño
Web:
Un acercamiento a través del tiempo.

80. <victor>
Diseñador Web
</victor>
<email>
victor@leucorama.mx,
vicusdg@gmail.com
</email>
<facebook>
Víctor Juárez
</facebook>
<twitter>
@vicusdg
</twitter>
Para una mayor referencia de los contenidos, consulta: http://www.404pagefound.com/