Como criar e usar âncoras

Melhores Práticas > Passo 3 - Criação da página >

Como criar e usar âncoras

Previous pageReturn to chapter overviewNext page
Exibir/Ocultar o texto oculto

Uma âncora é uma referência para identificar a posição de um objeto em uma página: elas são usadas para estabelecer links diretamente para o objeto a partir de qualquer ponto do website.

Não há limite para a quantidade de âncoras que você pode adicionar a uma página: teoricamente há uma âncora por objeto. Para simplificar seu trabalho, aconselhamos colocar uma âncora em um objeto somente se for estritamente necessário, e dar nomes às âncoras para poder identificá-las mais facilmente.

Clique para expandir/recolherComo criar links internos para páginas usando as âncoras

Com frequência é útil estabelecer links que evidenciam elementos específicos ao rolar a página: você pode querer escrever um breve resumo no começo de uma página com links que levam o visitante diretamente ao parágrafo que o interessa.

 

 

No Passo 3 - Criação da página crie as páginas, inserindo todos os objetos que precisar para completar o conteúdo da página: insira um objeto texto no início para seu resumo, e então outros objetos texto para cada parágrafo para o qual desejar criar um link.
Na tabela de layout de página, selecione o Objeto Texto do primeiro parágrafo e clique no botão para dar uma âncora a ele: de um nome à âncora na janela que se abre.
Faça o mesmo para cada Objeto Texto  que tiver inserido, certificando-se que os nomes das âncoras são claros.
Dê um duplo clique no Objeto Texto do resumo de introdução para abrir o editor.  
Selecione o primeiro item no resumo e clique no botão para abrir a janela Link: selecione a opção Página do site e use o botão para exibir o Mapa do site e selecionar a página em que irá trabalhar. Clique no campo Âncora interna na página para exibir todas as âncoras disponíveis e selecione a que identifica o conteúdo correspondente ao item do resumo.
Repita esta operação para todos os outros ítens do resumo para os quais deseja criar um link.

Você pode melhorar a navegabilidade para os visitantes adicionando um link no final de cada parágrafo para levá-los de volta ao início da página:

Com o botão , adicione uma âncora ao  Objeto Texto que corresponde ao resumo de introdução.
Abra o Objeto Texto no editor para editar o primeiro parágrafo e adicionar no final dele uma legenda do tipo "Voltar ao início".
Selecione o ítem "Voltar ao início" e clique no botão para criar um link com a página, certificando-se de ter indicado a âncora associada ao resumo no início.
Repita a operação para adicionar o ítem "Voltar ao início" no final de cada parágrafo.

Em vez de usar um ítem "Voltar ao início", você pode usar um botão ou adicionar uma imagem no Objeto Texto, ou usar um Objeto Imagem (neste caso, você pode usar o efeito sob cursor (mouseover)): de qualquer modo, o procedimento para criar o link é o mesmo.

Clique para expandir/recolherComo criar e gerenciar âncoras manualmente

Se você precisar colocar uma âncora dentro de um texto, e não no início, por exemplo, ao lado de um parágrafo de um Objeto Texto, poderá fazer isso de duas maneiras:

1. Divida o Objeto Texto original em dois objetos de texto separados, e coloque a âncora no segundo objeto.
2. Crie manualmente uma âncora no Objeto Texto.
Abra o Objeto Texto no editor e clique no botão para ativar o reconhecimento de código HTML.
Mova o cursor para onde você deseja posicionar a âncora e digite <A NAME="nome_ancora">&nbsp; </A>

Em vez de "nome_ancora", você deverá escrever o nome que realmente deseja dar à âncora. No exemplo,  "&nbsp;" significa que um espaço em branco será adicionado logo após a tag <anchor_name> para que o nome que você deu a ela fique claro.

Quando criar um link para uma âncora, você deve se lembrar que âncoras criadas manualmente não serão incluídas na lista exibida pela opção Âncora interna na página. Portanto você deverá proceder da seguinte maneira:

Na janela Link, selecione Arquivo ou URL.
No campo Arquivo na internet, digite #nome_ancora onde você digitará o nome que você realmente quer ver no lugar de nome_ancora.