Linguagem HTML:Endereços Absolutos x Relativos

Prof. André Constantino da SilvaProf. Rodolfo Francisco de Oliveira

IAM1 semestre de 2012

08 de maio de 2012

Aula de Hoje

• Endereços

– Absolutos

– Relativos

Endereços na Internet

• Um objeto na internet possui uma URL

– Também conhecido como endereço eletrônico

• Exemplos:

– Portal do IFSP: http://www.ifsp.edu.br

– Portal da prefeitura de Hortolândia: http://www.hortolandia.sp.gov.br/

– Site de busca do Google: http://www.google.com

Endereço Absoluto

• O endereço absoluto inclui o protocolo, o domínio e o caminho no servidor para a página ou localização do recurso

http://www.ifsp.edu.br/index.php/14-hortolandia.html

• É independente da página atual

DomínioProtocolo Caminho

http://www.ifsp.edu.br/index.php/14-hortolandia.html

Servidor IFSP (200.133.214.203)

Internet

Twitter(199.59.148.82)

YouTube(173.194.43.40)

http://www.ifsp.edu.br/index.php/14-hortolandia.html<a href="http://www.twitter.com/IFSaoPaulo"

target="_blank"> ... </a>

http://www.ifsp.edu.br/index.php/14-hortolandia.html<a href="http://www.flickr.com/photos/ifsp"

target="_blank">... </a>

http://www.ifsp.edu.br/index.php/14-hortolandia.html<a href="http://www.youtube.com/user/IFSaoPaulo"

target="_blank">... </a>

http://www.ifsp.edu.br/index.php/14-hortolandia.html

<img style="margin: 45px 0pt 0pt 15px;" src="/templates/ifsp_reitoria/images/xInstitutoFed

eral.png.pagespeed.ic.af4NabHlRJ.png" alt="Instituto Federal de Educação, Ciência e

Tecnologia de São Paulo">

http://www.ifsp.edu.br/index.php/14-hortolandia.html

<a href="institucional.html"><span>Institucional</span></a>

http://www.ifsp.edu.br/index.php/14-hortolandia.html

<a href="07-campinas.html"><span>07. Campinas</span></a>

Endereço Relativo

• É o endereço para a localização do objeto a partir da página atual

• Usará o domínio e o caminho da página que está visualizando para “montar” a URL dos objetos

Servidor IFSP (200.133.214.203)

Internet

Twitter(199.59.148.82)

YouTube(173.194.43.40)

Todos na mesma pasta, ou seja, no mesmo

caminho

http://www.ifsp.edu.br/index.php/14-hortolandia.html

<a href="07-campinas.html"><span>07. Campinas</span></a>

http://www.ifsp.edu.br/index.php/14-hortolandia.html

<a href="07-campinas.html"><span>07. Campinas</span></a>Será a URL:

http://www.ifsp.edu.br/index.php/ 07-campinas.html

http://www.ifsp.edu.br/index.php/14-hortolandia.html

<a href="acoes-e-programas.html"><span>Ações e programas</span></a>

Servidor IFSP (200.133.214.203)

Internet

Twitter(199.59.148.82)

YouTube(173.194.43.40)

Todos na mesma pasta, ou seja, no mesmo

caminho

http://www.ifsp.edu.br/index.php/14-hortolandia.html

<img style="margin: 45px 0pt 0pt 15px;" src="/templates/ifsp_reitoria/images/xInstitutoFed

eral.png.pagespeed.ic.af4NabHlRJ.png" alt="Instituto Federal de Educação, Ciência e

Tecnologia de São Paulo">

Servidor IFSP (200.133.214.203)

Internet

Twitter(199.59.148.82)

YouTube(173.194.43.40)

/templates/ifsp_reitoria/images/xInstitutoFederal.png.pagespeed.ic.af4NabHlRJ.png

Endereço Relativo

• Quando o Endereço Relativo não iniciar com / (barra) será utilizado o domínio e o caminho da página que está sendo visualizado

• Quando o Endereço Relativo começar com / (barra) será utilizado somente o domínio da página que está sendo visualizada

Endereço Relativo

• Somente um ponto final (.) indica a pasta atual

• Dois pontos finais (..) significa a pasta pai da pasta atual

Servidor IFSP (200.133.214.203)

Internet

Twitter(199.59.148.82)

YouTube(173.194.43.40)

Estou fazendo esta página e quero incluir o logo em templates/ifsp_reitoria/images

http://www.ifsp.edu.br/index.php/14-hortolandia.html

<img src=“../templates/ifsp_reitoria/images/InstitutoFederal.png.pagespeed.ic.af4NabHlRJ.png " style="">

http://www.ifsp.edu.br/index.php/14-hortolandia.html

O que faz?<a href="/" class="pathway">Home</a>

http://www.ifsp.edu.br

Vantagem do Endereço Relativo

• Pode-se alterar o domínio sem modificar os arquivos

• Exemplo:

- Se mudássemos o nome do domínio www.ifsp.edu.br para www.ifsaopaulo.edu.br, não seria necessário alterar os arquivos

Trabalho

• Entrar com o Windows Explorer na pasta p:\IAM e criar uma pasta com seu nome

• Copiar a última versão da sua página para a página criada

• Alterar esse arquivo para incluir links para:– O Site do IFSP

– Um site relacionado ao que você gosta (exemplo: banda de música, facebook) com uma imagem

– A página do(s) colega(s) que está(ão) dividindo computador com você

– E de outros 2 colegas que você pode escolher

– Incluir um link para voltar para página de IAM