Aula 01 - Introdução A Web

Programao para WEB I
Introduo a WEB
Contato: <lara.popov@ifsc.edu.br>
Site: http://professores.chapeco.ifsc.edu.br/lara/
Lara Popov Zambiasi Bazzi Oberderfer

Introduo
Histrico da Internet
Cliente e Servidor
Introduo aos protocolos da Internet
Objetivos
Contextualizar o desenvolvimento Web
Apresentar uma viso inicial de conceitos

que sero teis no decorrer da disciplina

Vdeo:
Como Funciona a Internet

Em 1957 a Unio Sovitica

lanou ao espao o primeiro
satlite artificial da Terra, o
Sputinik.
O governo norte americano
ento criou o Advanced
Research Projects Agency
(ARPA), uma diviso do
Departamento de Defesa para
tentar voltar a liderar a corrida
espacial.

Devido a iminncia de uma guerra

nuclear e o fato de os sistemas de
defesa
serem
extremamente
dependente dos computadores, a rede
de
computadores
deveria
ser
extremamente confivel.
Foi dado inicio ao desenvolvimento de
uma rede distribuda, que no dependia
de um computador central.
Surgiu como iniciativa dos militares

americanos (Arpanet 1969)
Manuteno de dados e redes de
comunicao e segurana em caso de
ataque
Projeto em conjunto com Universidades
e centros de pesquisa (UCLA, Stanford,
MIT)
para manter a comunicao
entre as bases militares dos EUA
Internet
ARPANET possibilitava:
Transferncia de arquivos
Compartilhamento de dispositivos
Novas redes paralelas independentes

foram criadas (1989 fim da arpanet)
Novas redes no se comunicavam entre si
Necessidade de criar um PROTOCOLO

comum de comunicao (TCP/IP, 1974)

Como tudo comeou
Tim Berners-Lee
Criador da Word Wide Web
Criador do primeiro Servidor Web (CERN httpd)
Implementou a primeira comunicao bem

sucedida entre um cliente HTTP e o servidor
Fundador da W3C (World Wide Web Consortiom)
Desde 2004 atua no desenvolvimento da Web

Semntica
Criador do primeiro navegador (NEXUS)

Navegador Nexus

Internet no Brasil
1985 Criao do domnio .br

1897 USP prope uma rede de
pesquisa entre vrias universidades
1993 primeira conexo 64Kbps de
longa distncia estabelecida
1996 surgimento dos provedores de
acesso dando incio ao crescimento da
populao na internet
10
Arquitetura Cliente X Servidor

11
Servidor
Modelo cliente-servidor
Cliente
No modelo cliente-servidor, a aplicao est

dividida em duas partes:
No lado do cliente ns temos a tela e a lgica de

apresentao (entrada de dados), e do lado do
servidor a lgica de integridade e o mtodo de
acesso, ou seja, a arquitetura cliente-servidor
aproveita o que tem de melhor de cada um, cliente
e servidor.
No lado do servidor, um ambiente multiusurio, com

administrao de dados centralizada e segurana
sofisticada. Do lado do cliente um ambiente
individual, com interface grfica e interativa.

12
Cliente
Computador, terminal ou servio que

necessita de alguma informao.
Normalmente
a
informao
est
armazenada em outra mquina na rede,
denominada de servidor.
Exemplo: o navegador Web do seu
computador um cliente e ir acessar
servios de diversos servidores pela
internet
13
Servidor
Computador dedicado a fornecer servios que

podem ser requisitados pelos clientes
Exemplo de servios oferecidos:
Arquivos, correio eletrnico (email), banco de

dados, pginas Web, etc.
Geralmente os servidores so mquinas mais

potentes e seguras que as convencionais
O termo servidor nomeia tambm o programa
que fornece um determinado servio. Ex.:
Apache, IIS
14
Requisitando um recurso na Web
Atravs de um navegador (browser)

As pginas Web so requisitadas
utilizando o protocolo HTTP (protocolo
simples, de modo a possibilitar a troca
de informaes de uma forma gil

15
Protocolos e
Protocolo HTTP

16
Vdeo:
IETF e padroes da Internet

17
Protocolos da Internet: Definio

Protocolo:
Padro de comunicao que possibilita
a
conexo,
comunicao
e/ou
transferncia de dados entre dois
sistemas computacionais. um idioma
comum, conhecido pelos sistemas
interligados.

18
Protocolos da Internet
TCP/IP: Conjunto de protocolos
TCP, IP, HTTP, FTP e outros
Podem ser utilizados para comunicao

de qualquer rede.
Para esta unidade curricular usaremos
o protocolo HTTP

19
Protocolo HTTP

20
Requisio HTTP
Requisio contm o endereo da

pgina/arquivo requisitado.
ex.: http://www.google.com.br
Essa requisio traduzida no formato
do protocolo HTTP
Contm o caminho para o servidor e

dados que podem ser teis ao servidor.

21
Requisio HTTP
O servidor recebe a requisio e

devolve para o cliente (navegador) o
resultado do seu processamento.
Por ex.: uma pgina HTML ou um arquivo
Pgina de erro retornada
Caso o recurso solicitado no exista no

servidor
Caso o servidor esteja fora do ar

22
Exemplo:
http://www.chapeco.ifsc.edu.br/site/login.php
http protocolo utilizando
www.chapeco.ifsc.edu.br nome
para o servidor. Esse nome
mapeado para um endereo IP,
pelo servio de resoluo de
nomes (DNS)
/site/ - o caminho onde o
arquivo pode ser encontrado
login.php o nome do arquivo

23
Alguns mtodos HTTP
GET: solicita algum recurso ao servidor,

como uma pgina Web, uma figura, etc.
o mtodo mais utilizado. Toda vez
que digitamos um endereo no
navegador, enviado um pedido GET
para o recurso solicitado.

24
Alguns mtodos HTTP
HEAD: solicita apenas informaes

sobre um recurso. Ou seja, retorna
apenas os cabealhos HTTP contendo
informaes sobre o recurso.

25
Alguns mtodos HTTP
POST: utilizado para enviar informaes

para o servidor. Ex.: dados de
formulrios, uma nova mensagem de
texto (twitter, blog,etc), um dado que ir
atualizar um bando de dados.

26
Exemplo de GET
URL: https://intranet.ifsc.edu.br/logon.php
Arquivo que ser enviado ao servidor requisitando a

pagina logon.php:
GET: logon.php
HOST: intranet.ifsc.edu.br
User-Agent: Mozilla/5.0 (Windows; U; Windows NT 6.0; pt-BR;
rv:1.9.2) Gecko/20100115 Firefox/3.6 (.NET CLR 3.5.30729)
Accept:
text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: pt-br,pt;q=0.8,en-us;q=0.5,en;q=0.3
Accept-Encoding: gzip,deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7

27
Resposta HTTP para a solicitao

HTTP/1.1 200 OK
Date: Sat, 06 Mar 2010 18:32:24 GMT
Server: Apache
X-Powered-By: PHP/5.2.6-1+lenny2
Expires: Thu, 19 Nov 1981 08:52:00 GMT
Cache-Control: no-store, no-cache, mustrevalidate, post-check=0, pre-check=0
Pragma: no-cache
...
OBS : Aqui vm o cdigo HTML da pgina,
que ser exibido pelo navegador

28
Desenvolvimento para o cliente
O usurio (cliente) acessa recursos

armazenados no servidor
Para criar pginas Web, o computador
cliente deve ter no mnimo:
Navegador web
Editor de texto simples
Conexo com a internet

29
Conceitos
Bsicos

30
O que Web design?

31
O que Web design?
Web design , em ingls, o nome da arte

praticada pelos seres artrpodes da ordem
Aracneae, ou aracndeos, mais popularmente
conhecidos como as aranhas.
Mas isto era h 10 anos atrs. Hoje, Web design
a arte de tecer uma outra teia, muito mais
desorganizada e catica, e que no governada
por nenhuma aranha. Web design a concepo
e projeto da interface interativa do servio Web,
formado por "pginas".

32
O que Web design?
Alguns anos depois das aranhas, a administrao da

Web cabia programadores que precisavam codificar
toda a informao usando uma linguagem: o HTML, e
depois armazen-las em uma rea especial de uma
mquina Unix, onde rodava um servidor Web
programa que permitia o acesso remoto s
informaes das pginas. Hoje, a arte de criar
pginas Web continua a exigir mais e mais
conhecimentos de programao ... visual!
Saber HTML hoje menos importante que ter noes
de design.

33
O que Web design?
O design de pginas para a Web hoje se

assemelha mais editorao eletrnica
que programao.
Os caminhos do Web design, porm, so
bem diferentes daqueles seguidos na
criao para mdia impressa.
O Web designer deve conhecer no s
as possibilidades do meio onde publicar
a sua informao, como suas limitaes.
34
O que Web design?
A arte do Web design consiste em aproveitar ao mximo os

recursos oferecidos pela Web, garantindo a melhor
apresentao, navegabilidade e interatividade de um Web
site.
A ideia atrair os visitantes e estimul-los a voltar outras
vezes. s vezes necessrio sacrificar a qualidade da
apresentao ou deixar de usar algum recurso til devido a
lentido da rede ou incompatibilidades de browsers.
importante que o Web designer aprenda a traar uma
linha de equilbrio entre os impedimentos tecnolgicos e as
possibilidades criativas desta nova mdia, para tirar o maior
proveito do seu potencial.

35
O que Web design?
O bom Web
computador.
design
comea
fora
do
Planejar a estrutura da teia e sua identidade

com base nos objetivos que se destina
(comercio, informao, promoo, intranet,
captura de insetos) antes de iniciar a
implementao, preserva o conceito por trs
do design da interface e diminui a limitao
da tecnologia disponvel.
36
A web como um meio de comunicao
Apesar de ter surgido como um servio de uma

rede de computadores, a Web hoje muito mais
que isto e para explor-la, nem computador
necessrio mais.
Tecnologias recentes como o Network Computer
(NC) - que um simples terminal para a Web,
browsers que vm embutidos em telefones
celulares, e a rede WebTV mostram que a World
Wide Web est destinada a preencher todos os
espaos da mdia de difuso, no se limitando
queles quepossuem um computador.

37
A Web, dessa forma, possui um potencial

inigualvel na histria das telecomunicaes.
capaz de servir de interface todos os
servios da Internet e ainda aos tradicionais
servios de voz (telefone), televiso, rdio e
mdias impressas.
Pode integrar tudo e interagir com tudo.
Ainda estamos dando os primeiros passos neste
novo terreno, e cada dia nos traz mais certeza
de que trata-se de um caminho sem volta.

38
Diferente dos meios tradicionais de comunicao de

massa, a World Wide Web uma mdia democrtica.
O usurio no precisa possuir uma estao difusora,
uma concesso, uma grfica ou qualquer coisa do tipo
para poder publicar sua informao e influenciar sua
audincia.
Todos podem receber as informaes de todos.
Qualquer um pode prover informao.
O poder da informao est nas mos de todos os que

puderem ter um espao na Teia, e no mais apenas com
as aranhas ou com aqueles que possuem os meios de
difuso tradicionais.

39
A World Wide Web e a Internet
A World Wide Web o nome do mais popular dos

servios da Internet. Por esse motivo,
freqentemente confundida com a prpria Internet.
Mas Web e Internet no so a mesma coisa, e
precisamos conhecer bem a diferena entre as
duas antes que possamos comear a desenvolver
pginas e aplicaes para a Web.
Internet o nome dado ao conjunto de
computadores, provedores de acesso, satlites,
cabos e servios que formam uma rede mundial
baseada em uma coleo de protocolos de
comunicao conhecidos como TCP/IP.
40
Protocolos
atravs
de
protocolos
de
comunicao que um computador pode
se comunicar com outro atravs de uma
linha telefnica ou placa de rede sem
que o usurio precise se preocupar em
saber qual o meio fsico que est sendo
utilizado.

41
Endereos Internet
Um dos protocolos mais importantes da suite TCP/IP

o protocolo de rede IP Internet Protocol.
Ele define a forma de endereamento que permite a
localizao de um computador na Internet, atravs de
um conjunto de dgitos chamado de endereo IP.
Qualquer mquina acessvel atravs da Internet tem
um endereo IP exclusivo. Esse endereo pode ser
temporrio ou permanente. Quando voc se conecta a
um provedor via linha telefnica, ele atribui um nmero
IP temporrio sua mquina que permitir que ela
faa parte da Internet enquanto durar a sua sesso no
provedor.

42
Endereos Internet
S assim possvel receber informaes em um

browser ou enviar e-mail.
Computadores que hospedam pginas Web e que
oferecem outros servios pela Internet precisam
de um endereo IP fixo, para que voc possa
localiz-los a qualquer hora.
Por exemplo, 200.231.191.10 o endereo IP da
mquina onde est localizado o servidor Web do
IBPINET em So Paulo. Voc pode localiz-lo
digitando http://200.231.191.10/ no campo de
endereos do seu navegador.

43
Servio de Nomes (DNS Domain

Name Service)
Embora cada computador seja identificado de forma

exclusiva atravs de um endereo IP, no dessa forma
que costumamos localiz-los na Internet. Um dos servios
fundamentais ao funcionamento da Internet o servio de
nomes de domnio.
Esse servio oferecido por vrias mquinas espalhadas
pela Internet e que guardam tabelas que associam o nome
de uma mquina ou de uma rede a um endereo IP.
Quando voc digita o nome de uma mquina no seu
browser (por exemplo, www.ibpinet.net), o browser primeiro
tenta localiz-la consultando uma outra mquina (cujo
endereo IP o browser j conhece) que oferece o servio
de nomes.

44
Servio de Nomes (DNS Domain

Name Service)
Essa mquina consulta outros servios de

nomes espalhados pela Internet e em pouco
tempo
devolve
o
endereo
IP
correspondente
ao
nome
solicitado
(www.ibpinet.net devolver 200.231.191.10).
Se o sistema de nomes falhar, o browser
no conseguir o nmero IP que precisa e
assim
no
localizar
a
mquina
correspondente (mesmo que ela no esteja
fora do ar).
45
Portas e servios da Internet
Os principais servios utilizados na rede eram a

transferncia de arquivos entre computadores
(usando aplicaes que se comunicavam
atravs do protocolo FTP - File Transfer
Protocol), o correio eletrnico e a emulao de
terminal, que permitia o acesso a computadores
remotos. Esses servios eram oferecidos em
algumas mquinas onde rodavam programas
servidores, permanentemente no ar aguardando
a conexo de um cliente em uma de suas portas
de comunicao.

46
A plataforma Web
A World Wide Web um servio TCP/IP

baseado no protocolo de nvel de
aplicao HTTP (HyperText Transfer
Protocol) Protocolo de Transferncia de
Hipertexto. A plataforma Web o meio
virtual formado pelos servidores HTTP
(servidores Web que mantm sites),
clientes HTTP (browsers) e protocolo
HTTP (a lngua comum entre o cliente e o
servidor).
47
Hipertexto
Hipertexto uma forma no linear de publicao de

informaes onde palavras que aparecem no
decorrer do texto podem levar a outras sees de um
documento, outros documentos ou at outros
sistemas de informao, fugindo da estrutura linear
original de um texto simples.
O hipertexto baseia-se em ligaes entre dois pontos
chamados de ncoras. As ligaes entre as ncoras
so chamadas de vnculos (links). Vnculos de
hipertexto so implementados em textos publicados
na Web usando uma linguagem declarativa chamada
HTML - HyperText Markup Language.
48
HTML
HTML usada para marcar um arquivo

de texto simples (texto simples texto
sem formatao alguma, visualizvel
em qualquer editor de textos). Se um
arquivo de texto simples receber uma
extenso de nome de arquivo .html ou
.htm, um navegador como o Internet
Explorer ir tentar interpret-lo como
HTML.

49
Servidor HTTP
O servio HTTP funciona de forma

semelhante ao servio FTP - File
Transfer
Protocol
(protocolo
de
comunicao usado na Web para
operaes
de
transferncia
de
arquivos).

50
URLs
Todas as comunicaes na plataforma Web

utilizam uma sintaxe de endereamento
chamada URI - Uniform Resource Identifier para localizar os recursos que so transferidos.
O servio HTTP depende da URI que usada
para localizar qualquer coisa na Internet.
Contm duas informaes essenciais: 1)
COMO transferir o objeto (o protocolo); 2)
ONDE encontr-lo (o endereo da mquina e o
caminho virtual).

51
URLs
URIs tipicamente so constitudas de trs partes:

mecanismo (protocolo) usado para ter acesso aos
recursos (geralmente HTTP)
nome da mquina (precedido de // ) onde o servio
remoto oferecido (e a porta, se o servio no estiver
em uma porta padro) ou outro nome atravs do qual o
servio possa ser localizado (sem // ).
nome do recurso (arquivo, programa) na forma de um
caminho (no sistema de arquivos virtual do servidor)
onde se possa encontr-lo dentro da mquina.
Sintaxe tpica: protocolo://maquina:porta/caminho/recurso

52
Browser
O browser um programa que serve de

interface universal a todos os servios que
podem ser oferecidos via Web. para a
plataforma Web o que o sistema operacional
(Windows, Linux, Mac) para o computador.
A principal funo de um browser ler e exibir o
contedo de uma pgina Web. A maior parte
dos browsers tambm capaz de exibir vrios
outros tipos de informao como diversos
formatos de imagens, vdeos, executar sons e
rodar programas.
53
Tipos MIME
MIME uma sintaxe universal para

identificar tipos de dados originalmente
utilizada para permitir o envio de
arquivos anexados via e-mail.
O servidor Web possui, internamente,
tabelas que relacionam os tipos de
dados (na sintaxe MIME) com a
extenso dos arquivos por ele
gerenciados.
54
Tecnologias de Apresentao
As tecnologias utilizadas na plataforma

Web podem ser classificadas de acordo
com sua finalidade em tecnologias de
apresentao e tecnologias interativas.
As tecnologias de apresentao so
aquelas que se destinam unicamente
formatao e estruturao das pginas
Web.

55
Podem ser usadas tambm para

construir a interface de aplicaes Web
no browser. Os principais padres em
uso atualmente so HTML, CSS, XML e
XSL.

56
As tecnologias interativas so as que

permitem
o
desenvolvimento
de
aplicaes e pginas com alto nvel de
interatividade com o usurio.
Em geral consistem da combinao de
uma linguagem de programao com
uma arquitetura ou modelo que
possibilita a sua integrao com uma
pgina HTML ou servidor HTTP.
57
Podem, portanto, executar do lado do

servidor (como CGI, ASP, ADO,
Servlets, ISAPI, JSP, PhP, Cold Fusion
e LiveWire) ou do lado do cliente (como
JavaScript, DHTML, Java Applets,
ActiveX e VBScript).

58
Lista de Exerccios 01
1. Como funciona a arquitetura cliente x servidor
2. O que um protocolo? Cite exemplos.
3. O que a requisio HTTP?
4. O que GET, HEAD e POST, cite exemplos.
5. O que Web design?
6. Como se formam os endereos na internet: qual protocolo
utiliza e como funciona?
7. O que DNS?
8. O que Hipertexto?
9. O que um servidor HTTP?
10. O que so URL's? Cite exemplos.
11. O que Browser? Cite exemplos.
12. O que um tipo MIME?

59
Revisando...
Aprendemos um pouco
protocolos da internet
sobre
os
Conceitos bsicos de internet.

60
Referncias Bibliogrficas
MELLY, Mylene. Histria da Internet.

Disponvel
em:
http://www.eca.usp.br/prof/mylene/grad/disc
iplinas/metodologia/ppt/Teoria%20%20Aula%201.ppt. Acesso em: 07/02/2014.
SILVA, Ane Carolina. Introduo ao HTML e
CSS.
Disponvel
em:
http://pt.slideshare.net/anecarolinesj/htmlcss-25010996?from_search=1. Acesso em:
10/02/2014.
61

Aula 01 - Introdução A Web

Enviado por

Dados do documento

Título original

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

Aula 01 - Introdução A Web

Enviado por

Direitos autorais:

Formatos disponíveis

Programao para WEB I

Lara Popov Zambiasi Bazzi Oberderfer

Introduo aos protocolos da Internet

Contextualizar o desenvolvimento Web

Apresentar uma viso inicial de conceitos

Lara Popov Zambiasi Bazzi Oberderfer

Lara Popov Zambiasi Bazzi Oberderfer

Em 1957 a Unio Sovitica

Lara Popov Zambiasi Bazzi Oberderfer

Devido a iminncia de uma guerra

Surgiu como iniciativa dos militares

Novas redes paralelas independentes

Necessidade de criar um PROTOCOLO

Lara Popov Zambiasi Bazzi Oberderfer

Como tudo comeou

Criador da Word Wide Web

Criador do primeiro Servidor Web (CERN httpd)

Implementou a primeira comunicao bem

Fundador da W3C (World Wide Web Consortiom)

Desde 2004 atua no desenvolvimento da Web

Criador do primeiro navegador (NEXUS)

Lara Popov Zambiasi Bazzi Oberderfer

Lara Popov Zambiasi Bazzi Oberderfer

1985 Criao do domnio .br

Arquitetura Cliente X Servidor

Lara Popov Zambiasi Bazzi Oberderfer

No modelo cliente-servidor, a aplicao est

No lado do cliente ns temos a tela e a lgica de

No lado do servidor, um ambiente multiusurio, com

Lara Popov Zambiasi Bazzi Oberderfer

Computador, terminal ou servio que

Computador dedicado a fornecer servios que

Arquivos, correio eletrnico (email), banco de

Geralmente os servidores so mquinas mais

Requisitando um recurso na Web

Atravs de um navegador (browser)

Lara Popov Zambiasi Bazzi Oberderfer

Lara Popov Zambiasi Bazzi Oberderfer

Lara Popov Zambiasi Bazzi Oberderfer

Protocolos da Internet: Definio

Lara Popov Zambiasi Bazzi Oberderfer

TCP/IP: Conjunto de protocolos

TCP, IP, HTTP, FTP e outros

Podem ser utilizados para comunicao

Lara Popov Zambiasi Bazzi Oberderfer

Lara Popov Zambiasi Bazzi Oberderfer

Requisio contm o endereo da

Contm o caminho para o servidor e

Lara Popov Zambiasi Bazzi Oberderfer

O servidor recebe a requisio e

Por ex.: uma pgina HTML ou um arquivo

Pgina de erro retornada

Caso o recurso solicitado no exista no

Caso o servidor esteja fora do ar

Lara Popov Zambiasi Bazzi Oberderfer

Lara Popov Zambiasi Bazzi Oberderfer

Alguns mtodos HTTP

GET: solicita algum recurso ao servidor,

Lara Popov Zambiasi Bazzi Oberderfer

Alguns mtodos HTTP

HEAD: solicita apenas informaes

Lara Popov Zambiasi Bazzi Oberderfer

Alguns mtodos HTTP