Esquadria azul à volta de uma imagem

Tornar uma imagem a ligação para outra página é muito simples, o HTML que segue trata disso:

 <a href="http://aindaapensar.blogspot.com/">
 <img src="/aindaapensar.png" 

                alt="logotipo de aindaapensar">
 </a>

No entanto irá verificar que aparece uma esquadria azul à volta da imagem. Esta esquadria serve para informar os utilizadores que a imagem é uma ligação. Claro que há algo a dizer para indicar o que é que ou não uma ligação.

Hoje a generalidade dos designers da web tornam óbvio através das concepções do anúncios ou botões de navegação aqueles elementos que são ligações e nos quais se pode carregar. Então como é que apagamos essa esquadria?

Aqueles que gostam de aplicar as recomendações devem usar folhas de estilo e assim o código será algo como:

 <a href="http://aindaapensar.blogspot.com/">
 <img src="/aindaapensar.png" 

             alt="logotipo de aindaapensar" 

             style="border-style: none">
 </a>

Ou ainda melhor remetendo a regra para a folha de estilo separada:

img
{
 border-style: none;
}

E no elemento header da sua página fazer uma menção à folha de estilo:

 <link href="/folha_de_estilo.css" 

                 rel="stylesheet" type="text/css">

Este método irá automaticamente remover a esquadria azul de todas as imagens que usem este ficheiro css e no caso desta regra não ser ultrapassada por outra mais específica.