Aprenda a configurar a navegação entre páginas da Web. Vincule arquivos e documentos, atualize, altere e teste links no Dreamweaver.

Antes de criar um link, você deve entender como funcionam caminhos absolutos, relativos a documentos e relativos à raiz do site. Você pode criar vários tipos de links em um documento:

  • Um link para outro documento ou para um arquivo, como um arquivo gráfico, de filme, PDF ou de som.

  • Um link de âncora nomeado, que salta para um local específico em um documento.

  • Um link de email, que cria uma nova mensagem de email em branco com o endereço do destinatário já preenchido.

  • Links nulos e de script, usados para anexar comportamentos a um objeto ou para criar um link que executa o código JavaScript.

Você pode usar o Inspetor de propriedades e o ícone Apontar para arquivo para criar links de uma imagem, objeto ou texto para outro documento ou arquivo.

O Dreamweaver cria os links para outras páginas em seu site usando caminhos relativos a documentos. Você também pode configurar o Dreamweaver para criar novos links usando caminhos da raiz do site.

Observação:

Sempre salve um novo arquivo antes de criar um caminho relativo a documentos; esse tipo de caminho não é válido sem um ponto inicial definido. Se você criar um caminho relativo a documentos antes de salvar o arquivo, o Dreamweaver usará temporariamente um caminho absoluto começando com arquivo:// até o arquivo ser salvo; depois que o arquivo for salvo, o Dreamweaver converterá o caminho arquivo:// em um caminho relativo.

Você pode anexar um comportamento a qualquer link de um documento. Avalie a possibilidade de usar os seguintes comportamentos ao inserir elementos vinculados em documentos:

Definir texto da barra de status

Determina o texto de uma mensagem e o exibe na barra de status, no canto inferior esquerdo da janela do navegador. Por exemplo, você pode usar esse comportamento para descrever o destino de um link na barra de status em vez de mostrar o URL associado.

Abrir janela do navegador

Abre um URL em uma nova janela. Você pode especificar as propriedades da nova janela, incluindo o nome, o tamanho e seus atributos (se pode ser redimensionada, se tem uma barra de menus, etc.).

Menu de salto

Edita um menu de salto. Você pode alterar a lista de menus, especificar um arquivo vinculado diferente ou alterar o local do navegador no qual o documento vinculado é aberto.

Você pode usar o ícone de pasta do Inspetor de propriedades ou a caixa Link para criar links de uma imagem, objeto ou texto para outro documento ou arquivo.

  1. Selecione texto ou uma imagem na Visualização de design da janela Documento.
  2. Abra o Inspetor de propriedades (Janela > Propriedades) e execute um dos procedimentos a seguir:
    • Clique no ícone de pasta à direita da caixa Link para navegar até um arquivo e selecioná-lo.

      O caminho até o documento vinculado aparece na caixa URL. Use o menu pop-up Em relação a na caixa de diálogo Selecionar arquivo para escolher o tipo de caminho (em relação ao documento ou à raiz) e clique em OK. O tipo de caminho selecionado é aplicado somente no link atual. (Você pode alterar a configuração padrão da caixa Em relação a para o site.)

    • Digite o caminho e o nome de arquivo do documento na caixa Link.

      Para vincular-se a um documento do seu site, insira um caminho relativo a um documento ou à raiz do site. Para vincular-se a um documento externo ao seu site, insira um caminho absoluto incluindo o protocolo (como http://). Você pode usar essa abordagem para inserir um link para um arquivo que ainda não foi criado.

  3. Na lista suspensa Destino, selecione um local no qual o documento será aberto:

    • _blank carrega o documento vinculado em uma nova janela do navegador não nomeada.
    • _parent carrega o documento vinculado no quadro pai ou na janela pai do quadro que contém o link. Se o quadro que contém o link não estiver aninhado, o documento vinculado será carregado na janela completa do navegador.
    • _self carrega o documento vinculado no mesmo quadro ou janela do link. Esse destino é o padrão, normalmente não é necessário especificá-lo.
    • _top carrega o documento vinculado na janela completa do navegador, removendo todos os quadros.
    • _new carrega o arquivo vinculado em uma nova janela.
  1. Selecione texto ou uma imagem na Visualização de design da janela Documento.
  2. Siga um dos dois procedimentos abaixo para criar um link:
    • Arraste o ícone Apontar para arquivo (ícone de destino) à direita da caixa Link no Inspetor de propriedades e aponte para uma âncora visível no documento atual, uma âncora visível em outro documento aberto, um elemento que tenha uma ID exclusiva atribuída a ele ou um documento no painel Arquivos.

    • Arraste a partir da seleção feita com Shift e aponte para uma âncora visível no documento atual, uma âncora visível em outro documento aberto, um elemento que tenha uma ID exclusiva atribuída a ele ou um documento no painel Arquivos.

    Observação:

    é possível vincular outro documento aberto somente se os documentos não estiverem maximizados na janela Documento. Para dispor os documentos lado a lado, selecione Janela > Organizar > Em cascata ou Janela > Organizar > Lado a lado. Ao apontar para um documento aberto, esse documento vai para o primeiro plano da tela enquanto você seleciona suas opções.

O comando Hiperlink permite criar um link de texto para uma imagem, objeto ou outro documento ou arquivo.

  1. Coloque o ponto de inserção no documento onde você deseja que o link seja exibido.
  2. Siga um destes procedimentos para exibir a caixa de diálogo Hiperlink:

    • Selecione Inserir > Hiperlink.

    • Na categoria Comum do painel Inserir, clique no botão Hiperlink.

  3. No campo Texto, insira o texto do link.
    No menu suspenso Link, selecione o nome do arquivo que você deseja vincular. Também é possível clicar no ícone de pasta para navegar até o arquivo que você deseja vincular.

  4. No menu pop-up Destino, selecione a janela na qual o arquivo deve ser aberto ou digite seu nome.

    Os nomes de todos os quadros nomeados no documento atual aparecem na lista pop-up. Se você especificar um quadro que não existe, a página vinculada será aberta em uma nova janela que tem o nome especificado. Você também pode selecionar um dos seguintes nomes de destino reservados:

    • _blank carrega o arquivo vinculado em uma nova janela do navegador não nomeada.
    • _parent carrega o arquivo vinculado no conjunto de molduras pai ou na janela do quadro que contém o link. Se o quadro que contém o link não estiver aninhado, o arquivo vinculado será carregado na janela de navegador em tamanho integral.
    • _self carrega o arquivo vinculado no mesmo quadro ou janela do link. Esse destino é o padrão, normalmente não é necessário especificá-lo.
    • _top carrega o arquivo vinculado na janela de navegador em tamanho integral, removendo todos os quadros.
    • _new carrega o arquivo vinculado em uma nova janela.
  5. Na caixa de Índice de guias, insira um número para a ordem de guias.
  6. Na caixa Título, insira um título para o link.
  7. Na caixa Chave de acesso, insira um equivalente do teclado (uma letra) para selecionar o link no navegador.
  8. Clique em OK.

Por padrão, o Dreamweaver cria os links para outras páginas em seu site usando caminhos relativos a documentos. Para usar o caminho relativo à raiz do site, defina primeiro uma pasta local no Dreamweaver escolhendo uma pasta raiz local para servir como o equivalente da raiz do documento em um servidor. O Dreamweaver usa essa pasta para determinar os caminhos relativos à raiz do site para arquivos.

  1. Selecione Site > Gerenciar sites.
  2. Na caixa de diálogo Gerenciar sites, clique duas vezes no seu site na lista.
  3. Na caixa de diálogo Configuração de site, expanda as Configurações avançadas e selecione a categoria Informações locais.
  4. Defina o caminho relativo de novos links selecionando a opção Documento ou Raiz do site.

    A alteração dessa configuração não converterá o caminho de links existentes depois de você clicar em OK. A configuração é aplicada somente a novos links criados com o Dreamweaver.

  5. Clique em Salvar.

    A configuração do novo caminho é aplicada somente no site atual.

Você pode usar o Inspetor de propriedades para criar links para uma seção específica de um documento criando primeiro âncoras nomeadas. As âncoras nomeadas permitem definir marcadores em um documento, que normalmente são colocados em um tópico específico ou na parte superior de um documento. Em seguida, você cria links para essas âncoras nomeadas, que direcionam o visitante rapidamente para a posição especificada.

A criação de um link para uma âncora nomeada é um processo de duas etapas. Primeiro, crie uma âncora nomeada e, em seguida, crie um link para a âncora nomeada.

Criar uma âncora

  1. Na janela Documento, selecione e destaque o item que você deseja definir como uma âncora.

  2. Abra o Inspetor de propriedades e verifique se o item selecionado tem uma ID. Se o campo ID estiver vazio, adicione uma ID. Por exemplo, Âncora.

    Criar uma âncora
    Criar uma âncora

    Depois que você adicionar a ID, observe a alteração no código. id="<ID name>" é inserido no código da sua seleção.

    ID da âncora no código
    Adicionar âncoras para vinculação

  1. Na Visualização de design da janela Documento, selecione um texto ou uma imagem a partir do qual um link será criado.
  2. Na caixa Link do Inspetor de propriedades, digite um sinal de número (#) e o nome da âncora. Por exemplo, para vincular-se a uma âncora chamada “top” no documento atual, digite #top. Para vincular-se a uma âncora chamada “top” em um documento diferente da mesma pasta, digite nome_do_arquivo.html#top.

    Observação:

    os nomes de âncora diferenciam minúsculas de maiúsculas.

  1. Abra o documento que contém a âncora nomeada.

    Observação:

    Na Visualização de design, selecione Exibir > Opções de Visualização de design > Auxílios visuais > Elementos invisíveis para tornar as âncoras visíveis, caso você não as veja.

  2. Na Visualização de design da janela Documento, selecione um texto ou uma imagem a partir do qual um link será criado. (Se o link for criado a partir de outro documento aberto, é necessário alternar para ele.)
  3. Siga um destes procedimentos:
    • Clique no ícone Apontar para arquivo (ícone de destino) à direita da caixa Link no Inspetor de propriedades e arraste-o até a âncora à qual você deseja se vincular: seja uma âncora no mesmo documento ou em outro documento aberto.

    • Arraste com a tecla Shift pressionada na janela Documento desde a imagem ou o texto selecionado até a âncora desejada: seja uma âncora no mesmo documento ou em outro documento aberto.

Um link de email abre uma nova janela de mensagem em branco (usando o programa de email associado ao navegador do usuário) quando é clicado. Na janela da mensagem de email, a caixa Para é atualizada automaticamente com o endereço especificado no link de email.

  1. Na Visualização de design da janela Documento, posicione o ponto de inserção onde você deseja que o link de email seja exibido ou selecione o texto ou a imagem que será exibido como link de email.
  2. Escolha uma destas opções para inserir o link:
    • Selecione Inserir > Link de email.

    • Na categoria Comum do painel Inserir, clique no botão Link de email.

  3. Na caixa Texto, digite ou edite o corpo do email.
  4. Na caixa Email, digite o endereço de email e clique em OK.
  1. Selecione texto ou uma imagem na Visualização de design da janela Documento.
  2. Na caixa Link do Inspetor de propriedades, digite mailto: seguido por um endereço de email.

    Não digite nenhum espaço entre o sinal de dois pontos e o endereço de email.

Preenchimento automático da linha de assunto de um email

  1. Crie um link de email usando o Inspetor de propriedades como descrito acima.
  2. Na caixa Link do Inspetor de propriedades, adicione ?subject= após o email e digite um assunto após o sinal de igual. Não digite nenhum espaço entre o ponto de interrogação e o final do endereço de email.

    A entrada completa deve ser similar ao seguinte:

    mailto:someone@yoursite.com?subject=Email do seu site

Um link nulo é um link não designado. Use links nulos para anexar comportamentos em objetos ou texto em uma página. Por exemplo, você pode anexar um comportamento em um link nulo para que esse link troque uma imagem ou exiba um elemento absolutamente posicionado (elemento AP) quando o ponteiro for movido sobre o link.

Os links de script executam o código JavaScript ou chamam uma função JavaScript e são úteis para fornecer aos visitantes informações adicionais sobre um item sem que eles precisem sair da página da Web atual. Os links de script também podem ser usados para realizar cálculos, validar formulários ou executar outras tarefas de processamento quando um visitante clica em um item específico.

  1. Selecione texto, uma imagem ou um objeto na Visualização de design da janela Documento.
  2. No Inspetor de propriedades, digite javascript:; (a palavra javascript seguida por um sinal de dois pontos e por um sinal de ponto-e-vírgula) na caixa Link.
  1. Selecione texto, uma imagem ou um objeto na Visualização de design da janela Documento.
  2. Na caixa Link do Inspetor de propriedades, digite javascript: seguido por algum código ou chamada de função JavaScript. Não digite nenhum espaço entre o sinal de dois pontos e o código ou chamada.

O Dreamweaver pode atualizar links para e de um documento sempre que você mover ou renomear o documento em um site local. Esse recurso funciona melhor quando você armazena o site inteiro (ou uma seção inteira) no disco local. O Dreamweaver não altera arquivos na pasta remota até você colocar os arquivos locais nessa pasta ou verificá-los no servidor remoto.

Para agilizar o processo de atualização, o Dreamweaver pode criar um arquivo de cache para armazenar informações sobre todos os links da pasta local. O arquivo de cache é atualizado de forma invisível à medida que você adiciona, altera ou exclui links do site local.

  1. Selecione Editar > Preferências (Windows) ou Dreamweaver > Preferências (Macintosh).
  2. Na caixa de diálogo Preferências, selecione Geral na lista de categorias à esquerda.
  3. Na seção Opções do documento das preferências de Geral, selecione uma opção no menu pop-up Atualizar links ao mover arquivos.

    Sempre

    Atualiza automaticamente todos os links para e de um documento selecionado sempre que esse documento é movido ou renomeado.

    Nunca

    Não atualiza automaticamente todos os links para e de um documento selecionado quando esse documento é movido ou renomeado.

    Solicitar

    Exibe uma caixa de diálogo que lista todos os arquivos afetados pela alteração. Clique em Atualizar para atualizar os links nesses arquivos ou clique em Não atualizar para não alterar os arquivos.

  4. Clique em OK.

Criar um arquivo de cache para o site

  1. Selecione Site > Gerenciar sites.
  2. Selecione um site e clique em Editar.
  3. Na caixa de diálogo Configuração de site, expanda as Configurações avançadas e selecione a categoria Informações locais.
  4. Na categoria Informações locais, selecione Ativar o cache.

    Na primeira vez em que você alterar ou excluir links para arquivos na pasta local depois de iniciar o Dreamweaver, o aplicativo solicitará o carregamento do cache. Se você clicar em Sim, o Dreamweaver carregará o cache e atualizará todos os links para o arquivo que acaba de ser alterado. Se você clicar em Não, a alteração será registrada no cache, mas o Dreamweaver não carregará o cache nem atualizará os links.

    O cache talvez demore alguns minutos para ser carregado em sites maiores porque o Dreamweaver deve determinar se o cache está atualizado comparando os carimbos de data/hora dos arquivos do site local com os carimbos de data/hora registrados no cache. Se não tiver alterado nenhum arquivo fora do Dreamweaver, você poderá clicar com segurança no botão Parar quando for exibido.

Recriar o cache

  1. No painel Arquivos, selecione Site > Avançado > Recriar o cache do site.

Além de configurar o Dreamweaver para atualizar os links automaticamente sempre que um arquivo for movido ou renomeado, você pode alterar todos os links manualmente (inclusive os links de email, de FTP, nulos e de script) para que eles apontem para outro lugar.

Essa opção é mais útil quando você deseja excluir um arquivo que está vinculado a outros arquivos, mas pode ser usada para outras finalidades. Por exemplo, imagine que você vincule as palavras “filmes deste mês” a /filmes/julho.html no site inteiro. Em 1º de agosto, você teria que alterar esses links para que apontassem para /filmes/agosto.html.

  1. Selecione um arquivo na Visualização local do painel Arquivos.

    Observação:

    se estiver alterando um link de email, de FTP, nulo ou de script, você não precisa selecionar um arquivo.

  2. Selecione Site > Opções de site > Alterar link no site inteiro.

  3. Preencha as seguintes opções na caixa de diálogo Alterar link no site inteiro:

    Alterar todos os links para

    Clique no ícone de pasta  para navegar até o arquivo de destino do qual você deseja se desvincular e selecioná-lo. Se estiver alterando um link de email, de FTP, nulo ou de script, digite o texto completo do link que está alterando.

    Em links para

    Clique no ícone de pasta  para navegar até o novo arquivo ao qual você deseja se vincular e selecioná-lo. Se estiver alterando um link de email, de FTP, nulo ou de script, digite o texto completo do link de substituição.

  4. Clique em OK.

    O Dreamweaver atualiza todos os documentos vinculados ao arquivo selecionado, fazendo com que eles apontem para o novo arquivo, usando o formato de caminho já utilizado no documento (por exemplo, se o caminho antigo era relativo ao documento, o novo caminho também deve ser relativo ao documento).

    Depois de alterar um link no site inteiro, o arquivo selecionado fica órfão (isto é, nenhum arquivo do disco local aponta para ele). Você pode excluí-lo com segurança sem quebrar nenhum link no site local do Dreamweaver.

    Observação:

    como essas alterações ocorrem localmente, você deve excluir de modo manual o arquivo órfão correspondente na pasta remota e colocar ou verificar todos os arquivos nos quais os links foram alterados; caso contrário, os visitantes do site não observaram as mudanças.

Os links não estão ativos no Dreamweaver, isto é, você não pode abrir um documento vinculado clicando no link na janela Documento.

  1. Siga um destes procedimentos:
    • Clique com o botão direito no link e selecione Abrir página vinculada.

    • Pressione a tecla Control (Windows) ou Command (Macintosh) e clique duas vezes no link.

    Observação:

    o documento vinculado deve residir no disco local.

Esta obra está licenciada sob uma licença não adaptada da Creative Commons Attribution-Noncommercial-Share Alike 3.0  As publicações do Twitter™ e do Facebook não são cobertas pelos termos do Creative Commons.

Avisos legais   |   Política de privacidade online