HTML/HTTP e a Web
-
Upload
willian-watanabe -
Category
Documents
-
view
150 -
download
0
Transcript of HTML/HTTP e a Web
HTML/HTTPe a Web
Willian Massami Watanabe
1
Objetivo
Analisar a evolução das tecnologias web
2
Sumário
• HTML e HTTP
• Web 2.0
• HTML5
• Impactos na Engenharia Web
3
HTML e HTTP
4
HTML e HTTP
5
HTML e HTTP
5
HTML e HTTP
5
HTML e HTTP
5
HTML e HTTP
5
HTML e HTTP
5
HTML e HTTP
6
HTML e HTTP
7
HTML e HTTP
WWW
8
HTML e HTTP
WWW
Como isso começou?
9
WWW
HTML e HTTP
10
HTML e HTTP
WWW
Tim Berners Lee
11
HTML e HTTP
Tim Berners Lee
1989 Hoje
HTML
HTTP
Browser
12
HTML e HTTP1989 Hoje
1945: Memory Extension
1960s: Hypertext1974: Internet
13
HTML e HTTP1989 Hoje
1945: Memory Extension
1960s: Hypertext1974: Internet
MemexVannevar Bush
14
HTML e HTTP1989 Hoje
1945: Memory Extension
1960s: Hypertext1974: Internet
Hypertext
15
HTML e HTTP
Tim Berners Lee
1989 Hoje
HTML
HTTP
Browser
16
HTML e HTTP
Tim Berners Lee
1989 Hoje
HTML
HTTP
Browser
Hipertexto
17
HTML e HTTP
HTML
HyperText Markup Language: para organizar o conhecimento
Tim Berners Lee18
HTML e HTTP1989 Hoje
1945: Memory Extension
1960s: Hypertext1974: Internet
Internet
19
HTML e HTTP
Internet
20
HTML e HTTP
Internet
AplicaçãoApresentação
SessãoTransporte
RedeEnlaceFísico
21
HTML e HTTP
Internet
AplicaçãoApresentação
SessãoTransporte
RedeEnlaceFísico
HTTP
22
HTML e HTTP
Tim Berners Lee
1989 Hoje
HTML
HTTP
Browser
Protocolo
23
HTML e HTTP
Tim Berners Lee
1989 Hoje
HTML
HTTP
Browser Interface
24
HTML
HTTP
Browser
25
HTML e HTTP1989 Hoje
HTML
HTTP
Browser
WWW
26
HTML e HTTP
Tim Berners Lee
Por quê?
27
HTML e HTTP
Tim Berners Lee
Frustration
28
HTML e HTTP
Tim Berners Lee
Frustration
Documentos
29
HTML e HTTP
Tim Berners Lee
Frustration
Documentos
30
HTML e HTTP
Tim Berners Lee
Frustration
Documentos
31
HTML e HTTP
Tim Berners Lee
Frustration
Documentos
!= !=
32
HTML e HTTP
Tim Berners Lee
Hipertexto não foi a inovação
33
HTML
HTTP
Browser
34
HTML
HTTP
Browser
Documentos Distribuídos
34
HTML e HTTP
Interoperabilidade
35
HTML e HTTP1989 Hoje
HTML
HTTP
Browser
36
HTML e HTTP1989 Hoje
HTML
HTTP
Browser
HTML
Hoje
JavaScript CSS
37
HTML e HTTP1989 Hoje
HTML
HTTP
Browser
Hoje
HTML
38
HTML e HTTP1989 Hoje
HTML
HTTP
Browser
Hoje
39
HTML e HTTP1989 Hoje
HTML
HTTP
Browser
40
Web 2.0
41
Web 2.0
Web como plataforma
Web humana
42
Web 2.0
Web humana
43
Web 2.0
Web humana
HTMLAutor de conteúdo
Usuários
44
Web 2.0
Web humana
HTML Usuários
Usuário participando da autoria de conteúdo
Redes sociais como Orkut, Twitter, ...45
Web 2.0
Web humana
HTML Usuários
Usabilidade
46
• Melhorar a experiência do usuário
• Satisfação• Eficiência• Eficácia
Web 2.0Usabilidade
47
Web 2.0Usabilidade
Ajax
Estilo arquitetural composto por diferentes idéias e tenologias associadas (Mahemoff, 2006)
Emprego de tecnologias abertas com base em padrões arquiteturais da Internet e da Web
(Garrett, 2005)(Fraternali et al., 2010)48
Web 2.0
Ajax
49
Web 2.0
JavaScript e DHTML
50
Web 2.0
AjaxJavaScript
HTML Events
DOM HTMLDHTML
CSS
HTML
51
Web 2.0
JavaScript
Formatos de comunicação de dados
52
Web 2.0
AjaxJavaScript
HTML Events
DOM HTMLDHTML
CSS
HTMLXML
SVG
JSON
53
Web 2.0
JavaScript
Formatos de comunicação de dados
Protocolo de comunicação HTTP
54
Web 2.0
AjaxJavaScript
HTML Events
DOM HTMLDHTML
CSS
HTMLXML
SVG
JSON
JAVA.netPHP Python
RUBY
55
Web 2.0
Ajax
56
Web 2.0
Web como plataforma
Web humana
57
Web 2.0
Web como plataforma
Web mashups
Reutilização de conteúdo web disponíveis em outras aplicações
58
Web 2.0
Web como plataforma
Web mashups
XML SVG JSON
RSS Schema
RPC RestFulWebservices
Ajax
59
Web 2.0
Web como plataforma
Web mashups
Reutilização
Performance60
HTML5
61
1989 Hoje
HTML
HTTP
Browser
HTML
Hoje
JavaScript CSS
HTML5
62
HTML5
JavaScript
HTML
CSS 3
63
HTML5
• Armazenamento no Cliente (Web SQL Database, App Cache, Web Storage)
• Communicação (Web Sockets, Worker Workers)
• Interação com o Usuário (Notifications, Drag and Drop API)
• Geolocalização
JavaScript
64
HTML5
• Semântica (New tags, Link Relations, Microdata)
• Acessibilidade (ARIA roles)
• Formulário Web 2.0 (Input Fields)
• Multimídia (Audio Tag, Video Tag)
• Desenhos 2D and 3D (Canvas, WebGL, SVG)
HTML
65
HTML5
• Tipografia (Text-shadow, font face)
• Novos elementos visuais (RGBA, Border Radius, Gradient)
• Transição, transformação e animação
CSS 3
66
HTML5
67
Impactos no desenvolvimento
68
Impactos no desenvolvimento
• Vantagens da plataforma web
• Cliente padrão
• Atualizações centralizadas no servidor
• Portabilidade
69
HTML e HTTP
Interoperabilidade
HTML
HTTP
Browser
70
Web 2.0
Web humana
HTML Usuários
Usabilidade
71
Web 2.0
Web como plataforma
Web mashups
Reutilização
Performance72
Impactos no desenvolvimento
HTML
JavaScript CSS
73
Impactos no desenvolvimento
HTML
JavaScript CSS
74
Impactos no desenvolvimento
HTML
JavaScript CSS
Usuários75
Impactos no desenvolvimento
HTML
JavaScript CSS
Usuários76
Impactos no desenvolvimento
HTML
JavaScript CSS
Usuários77
Referências• CHERYL GRIBBLE. History of the Web Beginning at CERN, 2010. Disponível em: http://
www.hitmill.com/internet/web_history.html.
• TIM BERNERS-LEE. Information Management: A Proposal, 1990. Disponível em: http://www.nic.funet.fi/index/FUNET/history/internet/w3c/proposal.html.
• TIM BERNERS-LEE e R. CAILLIAU. World Wide Web: Proposal for a HyperText Project, 1990. Disponível em: http://www.w3.org/Proposal.html.
• DOM CONNOLY. A Little History of the World Wide Web, 2000. Disponível em: http://www.w3.org/History.html.
• J. J. GARRET. Ajax: A new approach to web applications, 2005. Disponível em: http://adaptivepath.com/ideas/essays/archives/000385.php.
• M. MAHEMOFF. Ajax Design Patterns, 2006. O’Reilly Media, Inc.
• P. FRATERNALI, S. COMAI, A. BOZZON E G. T. CARUGHI. Engineering rich internet applications with a model-driven approach, 2010. ACM Transaction on Information Systems.
78
Onde procurar ajuda?
• http://w3schools.com
• http://www.w3.org/TR/REC-html40/
• http://www.w3.org/Protocols/rfc2616/rfc2616.html
• http://www.html5rocks.com/
• http://ajaxpatterns.org/Patterns
79