Houve um ponto na história do design da web em que muitos sites usavam um recurso conhecido como "mapas de imagem". Esta é uma lista de coordenadas anexadas a uma imagem específica em uma página. Essas coordenadas criam áreas de hiperlink nessa imagem, o que é essencial para adicionar "pontos quentes" a um gráfico, cada um dos quais pode ser codificado para vincular a diferentes locais. Isso é muito diferente do que apenas adicionar uma tag de link a uma imagem, o que faria com que todo o gráfico se tornasse um grande link para um único destino.
Exemplos: imagine ter um arquivo gráfico com uma imagem dos Estados Unidos. Se você quiser que cada estado seja "clicável", para que eles acessem páginas sobre esse estado específico, você poderá fazer isso com um mapa de imagem. Da mesma forma, se você tivesse uma imagem de uma banda de música, você poderia usar um mapa de imagem para que cada membro individual pudesse ser clicado para uma página subseqüente sobre esse membro da banda.
Os mapas de imagens são úteis? Eles certamente foram, mas caíram em desgraça na Web de hoje. Isso é, pelo menos em parte, porque os mapas de imagens exigem coordenadas específicas para funcionar. Hoje, os sites são criados para serem responsivos e as imagens são dimensionadas com base no tamanho de uma tela ou dispositivo. Isso significa que as coordenadas predefinidas, que são como os mapas de imagens funcionam, desmoronam quando um site é dimensionado e as imagens mudam de tamanho. É por isso que os mapas de imagens raramente são usados nos sites de produção hoje, mas ainda têm vantagens para demonstrações ou instâncias em que você está forçando o tamanho de uma página.
Quer saber como criar um mapa de imagens, especificamente como fazê-lo com o Dreamweaver? O processo não é especialmente difícil, mas também não é fácil, então você deve ter alguma experiência antes de começar.
Começando
Vamos começar. O primeiro passo que você precisa dar é adicionar uma imagem à sua página web. Você então clicará na imagem para destacá-la. A partir daí, você precisa ir para o menu de propriedades (e clicar em uma das três ferramentas de desenho do ponto de acesso: retângulo, círculo ou polígono. Não se esqueça de nomear sua imagem, o que você pode fazer na barra de propriedades. qualquer coisa que você quiser, use "map" como exemplo.
Agora, desenhe a forma desejada em sua imagem usando uma dessas ferramentas. Se você precisar de pontos retangulares, use o retângulo. O mesmo para o círculo. Se você quiser formas mais complexas de ponto de acesso, use o polígono. Isso é o que você provavelmente usaria no exemplo do mapa dos EUA, já que o polígono permitiria que você soltasse pontos e criasse formas muito complexas e irregulares na imagem
Na janela de propriedades do ponto de acesso, digite ou navegue até a página à qual o ponto de acesso deve se vincular. Isso é o que cria essa área vinculável. Continue adicionando pontos de acesso até que seu mapa esteja completo e todos os links que você deseja adicionar tenham sido adicionados.
Quando terminar, analise seu mapa de imagem em um navegador para garantir que ele funcione corretamente. Clique em cada link para garantir que ele vá para o recurso ou página da web apropriada.
Desvantagens dos mapas de imagem
Mais uma vez, esteja ciente de que os mapas de imagem têm vários contras, mesmo fora da supracitada falta de suporte com sites responsivos. Primeiro, pequenos detalhes podem estar obscurecidos em um mapa de imagens. Por exemplo, os mapas de imagem geográfica podem ajudar a determinar de que continente um usuário é, mas esses mapas podem não ser detalhados o suficiente para identificar o país de origem do usuário. Isso significa que um mapa de imagens pode ajudar a determinar se um usuário é da Ásia, mas não do Camboja em particular.
Mapas de imagem também podem ser carregados lentamente. Eles não devem ser usados várias vezes em um site porque eles ocupam muito espaço para serem usados em cada página de um site. Muitos mapas de imagem em uma única página criariam um sério gargalo e um enorme impacto no desempenho do site.
Finalmente, mapas de imagens podem não ser fáceis para usuários com problemas visuais acessarem. Se você usou mapas de imagens, você também deve criar outro sistema de navegação para esses usuários como uma alternativa.
Linha de fundo
Use mapas de imagem de tempos em tempos ao tentar reunir uma demonstração rápida de um design e como ele funciona. Por exemplo, se você estiver criando um design para um aplicativo móvel e quiser usar mapas de imagem para criar pontos de acesso para simular a interatividade do aplicativo. Isso é muito mais fácil de fazer do que codificar o aplicativo, ou até criar páginas da Web fictícias criadas para os padrões atuais com HTML e CSS. Mas colocá-los em um site de produção ou aplicativo é muito complicado e provavelmente deve ser evitado nos sites de hoje.
