1. O documento discute HTML, páginas web e como navegadores interpretam arquivos HTML para exibir conteúdo na web. 2. É introduzido o que é HTML, como é uma linguagem de marcação usada para formatar conteúdo em páginas da web. 3. São explicados conceitos como tags, atributos e como eles afetam a formatação e exibição do conteúdo em páginas da web.

1. ~ ^
INSTITUTO FEDERAL DE EDUCACAO, CIENCIA
E TECNOLOGIA DO CEARA
Internet e Web
Novas Tecnologias para
Material de Apoio
Jos Roberto Bezerra
e
Daniel Silva Ferreira
v1.0

2. 2

3. Sumrio
a
Prefcio
a 5
1 Um pouco sobre HTML 7
1.1 Pginas web . . . . . . . . . .
a . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
1.2 Ferramentas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
1.3 Atributos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
1.4 Hiperlinks, imagens e tabelas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
1.5 Formulrios . . . . . . . . . .
a . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
1.6 Exerccios . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
2 Comeando em PHP
c 13
2.1 Mais um acr^nimo . . . . . . .
o . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
2.2 O ambiente de desenvolvimento . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
2.3 Iniciando . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
2.4 Variveis . . . . . . . . . . . . .
a . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
2.5 Operadores . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
2.6 Formulrios . . . . . . . . . . .
a . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 18
2.6.1 Mtodos HTTP . . . . .
e . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 19
2.6.2 Query string . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
2.7 Comparando . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20
2.8 Controle de
uxo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
2.9 Fun~es . . . . . . . . . . . . .
co . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 24
2.10 Exerccios . . . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26
3 Coisas Importantes em PHP 29
3.1 Por que cookies ou sess~es?
o . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
3.2 Cookies . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
3.3 Enviando cookies . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 30
3.4 Mais um superglobal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31
3.5 Autenticando . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31
3.5.1 Banco de dados . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31
3.5.2 Login . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32
3.5.3 Validaao . . . . . .
c~ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33
3.5.4 Logout . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34
3.6 Sess~es . . . . . . . . . . . .
o . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34
3.6.1 Registrando variveis
a . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34
3.7 Bancos de Dados . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35
3.7.1 Criando Tabelas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36
3.7.2 Tabela de Contatos . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36
3.8 Exerccios . . . . . . . . . .
. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 37
3

4. 4
SUMARIO
4 Estudo de Caso: Controle de Finanas Empresarial
c 39
4.1 Discutindo a aplica~o . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
ca 39
4.2 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39
4.3 Realizando Testes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39

5. Prefcio
a
Este material foi produzido para servir de apoio a disciplina Novas Tecnologias Web do curso tcnico
e
a dist^ncia em Informtica. Seu principal objetivo ser um guia que contm todo o contedo que
a a e e u
ser abordado durante a disciplina, mas que necessita ser complementado com outros materiais como
a
v
deo aulas, livros, sites indicados, alm dos mecanismos de aprendizagem dispon
e veis na ferramenta
(email, frum, etc).
o
5

6. 6

7. Cap
tulo 1
Um pouco sobre HTML
e
Triste poca! E mais fcil desintegrar um tomo do que um preconceito.
a a
Albert Einstein
Antes de comear o estudo sobre qualquer linguagem de programaao para web, necessrio
c c~ e a
entender o funcionamento de um navegador. Os browsers, como Internet Explorer, Mozilla Firefox,
Safari e outros, nada mais s~o do que visualizadores de documentos HTML, ou seja, recebem arquivos
a
HTML provenientes de um servidor web, interpretam e exibem o resultado para o usurio na forma
a
de hipertexto, imagens e tudo mais que pode ser visualizado atravs dos navegadores.
e
O HTML (Hypertext Markup Language ) exatamente a maneira como as pginas web s~o de-
e a a
scritas. E uma pseudo-linguagem, pois trata-se apenas de uma linguagem de marcaao tambm
c~ e
chamadas de tags colocadas ao longo do contedo do documento. Estas marcaoes nada mais s~o
u c~ a
do que formataoes na maneira como o contedo ser exibido pelo navegador como fontes, cores,
c~ u a
tamanho, tabelas e demais elementos presentes na pgina.
a
1.1 Pginas web
a
Um site um conjunto de pginas web, que por sua vez, s~o apenas arquivos HTML. Cada pgina
e a a a
contm diversas tags que s~o interpretadas pelos navegadores que exibem o contedo da maneira
e a u
usual. Os navegadores n~o exibem o contedo do documento HTML (fonte) diretamente, mas sim
a u
sua interpreta~o visual. Caso o usurio solicite, o cdigo fonte da pgina pode ser exibido pelo
ca a o a
navegador. Para o Firefox ou Internet Explorer, basta selecionar ExibirjCodi

8. ca~o que mostrado o
ca e
cdigo fonte da pgina.
o a
Abaixo, temos o primeiro exemplo de arquivo em HTML. Para visualiz-lo, basta salvar o con-
a
tedo mostrado na listagem 1.1 em um arquivo com a extens~o .htm ou .html e abrir com qualquer
u a
navegador instalado no computador.
1 html
2 body
3 h1 Hello , World / h1
4 p Ola Mundo / p
5 / body
6 / html
Listagem 1.1: Hello world na vers~o HTML
a
Este pequeno documento de exemplo composto por 4 tags : html, body, h1 e p. As
e
marcaoes do documento HTML s~o colocadas mescladas ao contedo. Cada marcaao interpretada
c~ a u c~ e
pelo navegador para exibir o contedo para o usurio da maneira indicada.
u a
7

9. A primeira tag (html) inicia e

10. naliza qualquer documento HTML. Todas as outras tags devem
estar entre tags html/html. Praticamente todas as tags necessitam ser fechadas com uma tag
de mesmo nome acrescida de / no incio.
O que est entre body e /body delimita o que chamado de corpo do documento, a
a e e
parte visvel ao usurio. Apenas o que est entre tags body exibido na tela do navegador ao
a a e
usurio.
a
A tag h1 formata o texto Hello, Worldcomo um cabealho de n 1 (heading ). H ainda
c vel a
outros cinco nveis formando os cabealhos h2, h3, h4, h5 e h6. Sendo h1 o
c
mais destacado e o h6 o menos destacado.
Por

11. m, a tag p delimita um pargrafo do contedo. O fechamento desta tag opcional.
a u e
Assim, pode-se remover o /p sem nenhum prejuzo exibi~o.
a ca
1.2 Ferramentas
Para visualizar arquivos simples em HTML n~o preciso nenhum software espec

12. co. Basta um editor
a e
de texto simples e o navegador para visualizar o resultado. Entretanto, a medida que a quantidade
de pginas e a complexidade aumentam, ferramentas mais adequadas podem ser utilizadas para criar
a
as pginas HTML de um site e facilitar o trabalho do desenvolvedor web.
a
Alguns exemplos de editores HTML livres s~o o Blue

13. sh e o NVu. Do lado dos proprietrios,
a a
temos o Dreamweaver, Cold Fusion e tambm o Visual Studio. Qualquer destas ferramentas atende as
e
necessidades do que ser abordado neste material, entretanto, as ferramentas livres s~o prefer
a a veis
devido a facilidade de acesso.
1.3 Atributos
As tags s~o complementadas atravs de atributos. Estes s~o pares de nome de tag e valor atribu
a e a do
que seguem a seguinte sintaxe: nome=valor. Eles s~o utilizados sempre na tag inicial e nunca no
a
fechamento. Vejamos:
a href=http://www.google.com.brBuscador/a
O atributo href indica o endereo do hiperlink. O texto entre as tags a parte exibida para o
c e
usurio, no caso, Buscador. Cada tag possui atributos espec

14. cos. Para uma refer^ncia detalhada
a e
sobre os atributos pode-se consultar a descriao completa de cada um deles consultando o endereo
c~ c
da W3 Schools.
A tag font utilizada para alterar par^metros relacionados a exibiao de fontes no navegador.
e a c~
Entretanto, o uso desta tag n~o mais recomendado no HTML 4 e foi totalmente removida no HTML
a e
5. Atualmente, a recomendaao formatar as fontes atravs de folhas de estilo CSS (Cascading Style
c~ e e
Sheets ). Assim mesmo, ainda bom um exemplo para demonstrar o uso dos atributos. Na listagem
e
1.2, observa-se que, mesmo utilizando as folhas de estilo CSS (citadas anteriormente) o resultado
obtido o mesmo.
e
1 p
2 font s i z e = 5 face = arial c olor = red
3 Este paragrafo esta em Arial , tamanho 5 e cor vermelha .
4 / font
5 / p
6
7 p
8 font s i z e = 3 face = verdana c olor = blue
9 Este paragrafo esta em Arial , tamanho 3 e cor azul .
10 / font
11 / p
Listagem 1.2: Exemplo de utiliza~o da tag font
ca
8

15. 1 p s t y l e = font - family : arial ; color : red ; font - size :20 px ;
2 Este paragrafo usa fonte Arial , tamanho 20 pixels e cor vermelha .
3 / font
4 / p
5 p s t y l e = font - family : verdana ; color :#10 A030 ; font - size :30 px ;
6 Este paragrafo usa fonte Verdana , tamanho 30 pixels e cor especificada em RGB
7 / font
8 / p
Listagem 1.3: Exemplo de formata~o de com CSS
ca
1.4 Hiperlinks, imagens e tabelas
Di

16. cilmente encontraremos um site na Internet, por mais simples que seja, sem encontrar hiperlinks,
que a ess^ncia do HTML. As imagens tambm est~o sempre presentes e as tabelas s~o fundamentais
e e e a a
para organizar e dar uma melhor organizaao ao contedo. Dominar o uso destas tags fundamental
c~ u e
para o desenvolvimento de pginas de qualquer tipo.
a
Os conhecidos hiperlinks s~o palavras ou imagens que ao serem clicadas levam a uma nova pgina
a a
ou nova se~o da mesma pgina. Ao mover o ponteiro do mouse sobre um link, o ponteiro se altera,
ca a
indicando a presena de um hiperlink. A tag a utilizada para cria~o de links em uma pgina.
c e ca a
O formato bsico :
a e
a href=urlTexto do link/a
O atributo href especi

17. ca o destino do link. Apenas o texto entre as tags exibido no navegador.
e
Outro atributo bastante utilizado target. O exemplo a seguir abre a pgina em uma nova janela:
e a
a href=http://www.google.com target=_blankBuscador/a
Para utilizar imagens nas pginas web necessrio utilizar a tag img que n~o necessita ser
a e a a
fechada. O atributo src utilizado para indicar o caminho para o arquivo que ser exibido. Caso o
e a
arquivo esteja no mesmo diretrio da pgina, basta indicar o nome. Os principais formatos utilizados
o a
s~o: JPG, GIF e PNG. O valor do atributo alt exibido quando o mouse passa sobre a

18. gura.
a e
Abaixo mostrado um exemplo do uso de img:
e
img src=boat.gif alt=Imagem de um barco
Tambm poss alterar o tamanho de exibi~o da imagem no navegador atravs dos atributos
e e vel ca e
heigth e width, conforme exemplo a seguir. Caso estes atributos n~o sejam atribu
a dos a imagem
e
mostrada em seu tamanho real,sem amplia~es ou redu~es.
co co
img src=pulpit.jpgalt=Pulpit rockwidth=304height=228
Para utilizar imagens como hyperlinks, basta substituir o texto do link entre as tags por uma tag
img. Assim, a imagem aparecer no navegador como link ao invs de texto.
a e
As tabelas s~o de

19. nidas com a tag table. Cada tabela possui linhas (tr) e clulas (td).
a e
O contedo da tabela

20. ca dentro das clulas. Pode conter texto, links, imagens, listas ou at mesmo
u e e
outras tabelas. A listagem 1.4 exempli

21. ca o uso destas tags :
1 table border = 1
2 tr
3 td linha 1, celula 1 / td
4 td linha 1, celula 2 / td
5 / tr
6 tr
7 td linha 2, celula 1 / td
8 td linha 2, celula 2 / td
9 / tr
10 / table
Listagem 1.4: Exemplo de tabela
9

22. 1.5 Formulrios
a
Formulrios s~o utilizados para passar informa~es de uma pgina a outra ou do usurio para o
a a co a a
servidor, por exemplo. Um formulrio deve conter elementos de entrada de dados como caixas
a
de texto, checkbox, bot~es de envio, listas de seleao e outros elementos dispon
o c~ veis. Para criar
um formulrio, utiliza-se a tag form que possui diversos atributos como action e name. Para
a
acrescentar elementos ao formulrio, basta acrescentar uma tag input entre as tags form,
a
segundo o exemplo a seguir.
1 form name= pesquisa
2 Primeiro Nome : input type = text name= firstname br
3 Sobrenome : input type = text name= lastname
4 input type = radio name= sex value = masculino Masculino br
5 input type = radio name= sex value = feminino Feminino br
6 Meios de Transporte que Utiliza : br
7 input type = checkbox name= vehicle value = Bicicleta Bicicleta br
8 input type = checkbox name= vehicle value = Carro Carro
9 / form
Listagem 1.5: Exemplo de formulrio com vrios elementos
a a
No exemplo anterior, o formulrio de

23. nido com o nome pesquisa, conforme o atributo presente
a e
na tag form. Em seguida, est~o presentes 6 elementos, sendo duas caixas de texto, dois bot~es
a o
de rdio e dois checkboxes, respectivamente.
a
Nas caixas de texto, o usurio pode ser inserido texto livremente. Os bot~es de rdio servem para
a o a
escolher uma opao entre vrias dispon
c~ a veis. J o checkbox, deve ser utilizado para selecionar uma
a
op~o unica dentre vrias dispon
ca a veis.
O formulrio da listagem 1.5 ainda est incompleto. Faltam alguns elementos para torn-lo
a a a
funcional. Para que isto acontea, necessrio que seja utilizado o atributo action da tag form.
c e a
Este atributo indica o arquivo ou script que ir processar os dados passados pelo formulrio.
a a
Normalmente, os scripts s~o processados no lado do servidor. O cliente (navegador) apenas envia
a
as informa~es para um servidor na Internet ou localmente para que este realize todo o processamento
co
(clculos, armazenamento, otimizaao, etc) da informa~o e devolva uma resposta ao cliente.
a c~ ca
Na listagem 1.6, o valor de action=html_form_action.php indica que este script em linguagem
PHP realizar o processamento do formulrio. Tambm foi acrescentado o bot~o submit para enviar
a a e a
os dados do formulrio para o arquivo indicado em action para processamento.
a
1 form name= pesquisa action = html_form_action . php method = get
2 Primeiro Nome : input type = text name= firstname br
3 Sobrenome : input type = text name= lastname
4 input type = radio name= sex value = masculino Masculino br
5 input type = radio name= sex value = feminino Feminino br
6 Meios de Transporte que Utiliza : br
7 input type = checkbox name= vehicle value = Bicicleta Bicicleta br
8 input type = checkbox name= vehicle value = Carro Carro br
9 input type = submit value = Enviar
10 / form
Listagem 1.6: Formulrio com bot~o de envio e action
a a
10

24. 1.6 Exerc
cios
1. Utilizando uma das ferramentas indicadas na seao 1.2, crie uma pgina web pessoal (eu.html)
c~ a
contendo alguns de seus dados pessoais, como nome, cidade onde nasceu, data de nascimento
e informaoes similares. Utilize tags p para inserir um ou mais pargrafos com essas infor-
c~ a
ma~es.
co
2. No exerc do tem anterior, acrescente uma foto sua ao arquivo.
cio
3. Ainda com relaao ao exerc 1, acrescente, no

25. nal do arquivo, links para tr^s sites externos
c~ cio e
com um texto em destaque Links Recomendados.
4. Ao

26. nal dos exerc
cios anteriores sua pgina deve ter uma apar^ncia semelhante a

27. gura 1.1.
a e
Figura 1.1: Screenshot de uma pgina em HTML
a
5. Crie um arquivo html (tabela.html) que contenha as informaoes mostradas na tabela 5. Utilize
c~
a tag table e demais tags relacionadas (tr, td, etc).
tem
descri~o
ca quantidade
1 Notebook 2
2 Processador 10
3 Mouse 5
4 Monitor 11
Tabela 1.1: Lista de preos
c
6. As tabelas podem ser utilizadas para organizar informaoes em uma pgina como pedido no
c~ a
exerccio 5. Outra utilidade das tabelas que permitem organizar a disposiao dos elementos
e c~
de uma pgina. O cdigo HTML, mostrado na listagem 1.7, exempli

28. ca essa idia. Salve o
a o e
cdigo em um arquivo e visualize o resultado no navegador.
o
11

29. 1 html
2 head
3 t i t l e Machado de Assis / t i t l e
4 / head
5 body
6 h1 Machado de Assis / h1
7 table
8 tr
9 td img src = ../ figs / machado . jpg width = 200 height = 246 / td
10 td p b Joaquim Maria Machado de Assis / b , nascido no Rio de Janeiro
11 em 21 de Junho de 1839. br
12 Considerado o grande nome da literatura nacional . / p
13 p Nascido no morro do Livramento no Rio de Janeiro , de familia pobre ,
14 estudou em escolas publicas e nunca frequentou a universidade . / p
15 / td
16 / tr
17 tr
18 td nbsp ; / td
19 td h3 Links Recomendados / h3
20 a href = www . machadodeassis . org . br / Academia Brasileira de Letras / a br
21 a href = http :// machado . mec . gov . br / Obra Completa - MEC / a br
22 / td
23 / tr
24 / table
25 / body
26 / html
Listagem 1.7: Exemplo do uso de tabelas para organizar os elementos da pgina
a
7. Modi

30. que o cdigo mostrada na listagem 1.7 para que a imagem seja exibida no lado direito
o
ao invs do lado esquerdo. Pesquise na internet como modi

31. car a cor de fundo de uma tabela
e
e aplique nesta pgina.
a
8. Crie uma pgina para o cadastramento (form.html) de um usurio na intranet de uma empresa.
a a
O formulrio deve conter os campos: nome completo, setor (compras, vendas ou

32. nanceiro),
a
nome do usurio e senha.
a
9. Dada a tag body mostrada abaixo, pesquise para que servem os atributos BGCOLOR,
TEXT, LINK, ALINK e VLINK. Aplique-os na pgina do exerc 1.
a cio
body bgcolor=#rrggbb text=#rrggbb link=#rrggbb
alink=#rrggbb VLINK=#rrggbb
10. Diferencie os termos pginas estticas e pginas din^micas relacionados a construao de
a a a a c~
sites em geral.
12

33. Cap
tulo 2
Comeando em PHP
c
Estamos irrevogavelmente em um caminho que nos levar as estrelas.
a
A n~o ser que, por uma monstruosa capitulaao ao egosmo e estupidez,
a c~ a
acabemos nos destruindo.
Carl Sagan
Os iniciantes em desenvolvimento para web ou em tecnologia da informaao n~o devem se assustar
c~ a
com a quantidade de acr^nimos (siglas) existentes. ASP, CGI, SOAP, XML e HTTP s~o alguns
o a
deles. A lista pode ser acrescida de vrios outros
a tens e pode parecer interminvel assustando os
a
menos experientes no assunto. Assim, para desenvolver um site com qualidade e principalmente com
funcionalidade um tem indispensvel na lista, a linguagem de scripts PHP.
e a
2.1 Mais um acr^nimo
o
O PHP uma linguagem de programaao voltada para web bastante conhecida. Trata-se da unica
e c~
linguagem de scripts baseada em servidor que possui cdigo aberto. E
o bastante
exvel e fcil de
a
aprender. Pesquisas mostram que milh~es de websites utilizam a linguagem PHP como base para
o
suas aplica~es. A raz~o para isso a grande capacidade do PHP, uma linguagem poderosa, fcil de
co a e e a
usar e aprender alm de ser livre. Alm de ser extremamente robusta e escalvel, pode ser utlizada
e e a
em aplicaoes de alta demanda com boas respostas. Possui suporte a diversos bancos de dados, a
c~
XML, permite a cria~o de frameworks do prprio programador e ainda excelente documentaao.
ca o c~
Como se todas estas vantagens n~o fossem su

34. cientes ainda gratuita.
a e
2.2 O ambiente de desenvolvimento
Para que o PHP funcione, necessrio combin-lo com um servidor web, tipicamente o Apache. As
e a a
requisic~es a scripts feitas pelo usurio ou aplicaao s~o recebidas pelo servidor web e manipuladas
o a c~ a
pelo interpretador PHP. O resultado obtido depois da execuao devolvido ao servidor web que
c~ e
c~ e
transmite a informaao para o cliente (navegador). O script o programa propriamente dito. E onde
est escrito o cdigo da aplica~o que funciona na Internet. Nele, poss fazer clculos, processar
a o ca e vel a
entradas do usurio, interagir com bancos de dados, ler e escrever em arquivos e tudo mais que uma
a
linguagem de programa~o capaz de realizar.
ca e
As atividades propostas neste material foram implementadas utilizando o PHP juntamente com
o servidor web Apache no sistema operacional Linux. Essa a combinaao de ferramentas mais
e c~
comum para utilizar o PHP. Entretanto, existem vers~es tanto do PHP quanto do Apache para
o
outros sistemas operacionais como Windows e MacOS. Instru~es detalhadas sobre a instalaao e
co c~
preparaao do ambiente de desenvolvimento para cada plataforma podem ser encontradas no manual
c~
do PHP dispon no endereo:
vel c
13

35. http://www.php.net/manual/pt BR/install.php
.
2.3 Iniciando
A maneira mais simples de programar em PHP embutir o cdigo da linguagem dentro de um arquivo
e o
contendo tags HTML. O cdigo embutido nas pginas executado quando a pgina carregada.
o a e a e
Os comandos da linguagem PHP devem estar sempre entre tags espec

36. cas indicando ao Apache
que os comandos entre estas tags devem ser processados pelo interpretador PHP. Observar a listagem
2.1.
1 ? php
2
3 comandos PHP
4
5 ?
Listagem 2.1: Tags da linguagem PHP
Um exemplo simples de como os comandos PHP s~o colocados junto com HTML mostrado na
a e
listagem 2.2.
1 html
2 head
3 title Matrix / title
4 / head
5 body
6
7 Agente : Quem voce pensa que e?
8 br
9
10 ? php
11 // saida mostrada
12 echo ' Neo : Eu sou Neo , mas me chamam de o escolhido . ';
13 ?
14
15 / body
16 / html
Listagem 2.2: PHP e HTML juntos
Executando-se o cdigo mostrado na listagem 2.2 e abrindo o cdigo HTML lido pelo navegador
o o
possvel observar que as tags PHP n~o est~o presentes. O que aconteceu? Quando a pgina req-
e a a a e
uisitada ao servidor web (Apache) pelo ciente web (navegador) esta interpretada pelo interpretador
e
PHP presente no servidor, que por sua vez, repassa o resultado na forma de um arquivo HTML que
e a
visualizado pelo navegador. Este processo est ilustrado na

37. gura 2.1. E importante notar que a

38. gura ilustra o caso tpico de um servidor que est sendo acessado atravs de uma rede interna ou
a e
da prpria Internet. O que pode ser chamado um ambiente de produ~o. O que quer dizer que os
o ca
elementos est~o interagindo em um sistema real, em pleno funcionamento.
a
Em oposi~o a um sistema de produ~o, temos os sitemas de teste ou desenvolvimento em que,
ca ca
normalmente, todos os elementos citados anteriormente funcionam em uma unica mquina, conforme
a
ilustrado na

39. gura 2.2. Estes sistemas s~o utilizados para testar modi