De repente, descobri um problema muito estranho hoje. Alguns sites focados em CSS, XHTML, Web 2.0 e padrões da Web estão discutindo como remover a caixa pontilhada (contorno) ao redor do hiperlink quando o mouse é clicado, como contorno: nenhum ou contorno: 0. Talvez às vezes a aparência padrão de um quadro pontilhado (contorno) afete a aparência, mas sua existência deve ter seu motivo: que é melhorar a usabilidade do site, principalmente para trazer grande comodidade para quem utiliza a navegação pelo teclado. Enquanto discutimos semântica e facilidade de uso, estamos sempre fazendo coisas que vão contra elas. Defina o fundo do link como vermelho quando o foco for acionado, etc. Claro, você pode criar estilos mais complexos conforme necessário e também pode definir o foco e passar o mouse para o mesmo estilo. Mas há uma coisa: você não pode bloquear o mecanismo de disparo do foco.
1. Caixa pontilhada (contorno) traz comodidade à navegação pelo teclado
Tenho o hábito de ler artigos: raramente uso o mouse e confio basicamente no teclado. As mais utilizadas são a tecla Tab, PageUp, PageDown, Enter e as quatro teclas de direção. A tecla Tab é usada para navegar nos hiperlinks. Você pode alternar entre diferentes hiperlinks. Depois de selecionar um link, pressione Enter diretamente para entrar (agora você pode usar a tecla Tab para ver o efeito nesta página). Quando a tecla Tab focar em um link, um quadro pontilhado (contorno) aparecerá ao redor do link, indicando que o link está em foco e pode ser acessado após confirmação. Claro, muitas pessoas podem dizer que é tão conveniente usar um mouse, por que usar um teclado? Aqui eu gostaria de dar algumas razões.
Diz-se que um critério para ser um verdadeiro mestre em informática é saber se você consegue realizar todas as operações sem usar o mouse. Às vezes, quando estou lendo um artigo, segurar o café com a mão direita e digitar no teclado com a mão esquerda não afeta minha leitura.
As necessidades especiais de grupos especiais de pessoas Seu site não é apenas para você. Você não pode influenciar a forma como outras pessoas o utilizam.
Novo estilo ao usar a tecla Tab para focar em um link (pode variar em diferentes navegadores, mas cada navegador possui esta função, o que mostra sua necessidade)
2. Pior experiência do usuário
Use Outline:none ou Outline:0 para remover o quadro pontilhado externo Embora nenhuma alteração possa ser vista no link, pelo menos as informações do link podem ser vistas na barra de status. Mas uma experiência de usuário ainda pior é usar o evento onfocus do JavsScript. Quando o usuário foca em um link, ele cancela imediatamente o foco, o que significa que você nunca poderá focar nesse hiperlink, portanto, se não usar o mouse, você absolutamente poderá. Visite qualquer link nesta página. Alguns especialistas desenvolveram métodos para usar JQuery para remover contornos. Se você pesquisar no Google "remover linhas pontilhadas dos links", obterá dezenas de milhares de resultados. Parece que muitas pessoas precisam disso e estão pesquisando. Mas ele violou o princípio da facilidade de uso da Web e não levou em consideração a experiência do usuário.
3. Opções alternativas
Se você realmente acha que a aparência de uma moldura pontilhada afetará a aparência, você definitivamente pode fazer uma escolha melhor. Isso é usar a pseudoclasse :focus em CSS. Por exemplo usando
a:foco { cor de fundo:#f00 }
/*ou*/
a:hover, a:focus {text-decoration:underline;}
Portanto, nunca remova a caixa pontilhada ao redor do hiperlink, pelo menos para não bloquear o acionamento do foco.