Quando você clica em parte da imagem de um site e seu navegador pula para uma página da Web diferente, um mapa de imagem provavelmente é responsável por essa ação. Os designers de sites podem escrever código HTML que cria pontos de acesso clicáveis em qualquer imagem. Construir mapas de imagem à mão é demorado porque você deve identificar as coordenadas exatas de cada ponto de acesso. Com a ferramenta Slice no Photoshop, você desenha pontos de acesso em uma imagem para gerar o código HTML necessário automaticamente.
Criar mapa de imagem
Etapa 1
Inicie o Photoshop e abra uma imagem que você deseja converter em um mapa de imagem. Clique e segure a ferramenta "Cortar" para exibir um menu contendo outras ferramentas. Clique na ferramenta "Slice" para selecioná-lo.
Etapa 2
Clique em um ponto dentro da imagem e arraste a ferramenta Fatia para desenhar uma caixa delimitadora ao redor da parte da imagem que você deseja tornar clicável. O Photoshop desenha "fatias automáticas" adicionais em torno de outras partes da imagem. Essas fatias automáticas garantem que todas as partes de uma imagem sejam incluídas em uma fatia.
Etapa 3
Clique com o botão direito do mouse dentro da fatia que você criou e selecione "Editar Opções de Fatia" para abrir a janela Opções de Fatia. Digite a URL que deseja associar à fatia. Você também pode substituir o nome padrão que o Photoshop deu à fatia digitando um novo na caixa de texto "Nome".
Etapa 4
Clique em "OK" para fechar a janela de opções de fatia e retornar à imagem. Clique em outro ponto dentro da imagem e arraste a ferramenta Fatia para criar fatias adicionais conforme necessário.
Ajustar fatias do mapa de imagem
Etapa 1
Selecione a ferramenta "Slice Select Tool" na barra de ferramentas e clique dentro de uma fatia que deseja mover.
Etapa 2
Mantenha pressionado o botão esquerdo do mouse e arraste a fatia para um novo local.
Etapa 3
Segure o cursor do mouse sobre uma das bordas da fatia e uma linha com setas em cada extremidade aparecerá. Clique nessa linha, mantenha pressionado o botão esquerdo do mouse e arraste o mouse se precisar aumentar ou diminuir a fatia.
Salvar mapa de imagem
Etapa 1
Clique em “Arquivo” seguido de “Salvar para a Web” para abrir a janela Salvar para a Web.
Etapa 2
Clique em "Preset" e selecione uma das opções de tipo de arquivo que aparecem. As opções incluem GIF 128 Dithered, JPEG High e PNG-24.
Etapa 3
Clique em “Salvar” para abrir uma janela que exibe os arquivos e pastas do seu disco rígido. Navegue até a pasta onde deseja salvar os arquivos de mapa de imagem e digite um nome para o mapa de imagem na caixa de texto Nome do arquivo.
Etapa 4
Clique no menu suspenso “Formatar” e selecione “HTML e imagens”. Clique em "Salvar" para salvar todos os arquivos na pasta que você especificou.
Dica
O Photoshop salva cada fatia como uma imagem separada em uma pasta de imagens. O programa também salva um documento HTML que tem o mesmo nome que o nome que você digitou na caixa de texto “Nome do arquivo”. Se você encontrar esse arquivo HTML no Explorador de Arquivos e clicar duas vezes no arquivo, seu navegador abrirá e exibirá seu mapa de imagem. Clique em diferentes partes do mapa de imagem para navegar até os URLs atribuídos às fatias. Por exemplo, se você dividiu um mapa dos EUA em estados criando uma fatia para cada estado, poderá clicar em um estado para acessar a URL atribuída à fatia desse estado.
Dê nomes significativos às fatias e você achará mais fácil identificá-las se quiser ajustar o código HTML gerado pelo Photoshop. Por exemplo, se você criou uma fatia que circundava o estado de Iowa, você poderia nomear a fatia como Iowa.
Você provavelmente desejará salvar suas imagens de mapa de imagem no mesmo formato da imagem original. Por exemplo, se for um JPEG, escolha uma das opções de JPEG no menu suspenso Predefinição na janela Salvar para a Web. Escolha “JPEG Low”, por exemplo, e o Photoshop gera imagens JPEG de baixa qualidade. Quanto menor a qualidade de uma imagem, mais rápido ela carrega em um navegador da Web.
Aviso
Este artigo é aplicável ao Adobe Photoshop CC, versão 2014. Algumas informações podem variar em outras versões do software.
