Elementos de frase – 1a. Parte
Publicado em: 2006-03-24 — 13.956 visualizacoes
Em uma matéria publicada neste blog falei sobre phrase elements (ou “elementos de frase” ou ainda, “elementos de expressão”).
Ali, tratamos especificamente dos elementos STRONG
e EM
.
Além destes dois, os demais elementos HTML classificados como phrase elements são: DFN, CODE, SAMP, KBD, VAR, CITE, ABBR, ACRONYM
.
Vamos descrever a finalidade (onde e como usar) de cada um destes elementos:
- O elemento
DFN
- Destina-se a marcar um termo cuja definição foi dada no documento.
Exemplo:
<p><dfn>Ceviana</dfn> é um segmento de reta que liga um vértice de um triângulo a um ponto qualquer do lado oposto.</p>
Na frase acima o autor define o significado do termo "ceviana" em sua página web e marcou corretamente o termo com o elementoDFN.
Convém notar que deve-se definir um termo a ser usado várias vezes em um documento, na primeira vez que ele aparece no fluxo do texto e somente aí usa-se o elemento
DFN
. Não é correto sair marcando <dfn>ceviana</dfn> toda vez que aparecer o termo no documento.Nota: Porções de textos marcados com
DFN
são renderizados em itálico.
Somente para efeito de visualização, marquei estas três palavras (devem estar em itálico) comDFN
- O elemento
CODE
- Destina-se a marcar trechos de código.
Exemplo:
<p>A regra CSS que faz todos os cabeçalhos de nível 2 na cor vermelha é: <code>h2 { color:#f00;}</code></p>Nota: Porções de código marcados com
code
são em geral renderizados em fonte monoespaçada.
Somente para efeito de visualização, marqueiestas três palavras
(devem estar em fonte diferenciada) comCODE
- O elemento
SAMP
- Destina-se a marcar textos que são mostrados como exemplo de saída de um programa.
Exemplo:
<p>Ao clicar no botão denominado "executar" você verá uma caixa de texto com a mensagem: <samp>Alô mundo!</samp></p>Nota: Porções de código marcados com
samp
são em geral renderizados em fonte monoespaçada.
Somente para efeito de visualização, marquei estas três palavras (devem estar em fonte diferenciada) comsamp
- O elemento
KBD
- Destina-se a marcar textos que definem uma ação do usuário no teclado.
Exemplo:
<p>Se você não sabe qual é o número do CNPJ digite: <kbd>desconhecido</kbd></p>Nota: Porções de código marcados com
kbd
são em geral renderizados em fonte monoespaçada.
Somente para efeito de visualização, marquei estas três palavras (devem estar em fonte diferenciada) comkbd
Na 2a. Parte desta matéria tratarei dos elementos VAR, CITE, ABBR, ACRONYM
. Até lá!
Desenvolvimento com Padrões Web? Adquira os livros do Maujor
Visite o site dos livros.
Esta matéria foi publicada em: 2006-03-24 (sexta-feira). Subscreva o feed RSS 2.0 para comentários.
Comente abaixo, ou link para https://www.maujor.com/blog/2006/03/24/phrase-el/trackback no seu site.
Ótima matéria. Quero me especializar no padrões e nada melhor que obter informações corretas sobre eles.
Abraços!!
Boa, Maujor! Para um código perfeitamente semântico, nada melhor que usar sempre os elementos certos.
Gostei do artigo!
muito interessante. dá mais trabalho, mas esteremos marcando corretamente cada elemento. É como regras gramaticais que dificilmente usamos. Fazem parte de nosso idioma, mas muitos ignoram.
Parabéns pelo artigo.
Abraço.
Ótimo Maurício. Tava precisando desses detalhes!