El documento presenta una perspectiva sobre la evolución de la web, desde la Web 1.0 hasta la Web Semántica, destacando 12 patrones clave que definen su desarrollo, como el diseño centrado en el usuario y la inter-operabilidad de datos. Se discute la misión de la web semántica en agregar valor a la información y cómo la tecnología ha evolucionado en términos de colaboración y experiencia del usuario. En conclusión, se plantea que la web busca ser como una inteligencia artificial que aprende y evoluciona.

1. en la Web Semántica
Santiago Coffey - PyCon 2009 - Buenos Aires

2. WEB

3. WEB

4. Global Internet traffic estimates (TB/month)
9,000,000
7,500,000
6,000,000
4,500,000
3,000,000
1,500,000
0
1990 1992 1994 1996 1998 2000 2002 2004 2006 2008
Source: Cisco Visual Networking Index Forecast. http://www.cisco.com/go/vni

5. LA MUERTE DE LA WEB 2.0

6. QUÉ ES LA
WEB
2.0

7. QUÉ fue LA
ES
WEB
2.0

8. La web 2.0 es la
segunda generación del
desarrollo y diseño web

9. ¿Cuál es la receta para esa nueva forma
de hacer la web?

11. 12 patrones

12. PATTERN #1 
INFORMATION
SHARING

13. 1.0 2.0
FUENTE FUENTE Y SUMIDERO
DE INFORMACIÓN DE INFORMACIÓN

14. WEB SITES
WEB APPLICATIONS
WEB SERVICES
3.0 SEMANTIC WEB
USERS

15. PATTERN #2 
USER-CENTERED
DESIGN

16. WEB 1.0 WEB 2.0
CENTRADO EN RECURSOS CENTRADO EN USUARIOS

18. http email
socket xmlrpc xml
cgi PYTHON 3.0 ssl
BATTERIES INCLUDED
smtpd
hashlib
urllib smtplib json
wsgiref codecs html

19. Babel lxml Paste Beaker
boto NumPy nltk WebHelpers
PIL
PYTHON MODULES
Twisted SWISS ARMY KNIFE PyYAML
FormEncode
SQLAlchemy
BeautifulSoup feedparser
python-memcached pycrypto

20. PATTERN #3 
MODEL-VIEW-
CONTROLLER
ARCHITECTURE

21. HTTP://WWW.E-XAMPLE.COM http://examp.le
BROWSER
 DIRECTORY
 DIRECTORY WEB SERVER
 DIRECTORY
 JPG ROUTE DISPATCHER
 GIF
CONTROLLER
 JS
 HTML
 HTML MODEL VIEW
 HTML
 HTML DATA
BASE
SITIO WEB: REPOSITORIO APLICACIÓN WEB:
DE PÁGINAS ESTÁTICAS MULTI-CAPA, CON ESTADO

22. Python Web Frameworks
• Django • Zope
• Pylons • Plone
• TurboGears • MoinMoin
• Google App • Python Paste
Engine
• CherryPy

23. Alternative DBMS
• memcachedb • Key-value
storage
• HBase + Thrift
• No joins, non-
• flat files (CSV)
transactional
• BerkeleyDB
• Scalable,
• Map Reduce fault-tolerant

24. PATTERN #4 
PARTICIPATION &
COLLABORATION

25. WEB 1.0 WEB 2.0
PUBLICACIÓN INDIVIDUAL EDICIÓN COLABORATIVA

27. PATTERN #5 
SOCIAL
NETWORKING

28. 1.0 2.0
RED DE COMPUTADORAS RED DE AMIGOS

29. IDEA SIMPLE
GRANDES
RESULTADOS

31. PATTERN #6 
SEARCH &
RECOMMENDATION
ENGINES

32. WEB 1.0: NAVEGAR TODO PARA DESCUBRIR
WEB 2.0: TEORÍA DEL ICEBERG
(SÓLO SE VE EL 10%)

34. ¿Qué hace una web semántica?
• Integración (aggregation)
• Definición de ontologías
• Análisis semántico
• Agregado de valor (filtrado,
asociación, recomendación, etc.)

35. ¿Cuál es la misión
de la web semántica?

36. ¿De qué habla (cuál es el significado)
el contenido de un determinado
documento HTML?
¿Cuál es el contenido
relevante de un determinado
documento HTML?
¿En qué idioma está un
texto determinado?

37. ¿Qué palabras son equivalentes
entre sí? (stemming)
¿Se pueden inferir tags
automáticamente a partir
de un texto?
¿Cómo se pueden eliminar palabras
comunes como artículos y
preposiciones (stop words)?

38. ¿Cuál es la estructura sintáctica
de una oración o proposición?
(part of speech)
¿Cómo se puede eliminar la
ambigüedad entre los distintos
significados de una misma palabra?
¿Es posible agregar
información del contexto
eficientemente?

39. ¿Cómo se puede mejorar la relación
señal-ruido (signal to noise ratio) de la
información que consume un usuario?
¿Cómo se pueden identificar
digramas en un texto?
¿Cuántas y cuáles son las categorías
apropiadas para clasificar contenidos
en una determinada ontología?

42. PATTERN #7 
FOLKSONOMY

43. WEB 1.0 WEB 2.0
TAXONOMY FOLKSONOMY
(HIERARCHICAL CLASSIFICATION) (COLLABORATIVE TAGGING)

45. PATTERN #8 
COMMUNITY &
COLLECTIVE
INTELLIGENCE

46. WEB 1.0 WEB 2.0
CONSTRUIR PORTALES CONSTRUIR COMUNIDADES

48. PATTERN #9 
INTER-OPERABILITY &
DATA PORTABILITY

49. RSS
Atom
{json}
Widgets
JSON
<xml/>
RDF
 XML-RPC
WEB CRAWLERS / SPIDERS / BOTS WEB SYNDICATION, WIDGETS,
(HTML SCRAPING) OPEN APIs, AGGREGATION

51. Ejemplo: Atom feed
from feedparser import parse
url = 'http://blog.ianbicking.org/'
'feed/atom/'
feed = parse(url)
titles = [i['title'] for i in
feed['entries']]
print 'n'.join(titles)

52. Ejemplo: Twitter API
from urllib2 import urlopen
from simplejson import loads
url = 'http://twitter.com/statuses/'
'user_timeline/JohnCLeese.json'
raw_data = urlopen(url).read()
tweets = [i['text'] for i in
loads(raw_data)]
print 'n'.join(tweets)

53. Ejemplo: GData API
from gdata.service.youtube import
YoutubeService
url = 'http://gdata.youtube.com/feeds/'
'api/users/MontyPython/uploads'
client = YouTubeService()
feed = client.GetYouTubeVideoFeed(url)
titles = [i.title.text for i in
feed.entry]
print 'n'.join(titles)

54. Ejemplo: HTML Scraping
from urllib2 import urlopen
from lxml.html import fromstring
url = ...
html = urlopen(url).read()
root = fromstring(html)
• Demo con Microformats en LinkedIn

55. PATTERN #10 
RICH USER
EXPERIENCE

56. CLIENT-SIDE SCRIPTING CON
INTERACCIÓN POR FORMULARIOS
INTERACCIÓN ASINCRÓNICA
(CON RECARGA DE PÁGINA)
(e.g.: AJAX)

57. Web OS?

58. PATTERN #11 
SEPARATION OF
CONTENT AND
PRESENTATION

59. <HTML>
<HEAD>
<TITLE>My Homepage</TITLE>
</HEAD>
 STRUCTURE &
CONTENT
<BODY BGCOLOR="YELLOW"> XHTML
<SCRIPT>window.status="Hello!"</SCRIPT>
+
<TABLE WIDTH="640">
<TR><TD>

<CENTER>
<MARQUEE>Welcome to my homepage!</MARQUEE>
PRESENTATION
<IMG SRC="animation.gif" WIDTH="180"
HEIGHT="31" BORDER="1">
</CENTER>
CSS
+
<P><FONT COLOR="blue">This is a <BR>
<FONT FACE="Arial"><U>fake link</U>!
</FONT></P>
</TD>
<TD ALIGN="RIGHT">
<P>Sign my <A HREF="/cgi-bin/sign"
TARGET="_parent">guestbook</A></P>
<BLINK>Under <B>construction</B>!</BLINK>
 CLIENT-SIDE
SCRIPTING
JS
</TD></TR>
</TABLE>
</BODY>
</HTML>
STRUCTURE & CONTENT
CLUTTERED HTML
≠ PRESENTATION

62. PATTERN #12 
WEB AS A
PLATFORM
(UBIQUITY)

63. 
WEB
TV

YOUR SYSTEM
IS THE
PLATFORM


THE WEB

IS THE
PLATFORM
PROPRIETARY SPECIFICATIONS WEB STANDARDS
PLATFORM DEPENDENCE DEVICE INDEPENDENCE
BROWSER WARS CROSS-PLATFORM DESIGN

64. OMNIPRESENCIA (UBIQUITY)
THE WEB IS WATCHING YOU!

65. • Robot no exactamente
electro-mecánico
• Sensores:
Humanos-Máquinas
• Actuadores:
Humanos-Máquinas
• Entorno: Mundo
• AI: Webapps +
Semantic Web + ...

66. • Procesa datos y
responde a estímulos
• ¿Es autónomo?
• ¿Es consciente?
• Es tolerante a fallas
• Es “inteligente”
• Aprende
• Evoluciona
© John W Liberto

67. Suena ilusorio ¿no?
¿Pero podíamos imaginar hace 20 años
una web como la que hoy conocemos?
Además, ya hay aplicaciones...

69. Resumen: Los 12 patrones
• Information sharing • Folksonomy
• User-centered design • Community & collective
intelligence
• MVC Architecture
• Inter-operability & Data
• Participation & portability
collaboration
• Rich User Experience
• Social networking
• Content ≠ Presentation
• Search & recommendation
engines • Web as a Platform

70. Conclusiones

71. Conclusiones
• Web como AI (como un robot)

72. Conclusiones
• Web como AI (como un robot)
• Misión de la web semántica:
Agregar valor a la información

73. Conclusiones
• Web como AI (como un robot)
• Misión de la web semántica:
Agregar valor a la información
• ¿Tecnología? No, patrones

74. ¡Gracias!
santiago.coffey@popego.com
http://twitter.com/scoffey
http://scoffey.popego.com