Algunas caracteísticas que debe tener el dieñador web y la web 2.0

1. Perfil del nuevo
Diseñador Web

2. Han pasado 17 años desde que en 1991 Tim
Berners-Lee creara la primera página web
basada en hipertexto dando inicio a la era
web.

3. ¿Cuál es el perfil del
nuevo Diseñador Web?
• Autodidacta, inquieto y sumamente inteligente que
busca lo que necesita y lo adopta a sus
necesidades.
• Trata (fervientemente) de mantenerse actualizado
con las nuevas tecnologías.
• El nuevo diseñador web tiene un concepto
• muy claro: todo sitio web debe ser usable y
accesible.
• Prueba, se equivoca, investiga y produce
soluciones.

4. ¿Cuál es el perfil del
nuevo Diseñador Web?
• El buen diseñador web no depende de una u otra
herramienta y podría desarrollar sus primeros bocetos a
mano en cualquier pedazo de papel, es alguien que crea
ideas más que piezas.
• Conoce y aplica los estándares web como HTML y CSS.
• Privilegie el contenido por sobre el añadido.
• La simplicidad por sobre lo sobrecargado.

5. ¿Cuál es el perfil del
nuevo Diseñador Web?
• Se adapta y sabe trabajar en ambientes multidiciplinarios.
• No tiene problemas en leer y comprender algunos lenguajes
de programación.
• Adapta su trabajo y lo enriquece con el uso de algunos CMS.
• Drupal, Joomla, Wordpress.

6. Diseño Sitio Web
Web 2.0

7. Concepto Web
2.0
Máxima interacción entre los usuarios
y desarrollo de redes sociales en donde puedan
Expresarse, Opinar, Buscar y Recibir información de Interés,
Colaborar y Crear conocimiento.
conocimiento

8. ● Concepto Web 2.0 ●
Web 2.0 es una Actitud y no una tecnología.
Que es más
importante:
¿ El contenido o EL USO
el Diseño?

9. Herramientas
Para expresarse/crear y publicar: blog, wiki.
Para publicar y buscar información: YouTube, Flickr, SlideShare, Del.icio.us.
Para acceder a información de interés: RSS, XML, Bloglines, GoogleReader.
Redes sociales: Facebook, MySpace,
Servidores gratuitos: Blogger, WordPress.
La plataforma de trabajo es la propia página web
No es necesario tener instalado un software cliente en el Computador
Herramientas: Gratuitas, Convergentes y Multiplataformas

11. Vídeo introductorio: The Machine is Us/ing Us
Fuente: http://es.youtube.com/watch?v=6gmP4nk0EOE

12. Personaje del año 2006 en la revista Time: Tú

13. ¿Qué es la Web 2.0?
Se pasa de una web fundamentalmente
informativa y creada por expertos a una
web social, donde cualquiera puede
participar fácilmente y manejar todo tipo
de aplicaciones
Se crean aplicaciones Web muy
potentes y sencillas de manejar

14. Webs más utilizadas a nivel mundial
1. Yahoo (Y)‫‏‬ 14. Friendster
2. Google (G)‫‏‬ 15. Fotolog
3. YouTube (G)‫‏‬ 16. Yahoo Japan (Y)‫‏‬
17. Google France (G)‫‏‬
4. Live Search (MS)‫‏‬
18. Baidu (China)‫‏‬
5. MSN (MS)‫‏‬
19. Microsoft (MS)‫‏‬
6. Myspace
20. Ebay
7. Facebook
21. Skyrock
8. Hi5 22. Google Chile (G)‫‏‬
9. Wikipedia 23. Megarotic
10. Orkut (G)‫‏‬ 24. Mail.ru (Rusia)‫‏‬
11. Rapidshare 25. QQ.com (China)‫‏‬
12. Blogger (G)‫‏‬ Web 2.0: 15/25
13. Megaupload
Fuente: http://www.alexa.com

15. Blogs
• Son páginas web muy sencillas que cualquiera puede utilizar
• Se limitan a mostrar noticias de forma secuencial, apareciendo las
más recientes en la parte superior
• Consiguen que cualquiera pueda publicar fácilmente cualquier tipo de
información en Internet, normalmente de forma gratuita
• Se han convertido en una importante fuente de noticias alternativa a
los medios de comunicación tradicionales
• Actualmente hay más de 110 millones de blogs en Internet (según
Technorati)
• Los ejemplos más típicos de webs gratuitas de creación de blogs son
Blogger (que pertenece a Google) y Wordpress (basada en software
libre)

16. Wikis
• Son sitios web que varias personas pueden
• modificar fácilmente
• Cada página puede ser editada y los cambios que cada persona hace
quedan registrados, pudiéndose volver a cualquier versión anterior
• Se pueden añadir enlaces a otras páginas fácilmente, normalmente basta
con poner el título de la nueva página entre dobles corchetes (Ejemplo:
[[Nueva Página]])
• Con los wikis se consiguen 2 cosas fundamentales:
– Crear y modificar páginas web fácilmente
– Permitir la creación de documentos de forma cooperativa entre varias personas
• Los ejemplos más típicos de webs para crear wikis de forma gratuita son
Wikispaces y pbWiki
• El wiki más importante del Mundo es la Wikipedia, una enciclopedia que
cualquiera puede editar con millones de artículos en decenas de lenguajes

17. El mejor wiki: la Wikipedia

18. Compartición de medios
Existen multitud de webs que permiten publicar y compartir
medios de todo tipo sin coste alguno
Con ello se consigue que cualquiera pueda publicar cualquier
tipo de medio en Internet y difundirlo fácilmente
Normalmente, no sólo se puede compartir y buscar medios,
sino que se pueden integrar fácilmente dentro de páginas
web, incluidos blogs y wikis, haciendo que nuestras
publicaciones sean multimedia
Ejemplos
YouTube permite compartir vídeos
Flickr permite compartir fotos
Slideshare permite compartir transparencias
Scribd permite compartir todo tipo de documentos de texto

19. Ejemplo de compartición de medios:
Fotos en Flickr

20. Ejemplo de compartición de medios:
Vídeos en YouTube

21. Compartición de medios:
presentaciones en Slideshare

22. http://www.slideshare.net
Es un servicio gratuito que permite Soporta los formatos: PPT,
compartir presentaciones PPS, ODP, PDF
Permite subir hasta 20Mb Sigue la filosofía de uso de servicios
por archivo como youtube
Cada archivo subido es convertido al Permite que los usuarios
formato Flash de nuestros contenidos,
dejen sus comentarios
Usa un reproductor que permite integrar
la presentación en nuestro blog o página
web

23. Redes sociales
Las redes sociales permiten crear páginas personales donde definimos
nuestros perfiles y compartimos recursos como fotos, vídeos, etc.
Nos permiten también conectar con otras personas a las que definimos
como amigos dentro de nuestro perfil
También permiten crear comunidades de usuarios con intereses comunes
Así, podemos tener una red social de contactos con los que compartir
información y relacionarnos
Los ejemplos más típicos de redes sociales gratuitas son Myspace y
Facebook a nivel general y LinkedIn para contactos profesionales
También podemos construir muy rápidamente nuestra propia red social en
línea en Ning
Existe un software libre avanzado para la creación de redes sociales
totalmente personalizadas, de gran eficacia en el ámbito educativo: Elgg

24. Ejemplo de red social en Facebook

25. Marcadores sociales y etiquetas
Nos permiten almacenar nuestros enlaces favoritos o
marcadores en Internet
Los enlaces son compartidos con el resto de los usuarios y
están clasificados por etiquetas (descripciones cortas)‫‏‬
Nos permiten almacenar gran cantidad de enlaces y luego
recuperarlos fácilmente
Se comparte el conocimiento de cientos de miles de personas
y nos ayuda a descubrir sitios nuevos
Actualmente, el sistema de marcadores sociales más utilizado
profesionalmente es del.icio.us
También existe un sistema de marcadores sociales orientado
totalmente al descubrimiento automático de nuevas webs
basadas en nuestros gustos personales: Stumbleupon

26. Ejemplo de marcadores sociales: del.icio.us

27. delicious http://del.icio.us
Es un servicio social que permite guardar los favoritos de tu
navegador con todas las pautas que da el Web 2.0.
permite almacenar nuestros bookmarks o favoritos en Internet
ofrece un sistema de tags (folksonomy) para ir clasificando
nuestros enlaces
Los enlaces son públicos y la categorización de los mismos se
realiza a través de los tags

28. Subscripción a fuentes RSS
Antes teníamos que visitar periódicamente cada web para ver
si había novedades en la misma
Ahora las novedades de las webs que nos interesan llegan a
nosotros mediante las llamadas fuentes RSS (también existen
otras denominadas Atom, más minoritarias)‫‏‬
Cada Web a la que podemos suscribirnos por RSS viene
señalada normalmente por éste símbolo: También puede
venir indicada con los nombres “RSS” o “XML”
Leemos todas las fuentes RSS de los sitios a los que nos
subscribimos mediante los denominados agregadores RSS
Los agregadores de RSS gratuitos más utilizados son: el
propio navegador web (Internet Explorer 7 o Firefox 2) o
Google Reader y Bloglines (en Web)‫‏‬

29. Ejemplo de fuentes RSS

30. Aplicaciones web avanzadas
Una idea clave de la Web 2.0 es utilizar Internet como plataforma de
desarrollo de aplicaciones avanzadas
Se utilizan tecnologías como Ajax que permiten interfaces de usuario
cómodas y fáciles de usar, parecidas a las aplicaciones de escritorio que
podemos encontrar en Windows
Así, se fomenta el uso del software como servicio ofertado por Internet, no
como producto a instalar en el ordenador
El ejemplo más típico de este tipo de aplicaciones es Google Docs, una
suite ofimática sencilla que puede sustituir al clásico Microsoft Office
Google Docs integra un procesador de textos compatible con Word, una
hoja de cálculo compatible con Excel y una herramienta de presentaciones
capaz de importar desde PowerPoint, aunque son mucho más sencillas
Otra suite de aplicaciones avanzadas de negocios es Zoho, que también
tiene ofimática, además de CRM, Wiki, Web conferencing y muchas otras
aplicaciones

31. Ejemplo de aplicación Web avanzada:
Google Docs

32. Ejemplo de aplicación Web avanzada:
Zoho

33. Otras aplicaciones interesantes: RapidShare

34. Otras aplicaciones interesantes: ebay

35. Otras aplicaciones interesantes: amazon

36. Otras aplicaciones
interesantes: Skype

37. Otras aplicaciones interesantes: InfoJobs

38. Otras aplicaciones interesantes: Vagos.es
38

39. Otras aplicaciones interesantes: WordReference
39

40. Los “grandes éxitos” de la Web 2.0
• Los 3 gigantes:
– Google
• Domina todas las búsquedas mundiales y la publicidad
• Las mejores aplicaciones: Google Maps, Google Reader, Gmail, Google
Docs, iGoogle,…
• Dueña de sitios clave: YouTube, Blogger
– Yahoo!
• Líder de los portales
• Alternativa útil a Google en búsquedas, publicidad, correo,…
• Dueña de sitios clave: del.ico.us, Flickr
– Microsoft
• Monopolio de facto de los sistemas operativos de escritorio, con sus
aplicaciones por defecto: navegador, buscador, página de inicio,…
• Copia y pretende competir con los otros 2 (búsquedas, mapas, earth,…)‫‏‬
• Tiene 3 de las webs más importantes de Internet: Live Search, MSN y
Microsoft

41. Influencia social de la Web 2.0: Política

42. Aplicaciones educativas
Existen herramientas Web 2.0 especialmente utilizadas en el mundo
académico:
Los congresos virtuales
Con la Web 2.0, no hay necesidad de reunirse físicamente para organizar
este tipo de eventos.
Muchas veces, se usa un wiki para organizar el congreso
Las conferencias se dan en línea, con transparencias, vídeo, chat,
votaciones, compartición de aplicaciones, etc. y quedan grabadas
Posteriormente, se sigue el debate en foros
Los e-portfolios o portafolios electrónicos
Son una colección de recursos digitales recopilados por un usuario
normalmente en Web. Pueden incluir texto, ficheros de todo tipo,
multimedia, mensajes de blog y enlaces
Suelen ser de 3 tipos: de trabajo, de muestra o de reflexión.
Se suelen utilizar para la evaluación mediante evidencias de trabajo
Los entornos personales de aprendizaje (PLE)‫‏‬
Complementan a los clásicos LMS como Moodle, Sakai, Blackboard o
WebCT, Hablaremos de ellos más adelante.
42

43. Congreso virtual:
“Corporate Learning: Trends and Innovations”
43
Fuente: http://www.complexive.com/wiki/index.php/Main_Page

44. E-portfolio
44
Fuente: http://www.eportfolio.lagcc.cuny.edu/ePortfolios/Advanced/Sandra.Rios/Spring_2005/index.html