SlideShare une entreprise Scribd logo
1  sur  11
LINK
Com HTML é possível fazermos ligações
de uma região de texto (ou imagem) a um outro
documento (ou a outra parte do próprio
documento). Você já deve ter visto em alguma
página internet exemplos dessas ligações: o
browser destaca essas regiões e imagens do texto,
indicando que são ligações de hipertexto também chamadas hypertext links ou hiperlinks
ou simplesmente links, onde normalmente, o
mouse vira uma “mãozinha” e ao clicar
“chamamos” (abrimos) um outro documento,
página web ou figura por exemplo.
Para inserir um link em um documento,
utilizamos a etiqueta <A>, da seguinte forma:
<A HREF = "arquivo_destino"> âncora </A>
Onde:
arquivo_destino: é o endereço do documento de destino, da
página ou imagem a qual queremos abrir.
âncora: é o texto ou imagem que servirá de ligação hipertexto do
documento sendo apresentado para o
documento de destino.
Atributos:
<A> tem vários atributos que são utilizados de acordo com a ação
associada ao link. Os mais usados são apresentados a seguir:
HREF: Indica o arquivo de destino da ligação de hipertexto.
TARGET: Indica o frame em que será carregado o arquivo_destino.
Maiores detalhes na seção sobre frames.
NAME: Marca um indicador, isto é, uma região de um documento
como destino de uma ligação.
Maiores detalhes na seção sobre indicadores.
Caminhos (uso de Links)

Os links podem estar
indicados como caminhos
relativos ou absolutos.
Caminho Relativo:
O caminho relativo pode ser usado sempre que queremos
fazer referência a um documento armazenado no mesmo servidor
do documento atual.
Através do campo de endereços do browser, é possível
identificar se um documento (página) que está sendo visualizado
está dentro de algum diretório (pasta). Como por exemplo se
estivermos em um browser acessando a página da FACCAT e
vemos o seguinte endereço:
http://www.faccat.br/apostilas/apostila_de_informatica.html. O que
podemos concluir é que o documento que está sendo visualizado no
momento, chamado apostila_de_informatica.html, está
localizado dentro de um diretório (pasta) chamado apostilas do
servidor www.faccat.br.
Caminho Relativo:
Então para escrevermos por exemplo um link deste
documento (apostila_de_informatica.html) para um documento
chamado doc.html que está localizado no diretório
Apostilas/documentos/ do mesmo servidor www.faccat.br, tudo que
precisamos fazer é escrever:
<A HREF="documentos/doc.html"> Exemplo de Caminho Relativo
</A>
Para usar links com caminhos relativos é preciso, portanto,
conhecer a estrutura do diretório do servidor no qual estamos
trabalhando, pois devemos indicar todo o caminho onde está o
documento no qual estamos nos referindo no link. Quando há
alguma dúvida, o melhor é usar o caminho absoluto.
Caminho Absoluto :
Utilizamos o caminho absoluto quando desejamos
referenciar um documento que esteja em outro
servidor, por exemplo:
<A HREF="http://www.faccat.br"> FACCAT - Faculdades de
Taquara </A>
Que oferece um link FACCAT - Faculdades de Taquara que
ao ser clicado com o mouse abrirá a página cujo endereço é
http://www.faccat.br.
Com a mesma sintaxe, é possível escrever links para
qualquer servidor de informações da Internet.
Indicadores (uso de Links) :
Como foi dito anteriormente, o atributo NAME permite
indicar um trecho de documento como
ponto de chegada de uma ligação hipertexto.
A formatação:
<A NAME="inicio"> Indicadores (uso de links) </A>
faz com que a âncora Indicadores (uso de links) seja o destino de
um link.
Se escrevermos:
<A HREF="#inicio"> Topo do Documento </A>
teremos uma ligação hipertexto para um trecho deste mesmo
documento:
Posso criar link para mais alguma coisa? :

Você pode criar link para um endereço de e-mail.
Isto é feito de modo semelhante aos links para
documentos.

<a href="mailto:nobody@html.net">Enviar
e-mail para nobody em HTML.net</a>
Posso criar link para mais alguma coisa? :

Você pode criar link para um endereço de e-mail.
Isto é feito de modo semelhante aos links para
documentos.

<a href="mailto:nobody@html.net">Enviar
e-mail para nobody em HTML.net</a>

Contenu connexe

En vedette

En vedette (9)

PresentacióN1
PresentacióN1PresentacióN1
PresentacióN1
 
Linea del Tiempo Sofwaretime rime,
Linea del Tiempo Sofwaretime rime,Linea del Tiempo Sofwaretime rime,
Linea del Tiempo Sofwaretime rime,
 
O tecnófobo Érica marta fernandes
O tecnófobo  Érica marta fernandesO tecnófobo  Érica marta fernandes
O tecnófobo Érica marta fernandes
 
Actividad 2
Actividad 2Actividad 2
Actividad 2
 
Binder6 1
Binder6 1Binder6 1
Binder6 1
 
Actividad 3
Actividad 3Actividad 3
Actividad 3
 
Contoh uji homogenitas data
Contoh uji homogenitas dataContoh uji homogenitas data
Contoh uji homogenitas data
 
Academic word list synonyms vietnamese
Academic word list synonyms   vietnameseAcademic word list synonyms   vietnamese
Academic word list synonyms vietnamese
 
Mr johann van der westhuizen new cv 2
Mr johann van der westhuizen new cv 2Mr johann van der westhuizen new cv 2
Mr johann van der westhuizen new cv 2
 

Similaire à Link

WebDesign - Aula05 - Links.pptx
WebDesign - Aula05 - Links.pptxWebDesign - Aula05 - Links.pptx
WebDesign - Aula05 - Links.pptxGabrielaMota46
 
Apostila De Html
Apostila De HtmlApostila De Html
Apostila De HtmlWanderlei
 
Desenvolvimento para a Internet - Aula 04
Desenvolvimento para a Internet - Aula 04Desenvolvimento para a Internet - Aula 04
Desenvolvimento para a Internet - Aula 04Leandro Rezende
 
Manual curso php
Manual curso phpManual curso php
Manual curso phpalexinaa
 
Manual curso php
Manual curso phpManual curso php
Manual curso phpalexinaa
 
Curso de Desenvolvimento de Sistemas Web - (X)HTML
Curso de Desenvolvimento de Sistemas Web - (X)HTMLCurso de Desenvolvimento de Sistemas Web - (X)HTML
Curso de Desenvolvimento de Sistemas Web - (X)HTMLFabio Moura Pereira
 
Portifolio net
Portifolio netPortifolio net
Portifolio netlaerciopds
 
Introdução ao HTML 5 do Básico ao avançado
Introdução ao HTML 5 do Básico ao avançadoIntrodução ao HTML 5 do Básico ao avançado
Introdução ao HTML 5 do Básico ao avançadoLuisFalco8
 

Similaire à Link (20)

Apostila de html
Apostila de htmlApostila de html
Apostila de html
 
Elemento ancora
Elemento ancoraElemento ancora
Elemento ancora
 
html
html html
html
 
Html
HtmlHtml
Html
 
Curso html
Curso htmlCurso html
Curso html
 
WebDesign - Aula05 - Links.pptx
WebDesign - Aula05 - Links.pptxWebDesign - Aula05 - Links.pptx
WebDesign - Aula05 - Links.pptx
 
Apostila De Html
Apostila De HtmlApostila De Html
Apostila De Html
 
Desenvolvimento para a Internet - Aula 04
Desenvolvimento para a Internet - Aula 04Desenvolvimento para a Internet - Aula 04
Desenvolvimento para a Internet - Aula 04
 
Html
HtmlHtml
Html
 
Html
HtmlHtml
Html
 
Html básico 3 links
Html básico 3   linksHtml básico 3   links
Html básico 3 links
 
Aula1web html
Aula1web htmlAula1web html
Aula1web html
 
Html5 Aula 6
Html5 Aula 6Html5 Aula 6
Html5 Aula 6
 
HTML - Guia 1 e 2
HTML - Guia 1 e 2HTML - Guia 1 e 2
HTML - Guia 1 e 2
 
Manual curso php
Manual curso phpManual curso php
Manual curso php
 
Manual curso php
Manual curso phpManual curso php
Manual curso php
 
Curso de Desenvolvimento de Sistemas Web - (X)HTML
Curso de Desenvolvimento de Sistemas Web - (X)HTMLCurso de Desenvolvimento de Sistemas Web - (X)HTML
Curso de Desenvolvimento de Sistemas Web - (X)HTML
 
Portifolio net
Portifolio netPortifolio net
Portifolio net
 
Html 02
Html 02Html 02
Html 02
 
Introdução ao HTML 5 do Básico ao avançado
Introdução ao HTML 5 do Básico ao avançadoIntrodução ao HTML 5 do Básico ao avançado
Introdução ao HTML 5 do Básico ao avançado
 

Dernier

6ano variação linguística ensino fundamental.pptx
6ano variação linguística ensino fundamental.pptx6ano variação linguística ensino fundamental.pptx
6ano variação linguística ensino fundamental.pptxJssicaCassiano2
 
O desenvolvimento é um conceito mais amplo, pode ter um contexto biológico ou...
O desenvolvimento é um conceito mais amplo, pode ter um contexto biológico ou...O desenvolvimento é um conceito mais amplo, pode ter um contexto biológico ou...
O desenvolvimento é um conceito mais amplo, pode ter um contexto biológico ou...azulassessoria9
 
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...PatriciaCaetano18
 
19- Pedagogia (60 mapas mentais) - Amostra.pdf
19- Pedagogia (60 mapas mentais) - Amostra.pdf19- Pedagogia (60 mapas mentais) - Amostra.pdf
19- Pedagogia (60 mapas mentais) - Amostra.pdfmarlene54545
 
LENDA DA MANDIOCA - leitura e interpretação
LENDA DA MANDIOCA - leitura e interpretaçãoLENDA DA MANDIOCA - leitura e interpretação
LENDA DA MANDIOCA - leitura e interpretaçãoLidianePaulaValezi
 
Pesquisa Ação René Barbier Livro acadêmico
Pesquisa Ação René Barbier Livro  acadêmicoPesquisa Ação René Barbier Livro  acadêmico
Pesquisa Ação René Barbier Livro acadêmicolourivalcaburite
 
Slides 9º ano 2024.pptx- Geografia - exercicios
Slides 9º ano 2024.pptx- Geografia - exerciciosSlides 9º ano 2024.pptx- Geografia - exercicios
Slides 9º ano 2024.pptx- Geografia - exerciciosGentil Eronides
 
P P P 2024 - *CIEJA Santana / Tucuruvi*
P P P 2024  - *CIEJA Santana / Tucuruvi*P P P 2024  - *CIEJA Santana / Tucuruvi*
P P P 2024 - *CIEJA Santana / Tucuruvi*Viviane Moreiras
 
Apresentação | Símbolos e Valores da União Europeia
Apresentação | Símbolos e Valores da União EuropeiaApresentação | Símbolos e Valores da União Europeia
Apresentação | Símbolos e Valores da União EuropeiaCentro Jacques Delors
 
MESTRES DA CULTURA DE ASSARÉ Prof. Francisco Leite.pdf
MESTRES DA CULTURA DE ASSARÉ Prof. Francisco Leite.pdfMESTRES DA CULTURA DE ASSARÉ Prof. Francisco Leite.pdf
MESTRES DA CULTURA DE ASSARÉ Prof. Francisco Leite.pdfprofesfrancleite
 
Monoteísmo, Politeísmo, Panteísmo 7 ANO2.pptx
Monoteísmo, Politeísmo, Panteísmo 7 ANO2.pptxMonoteísmo, Politeísmo, Panteísmo 7 ANO2.pptx
Monoteísmo, Politeísmo, Panteísmo 7 ANO2.pptxFlviaGomes64
 
3 2 - termos-integrantes-da-oracao-.pptx
3 2 - termos-integrantes-da-oracao-.pptx3 2 - termos-integrantes-da-oracao-.pptx
3 2 - termos-integrantes-da-oracao-.pptxMarlene Cunhada
 
E a chuva ... (Livro pedagógico para ser usado na educação infantil e trabal...
E a chuva ...  (Livro pedagógico para ser usado na educação infantil e trabal...E a chuva ...  (Livro pedagógico para ser usado na educação infantil e trabal...
E a chuva ... (Livro pedagógico para ser usado na educação infantil e trabal...andreiavys
 
Currículo - Ícaro Kleisson - Tutor acadêmico.pdf
Currículo - Ícaro Kleisson - Tutor acadêmico.pdfCurrículo - Ícaro Kleisson - Tutor acadêmico.pdf
Currículo - Ícaro Kleisson - Tutor acadêmico.pdfTutor de matemática Ícaro
 
Expansão Marítima- Descobrimentos Portugueses século XV
Expansão Marítima- Descobrimentos Portugueses século XVExpansão Marítima- Descobrimentos Portugueses século XV
Expansão Marítima- Descobrimentos Portugueses século XVlenapinto
 
Sistema articular aula 4 (1).pdf articulações e junturas
Sistema articular aula 4 (1).pdf articulações e junturasSistema articular aula 4 (1).pdf articulações e junturas
Sistema articular aula 4 (1).pdf articulações e junturasrfmbrandao
 
Os editoriais, reportagens e entrevistas.pptx
Os editoriais, reportagens e entrevistas.pptxOs editoriais, reportagens e entrevistas.pptx
Os editoriais, reportagens e entrevistas.pptxTailsonSantos1
 
M0 Atendimento – Definição, Importância .pptx
M0 Atendimento – Definição, Importância .pptxM0 Atendimento – Definição, Importância .pptx
M0 Atendimento – Definição, Importância .pptxJustinoTeixeira1
 
Sopa de letras | Dia da Europa 2024 (nível 2)
Sopa de letras | Dia da Europa 2024 (nível 2)Sopa de letras | Dia da Europa 2024 (nível 2)
Sopa de letras | Dia da Europa 2024 (nível 2)Centro Jacques Delors
 

Dernier (20)

6ano variação linguística ensino fundamental.pptx
6ano variação linguística ensino fundamental.pptx6ano variação linguística ensino fundamental.pptx
6ano variação linguística ensino fundamental.pptx
 
O desenvolvimento é um conceito mais amplo, pode ter um contexto biológico ou...
O desenvolvimento é um conceito mais amplo, pode ter um contexto biológico ou...O desenvolvimento é um conceito mais amplo, pode ter um contexto biológico ou...
O desenvolvimento é um conceito mais amplo, pode ter um contexto biológico ou...
 
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
A EDUCAÇÃO FÍSICA NO NOVO ENSINO MÉDIO: IMPLICAÇÕES E TENDÊNCIAS PROMOVIDAS P...
 
19- Pedagogia (60 mapas mentais) - Amostra.pdf
19- Pedagogia (60 mapas mentais) - Amostra.pdf19- Pedagogia (60 mapas mentais) - Amostra.pdf
19- Pedagogia (60 mapas mentais) - Amostra.pdf
 
LENDA DA MANDIOCA - leitura e interpretação
LENDA DA MANDIOCA - leitura e interpretaçãoLENDA DA MANDIOCA - leitura e interpretação
LENDA DA MANDIOCA - leitura e interpretação
 
Pesquisa Ação René Barbier Livro acadêmico
Pesquisa Ação René Barbier Livro  acadêmicoPesquisa Ação René Barbier Livro  acadêmico
Pesquisa Ação René Barbier Livro acadêmico
 
Slides 9º ano 2024.pptx- Geografia - exercicios
Slides 9º ano 2024.pptx- Geografia - exerciciosSlides 9º ano 2024.pptx- Geografia - exercicios
Slides 9º ano 2024.pptx- Geografia - exercicios
 
P P P 2024 - *CIEJA Santana / Tucuruvi*
P P P 2024  - *CIEJA Santana / Tucuruvi*P P P 2024  - *CIEJA Santana / Tucuruvi*
P P P 2024 - *CIEJA Santana / Tucuruvi*
 
Apresentação | Símbolos e Valores da União Europeia
Apresentação | Símbolos e Valores da União EuropeiaApresentação | Símbolos e Valores da União Europeia
Apresentação | Símbolos e Valores da União Europeia
 
MESTRES DA CULTURA DE ASSARÉ Prof. Francisco Leite.pdf
MESTRES DA CULTURA DE ASSARÉ Prof. Francisco Leite.pdfMESTRES DA CULTURA DE ASSARÉ Prof. Francisco Leite.pdf
MESTRES DA CULTURA DE ASSARÉ Prof. Francisco Leite.pdf
 
Monoteísmo, Politeísmo, Panteísmo 7 ANO2.pptx
Monoteísmo, Politeísmo, Panteísmo 7 ANO2.pptxMonoteísmo, Politeísmo, Panteísmo 7 ANO2.pptx
Monoteísmo, Politeísmo, Panteísmo 7 ANO2.pptx
 
Novena de Pentecostes com textos de São João Eudes
Novena de Pentecostes com textos de São João EudesNovena de Pentecostes com textos de São João Eudes
Novena de Pentecostes com textos de São João Eudes
 
3 2 - termos-integrantes-da-oracao-.pptx
3 2 - termos-integrantes-da-oracao-.pptx3 2 - termos-integrantes-da-oracao-.pptx
3 2 - termos-integrantes-da-oracao-.pptx
 
E a chuva ... (Livro pedagógico para ser usado na educação infantil e trabal...
E a chuva ...  (Livro pedagógico para ser usado na educação infantil e trabal...E a chuva ...  (Livro pedagógico para ser usado na educação infantil e trabal...
E a chuva ... (Livro pedagógico para ser usado na educação infantil e trabal...
 
Currículo - Ícaro Kleisson - Tutor acadêmico.pdf
Currículo - Ícaro Kleisson - Tutor acadêmico.pdfCurrículo - Ícaro Kleisson - Tutor acadêmico.pdf
Currículo - Ícaro Kleisson - Tutor acadêmico.pdf
 
Expansão Marítima- Descobrimentos Portugueses século XV
Expansão Marítima- Descobrimentos Portugueses século XVExpansão Marítima- Descobrimentos Portugueses século XV
Expansão Marítima- Descobrimentos Portugueses século XV
 
Sistema articular aula 4 (1).pdf articulações e junturas
Sistema articular aula 4 (1).pdf articulações e junturasSistema articular aula 4 (1).pdf articulações e junturas
Sistema articular aula 4 (1).pdf articulações e junturas
 
Os editoriais, reportagens e entrevistas.pptx
Os editoriais, reportagens e entrevistas.pptxOs editoriais, reportagens e entrevistas.pptx
Os editoriais, reportagens e entrevistas.pptx
 
M0 Atendimento – Definição, Importância .pptx
M0 Atendimento – Definição, Importância .pptxM0 Atendimento – Definição, Importância .pptx
M0 Atendimento – Definição, Importância .pptx
 
Sopa de letras | Dia da Europa 2024 (nível 2)
Sopa de letras | Dia da Europa 2024 (nível 2)Sopa de letras | Dia da Europa 2024 (nível 2)
Sopa de letras | Dia da Europa 2024 (nível 2)
 

Link

  • 2. Com HTML é possível fazermos ligações de uma região de texto (ou imagem) a um outro documento (ou a outra parte do próprio documento). Você já deve ter visto em alguma página internet exemplos dessas ligações: o browser destaca essas regiões e imagens do texto, indicando que são ligações de hipertexto também chamadas hypertext links ou hiperlinks ou simplesmente links, onde normalmente, o mouse vira uma “mãozinha” e ao clicar “chamamos” (abrimos) um outro documento, página web ou figura por exemplo.
  • 3. Para inserir um link em um documento, utilizamos a etiqueta <A>, da seguinte forma: <A HREF = "arquivo_destino"> âncora </A> Onde: arquivo_destino: é o endereço do documento de destino, da página ou imagem a qual queremos abrir. âncora: é o texto ou imagem que servirá de ligação hipertexto do documento sendo apresentado para o documento de destino.
  • 4. Atributos: <A> tem vários atributos que são utilizados de acordo com a ação associada ao link. Os mais usados são apresentados a seguir: HREF: Indica o arquivo de destino da ligação de hipertexto. TARGET: Indica o frame em que será carregado o arquivo_destino. Maiores detalhes na seção sobre frames. NAME: Marca um indicador, isto é, uma região de um documento como destino de uma ligação. Maiores detalhes na seção sobre indicadores.
  • 5. Caminhos (uso de Links) Os links podem estar indicados como caminhos relativos ou absolutos.
  • 6. Caminho Relativo: O caminho relativo pode ser usado sempre que queremos fazer referência a um documento armazenado no mesmo servidor do documento atual. Através do campo de endereços do browser, é possível identificar se um documento (página) que está sendo visualizado está dentro de algum diretório (pasta). Como por exemplo se estivermos em um browser acessando a página da FACCAT e vemos o seguinte endereço: http://www.faccat.br/apostilas/apostila_de_informatica.html. O que podemos concluir é que o documento que está sendo visualizado no momento, chamado apostila_de_informatica.html, está localizado dentro de um diretório (pasta) chamado apostilas do servidor www.faccat.br.
  • 7. Caminho Relativo: Então para escrevermos por exemplo um link deste documento (apostila_de_informatica.html) para um documento chamado doc.html que está localizado no diretório Apostilas/documentos/ do mesmo servidor www.faccat.br, tudo que precisamos fazer é escrever: <A HREF="documentos/doc.html"> Exemplo de Caminho Relativo </A> Para usar links com caminhos relativos é preciso, portanto, conhecer a estrutura do diretório do servidor no qual estamos trabalhando, pois devemos indicar todo o caminho onde está o documento no qual estamos nos referindo no link. Quando há alguma dúvida, o melhor é usar o caminho absoluto.
  • 8. Caminho Absoluto : Utilizamos o caminho absoluto quando desejamos referenciar um documento que esteja em outro servidor, por exemplo: <A HREF="http://www.faccat.br"> FACCAT - Faculdades de Taquara </A> Que oferece um link FACCAT - Faculdades de Taquara que ao ser clicado com o mouse abrirá a página cujo endereço é http://www.faccat.br. Com a mesma sintaxe, é possível escrever links para qualquer servidor de informações da Internet.
  • 9. Indicadores (uso de Links) : Como foi dito anteriormente, o atributo NAME permite indicar um trecho de documento como ponto de chegada de uma ligação hipertexto. A formatação: <A NAME="inicio"> Indicadores (uso de links) </A> faz com que a âncora Indicadores (uso de links) seja o destino de um link. Se escrevermos: <A HREF="#inicio"> Topo do Documento </A> teremos uma ligação hipertexto para um trecho deste mesmo documento:
  • 10. Posso criar link para mais alguma coisa? : Você pode criar link para um endereço de e-mail. Isto é feito de modo semelhante aos links para documentos. <a href="mailto:nobody@html.net">Enviar e-mail para nobody em HTML.net</a>
  • 11. Posso criar link para mais alguma coisa? : Você pode criar link para um endereço de e-mail. Isto é feito de modo semelhante aos links para documentos. <a href="mailto:nobody@html.net">Enviar e-mail para nobody em HTML.net</a>