noções básicas Camila Fiori

Como criar links para um ponto da sua postagem

Como criar links dentro da postagemVocê sabia que é possível criar links que apontem para um determinado ponto de uma postagem de seu blog?

É um recurso bastante útil quando você quer indicar um trecho específico do texto, sem que o leitor precise procurá-lo.

Também é útil se você vai escrever um artigo muito extenso e quer facilitar a navegação do leitor.

Veja como é simples utilizar o recurso.

Mas antes de continuar no artigo, se tem um blog recomendo que veja este vídeo que fiz muito importante. Trata-se de como abaixar a taxa de rejeição de blogs:

[Ads2Cash video=”https://www.youtube.com/watch?v=pp6sK4IXP74″]

 

Introdução

Quem me apresentou este recurso no Blogger foi o Prof. Edigley Alexandre.

Ele o usou aqui mesmo no Gerenciando Blog, no artigo Como criar uma caixa de busca com o ‘Google pesquisa personalizada’ que ele escreveu.

No item “Índice de passos a seguir”, ele criou links para cada parte do texto, tornando mais simples ir até um ponto específico.

Quer entender melhor?

Clique AQUI para ir ao final do artigo.

Percebeu como ele funciona?

Na verdade, trata-se de um recurso bastante antigo de HTML, mas que é pouco utilizado em blogs.

O único ponto em que o vejo sendo mais utilizando é em botões para voltar ao início do blog.

Mas, como eu disse no início, ele pode ser muito útil dentro das postagens para facilitar a vida do seu leitor.

São necessários dois passos para utilizá-lo (e você pode clicar nos títulos para ir direto a cada item):

1. Marcar os pontos para onde os links apontarão

2. Criar os links apontando para o ponto desejado

Abaixo, você verá em detalhes como fazer isso.

 

1. Marcar os pontos para onde os links apontarão

O primeiro passo é marcar o ponto para onde o link apontará.

Uma dificuldade é que nem o editor do Blogger e nem o Windows Live Writer permitem criar essa marcação de forma automática, sendo necessário editar o HTML para colocar manualmente o código. Mas, ele é bem simples.

Vendo o código HTML, o ponto para onde o link apontará deve ficar como no exemplo abaixo:

<a name=”introducao”>Introdução</a>

  • O texto marcado em azul não será exibido em sua página e deve ser diferente em cada ponto para onde haverá um link apontando.
  • O texto em vermelho é o trecho que será exibido em sua página nesse ponto. Ele pode ser um subtítulo ou simplesmente uma palavra dentro da postagem.

Utilizando como exemplo o subtítulo deste trecho que você está lendo, ele ficou assim:

<h2 align=”justify”><a name=”marcarpontos”>1. Marcar os pontos para onde os links apontarão</a> </h2>

Você deve fazer isso em todos os pontos para onde os links apontarão.

 

2. Criar os links apontando para o ponto desejado

O segundo passo é criar o link que apontará para o ponto desejado de sua postagem.

Este é mais simples de ser feito no Windows Live Writer, pois ele já oferece essa funcionalidade.

 

No Blogger, é necessário um ajuste manual.

Para fazer isso, basta fazer como um link normal: selecione o trecho do texto que se transformará em link e clique no botão de link (ou pressione a combinação CTRL+K).

Será aberta a janela para configuração do link.

Como exemplo, vamos criar um link com o texto “Ir para a Introdução”, apontando para o local que criamos no item anterior.

Em vez de digitar o endereço para onde o link apontará, você deve preencher apenas #introducao.

Outro ponto importante é que a caixa que indica que o link será aberto em uma nova janela deve ficar desmarcada.

a) Windows Live Writer

Como criar links dentro da postagem - Windows Live Writer

No Windows Live Writer, o link será criado corretamente, e ficará como abaixo:

<a href=”#introducao”>Ir para a Introdução</a>

 

b) Editor do Blogger

Como criar links dentro da postagem - Editor do Blogger

No Blogger, você precisará ir ao HTML e corrigir o link. Ele estará criado como abaixo e você precisará remover o trecho marcado em vermelho.

<a href=”http:/#introducao”>Ir para a Introdução</a>

IMPORTANTE: Você deve deixar essa correção para ser feita somente após terminar sua postagem. Isso é necessário porque, se você voltar para o modo “Escrever” do editor, ele fará uma bagunça com o seu código.

Por isso, você deve corrigir todos os links de uma vez e já clicar em “Publicar”, para evitar que o código seja alterado.

c) Criando links para pontos específicos de outras postagens

Os links também podem ser criados para pontos de outras postagens.

Veja um exemplo ao clicar em Visualização, em que você será levado a esse item dentro de outro artigo.

A única diferença é que você deve indicar como link o endereço da página e o ponto para onde você deseja apontar.

Neste exemplo, o link é:

https://www.gerenciandoblog.com.br/2013/03/como-criar-google-pesquisa-personalizada.html#Visualização

 

Conclusão

Embora seja um recurso simples, ele é um pouco chato de usar devido às limitações dos editores.

Mas, com um pouco de cuidado e paciência, é possível utilizá-lo sem grandes dificuldades.

Ele pode ser um diferencial importante para seus leitores!

E você, já conhecia este recurso?

Já o utilizou alguma vez em seu blog?

Deixe sua opinião em um comentário!

Clique AQUI para voltar à Introdução.

 

Sobre o autor | Website

Apaixonada por comunicação. Formada em Jornalismo e blogueira por Hobbie. Atual responsável por este e vários outros blogs de Internet Marketing.

Para enviar seu comentário, preencha os campos abaixo:

Deixe uma resposta

*

32 Comentários

  1. Guilherme Monteiro disse:

    Super obrigado pelo artigo Adelson, será muito útil para mim 🙂

  2. Josimar Estérquile disse:

    Olá Adelson!

    Gostei desse recurso, já tinha visto em alguns sites mas não sabia como fazer.
    Vou começar a utilizá-lo. Obrigado por compartilhar mais essa informação, e como sempre tudo bem explicado.

    Abraços!

    • Adriano Luz disse:

      Olá, Josimar!

      Esse é mesmo um recurso bastante utilizado em sites. Nos blogs, também acredito que possa ser muito útil!

      Um abraço!

  3. Melissa Bergonso disse:

    Oi, Adelson!

    Gostei deste post!! Faz muito tempo que eu queria saber como se fazia este tipo de linkagem. Já cheguei a usar algo parecido logo do início do meu blog que até funcionava, mas depois perdeu a funcionalidade não sei por quê. Agora, finalmente, posso voltar a utilizar este recurso! Obrigada pelo tutorial!

    Um abraço!

    • Adriano Luz disse:

      Olá, Melissa!

      Se você já utilizava esses links, sabe bem como eles podem ser úteis para o seu blog. Espero que consiga voltar a utilizá-los agora.

      Um abraço!

  4. Matheus disse:

    Olá Adelson,

    Nossa, esse recurso de âncora eu usava muito, antigamente. É bastante útil para criar uma melhor navegação nos artigos ou no próprio site.

    Principalmente quando se vai fazer algum texto informativo longo, não necessariamente para web.

    Apenas uma coisa a acrescentar, eu colocaria o nofollow nos links para âncoras.

    Abraço e muito sucesso à você!

    • Adriano Luz disse:

      Olá, Matheus!

      Que bom vê-lo por aqui! 🙂

      Você tem razão: os links assim tornam muito mais simples para navegar entre os diversos pontos do site ou blog. Eu mesmo peco em não utilizá-los mais em meus artigos.

      Eu não havia pensado na questão do nofollow. Pensando em termos de SEO, faz sentido para não desperdiçar o "link juice".

      Um abraço e obrigado pela colaboração!

  5. Edigley Alexandre disse:

    Olá, Adelson!

    Muito obrigado por me citar em seu artigo. Eu nem lembrava mais desta sugestão que tinha lhe passado (risos). O artigo ficou bem didático e qualquer um poderá implementar esse recurso em seu blog, dependendo da sua funcionalidade.

    Abraço!

    • Adriano Luz disse:

      Olá, Edigley!

      Este estava em minha lista de artigos a escrever desde que você me mostrou este recurso! 🙂 Acredito que muitos o desconheçam e gostarão muito das possibilidades que ele abre.

      Um abraço!

  6. João Vítor Dias disse:

    Aulinha basica de html para os leigos haha. Excelente artigo Adelson!

    Estava sentindo falta dos códigos por aqui.

    Abraços,
    João Vítor Dias

    • Adriano Luz disse:

      Olá, João!

      Realmente, é um conceito bem básico de HTML, mas que vejo ser pouco utilizado em blogs. Espero que seja útil!

      Um abraço!

  7. Isaias Md disse:

    Muito bom, Adelson. Como pretendo escrever um blog de textos relativamente longos, este recurso poderá vir a ser bastante útil.

  8. Anônimo disse:

    Amigo, por favor! Preciso urgentemente saber: se eu colocar meu link em todas as imagens de meu blog, ele seria visto como Spam ou técnicas blackhat. Me desculpe, é que eu não aguento mais! Meu blog quando faz 5000 por dia o Google me derruba e passa a fazer 300 ou 100 visitas diárias. Depois de três meses, o blog volta a fazer 5000 visitas diárias e dois dias depois, as mesma caem. Por isso, essa duvida.

    Vou ficar aqui nesse artigo esperando uma resposta sua. Obrigado

  9. Anônimo disse:

    Obrigado! Mas posso lhe fornecer diversos links de sites todos bagunçados com textos copiados e que estão com seu PageRank "4" e mais ou menos 900 online dia. Te digo também que todos estão assim desde o (Panda) e não mudaram em nada e, com certeza, já chamaram a atenção do pessoal do Google com suas altas visitas.

    Obrigado e sem fui fã de seu site. Você parece ser uma pessoa honesta disposta a ajudar…

    • Adriano Luz disse:

      Olá!

      O PageRank dos sites e blogs não é alterado quando é feita uma atualização do algoritmo do Google, como o Panda e o Hummingbird. Além disso, faz muitos meses que o Google não realiza mais a atualização do PR. Por isso, ele não é um medidor confiável.

      Quanto ao alto número de visitas, também é difícil saber se elas vêm do Google ou de outras fontes.

      Mas, o que você pode fazer é se preocupar em organizar o seu blog e seguir todas as orientações de qualidade do Google. É a única forma confiável de recuperar gradativamente suas visitas.

      Um abraço!

  10. Anônimo disse:

    Muito obrigado galera, muito útil a informação!
    Vlwwwww!

  11. Anônimo disse:

    Olá Adelson,
    Sua metodologia e linguagem de apresentação, foram fundamentais para me colocar no caminho de uma nova aprendizagem.
    Valeu!
    Simone

    • Adriano Luz disse:

      Olá, Simone!

      Que ótimo saber que você gostou do estilo da postagem! Espero que encontre outros artigos úteis para o seu blog aqui.

      Um abraço!

  12. Anônimo disse:

    Olá Adelson
    Por favor eu gostaria de saber o seguinte, como faço para que o leitor clique no link de minha postagem exemplo http://loiradobem.blogspot.com.br/2014/09/pitaco-musica-lollapalooza-2015-robert.html e abra diretamente nela..não ocorre isso no blog, tem que rolar a seta da direita… obrigada e aguardo retorno, Loira Dobem.

  13. Luciano disse:

    Valeu Adelson. Muito bem explicada a sua dica. Vou usar no meu blog logo mais.Parabéns pelo trabalho. Abraço.

  14. Jairo disse:

    O bug da edição no Blogger é fácil de ser corrigido. Deu certo para mim. Primeiro a postagem precisa ser publicada para ter um endereço fixo. Depois, com o endereço (as tags estão abertas para que eu consiga postas aqui nos comentários):

    Troque o
    a name="introducao">Introdução
    por
    a href="http://enderecodoblog.blogspot.com/postagem#&quot; name="introducao">Introdução
    (não se esqueça do #)

    e

    a href="#introducao">
    por
    a href="http://enderecodoblog.blogspot.com/postagem#introducao">Introdução

    Essa informação poderia ser inserida na postagem, ajudaria quem tem o mesmo problema.

    Obrigado pela postagem!

  15. Amenis.f.joa disse:

    Não sou entendido nesta área ! mas sou curioso. Achei super importante suas explicações,concisa , fácil a todos e gostei ,virei seu fá .Obrigado

  16. Elsa Suraya disse:

    OLA ANDERSON

    ESTOU ÓTIMA ESPERO QUE TU TAMBÉM. BJS E UM ABRAÇO

  17. Alex disse:

    Muito bom gostei.

  18. José Eliseu disse:

    Muito obrigado! muito bem explicado! ajudou bastante.

  19. antonio lopes bezerra Bezerra disse:

    Oi gostei bastante de seu artigo,escrevo em um site familiasim.com,br e não aprendi ainda esse recurso, mas vou ler seu artigo várias vezes e com certeza vai me trazer retorno.
    Um abraço, Bezerra

  20. Andre disse:

    Achei muito interessante o artigo, vou ver como colocar no meu blog.

  21. Simone disse:

    Olá! Tem algum plug in que fazer hiper link dentro do texto, automaticamente indicando para outro post?
    Exemplo:

    meu texto começa.

    AAAAAAAAA

    Link ( vc também pode se interessar por:xxxx )

    AAAAAAA ( continuação do texto )

Por gentileza, se deseja alterar o arquivo do rodapé,
entre em contato com o suporte.