- Página Inicial
- Códigos HTML Prontos
- Abbr Html
- Voltar
Abbr Html
A Tag Abbr Html define uma abreviação ou acrônimo em um documento HTML.
O Elemento Abbr HTML: Uma Abreviação com Mais Detalhes
Em HTML, o elemento <abbr>
serve para representar uma abreviação e, opcionalmente, fornecer uma explicação mais completa sobre ela. Essa explicação detalhada é exibida quando o usuário passa o mouse sobre a abreviação (em um dispositivo compatível) ou quando um leitor de tela a encontra.
Por que usar o <abbr>
?
- Acessibilidade: Ao fornecer uma descrição completa, você torna seu conteúdo mais acessível a pessoas com deficiência visual que utilizam leitores de tela.
- Clareza: Para abreviações menos conhecidas, o
<abbr>
ajuda a garantir que todos os seus visitantes entendam o significado. - SEO: Embora não seja o fator mais importante, o uso adequado de
<abbr>
pode ajudar os mecanismos de busca a entender melhor o conteúdo da sua página.
Exemplo:
<p>A <abbr title="Associação Brasileira das Empresas de Benefícios ao Trabalhador">ABBT</abbr> é uma entidade que representa as empresas que oferecem benefícios aos trabalhadores.</p>
Neste exemplo, quando o usuário passa o mouse sobre a abreviação “ABBT”, o texto “Associação Brasileira das Empresas de Benefícios ao Trabalhador” será exibido como uma dica de ferramenta.
Dicas de uso:
- Utilize o atributo
title
: É essencial usar o atributotitle
para fornecer a explicação completa da abreviação. - Seja conciso: A explicação deve ser clara e objetiva, evitando informações redundantes.
- Use com moderação: Não exagere no uso de
<abbr>
, apenas para abreviações que realmente necessitam de uma explicação adicional. - Considere o contexto: Avalie se a abreviação é conhecida pelo seu público-alvo antes de usá-la.
Um exemplo de abreviatura é Mr. que é a abreviação de Mister.
Definição e uso da TAG <abbr>
A TAG <abbr>
define uma abreviação ou um acrônimo, como “HTML“, “CSS“, “Mr.“, “Dr.“, “ASAP“, “ATM“.
Dica: Use o atributo global para mostrar a descrição da abreviatura/acrônimo ao passar o mouse sobre o elemento. title
a tag <abbr> pode ser definida usando o atributo title opcional da seguinte forma:
<p><abbr title="Loop Nerd">LN</abbr></p>
Veja o exemplo no código HTML.
<abbr title="Cascading Style Sheets">CSS</abbr>
Veja o exemplo passe o mouse na palavra CSS abaixo.
CSS
Veja outro exemplo HTML abaixo.
HTML
<abbr title="Linguagem de marcação do HyperText">HTML</abbr>
Veja mais um exemplo EUA.
EUA
<p><abbr title="Estados Unidos da América">EUA</abbr</p>
O propósito deste elemento é unicamente a conveniência de autores e todos os navegadores mostram ele como um elemento dentro de uma linha (display: inline
) por padrão, embora o estilo aplicado sobre ele seja diferente entre diferentes navegadores:
- Alguns navegadores, como o Internet Explorer, não aplicam nenhum estilo à mais do que é aplicado ao elemento
<span>
. - Opera, Firefox, e alguns outros adicionam um sublinhado pontilhado ao conteúdo do elemento.
- Alguns poucos navegadores não apenas adicionam um sublinhado pontilhado, mas também colocam o texto em versalete (small caps); para evitar este tipo de estilo, adicione algo como
font-variant
(en-US): none
no CSS que administra este caso.
É fortemente recomendado que autores web não confiem no estilo padrão. Note que este elemento não é suportado pelo Internet Explorer anterior ao IE7. Como tais versões do IE também não permitem que se aplique estilo para elementos desconhecidos, o seguinte script é necessário para permitir isso:
<!--[if lte IE 6]>
<script>
document.createElement("abbr");
</script>
<![endif]-->
Neste artigo abordamos sobre a tag Abbr HTML
Veja outro Artigos de TAGS HTML!
- Estrutura Básica do HTML
- HTML – Tags de Formatação de Texto
- HTML – Tags Básicas
- Conheça as principais tags semânticas do HTML5
- Atributo de classe HTML
Publicado por: Loop Nerd
1.257 Visualizações
Deixe um comentário