Logo do siteSilhueta da face do Maujor seguida do texto Maujor o dinossauro das CSS

Menu hamburger Três barras horizontais na cor laranja destinadas a ser clicada para abrir o menu menu do site

Você está no BLOG do Maujor. IR PARA O SITE

Elementos B – I – STRONG – EM

Publicado em: 2006-05-20 — 16.339 visualizacoes         

Esta página integra o Compêndio sobre o uso dos elementos HTML e descreve os elementos:
B  I  STRONG  EM

Introdução para B e I

As Recomendações do W3C para o HTML 4.01 classificam os elementos B e I como “Elementos de estilização de fontes” e desencorajam o seu uso, embora não estejam em desuso ao mesmo tempo em que incentivam o uso de folhas de estilo para obter os efeitos por eles produzidos.

Sendo elementos que não produzem qualquer tipo de valor semântico quando aplicados a um fragmento de texto e se prestam apenas para estilizar, é natural que seu uso seja desencorajado (não proibido!). É contrário a filosofia das Standards usar marcação para apresentar, e é exatamente isso que estes elementos fazem.
Os rascunhos para XHTML 2.0 apontam para o desaparecimento destes elementos (eu diria, em um prazo ainda longo).
Por isso tudo, o que eu adoto e recomendo é a prática de usar os elementos B e I em situações muito particulares para obter um efeito de negrito ou itálico numa tela tão somente, consciente de que tal marcação será ignorada por todas as tecnologias assistivas, por robots de indexação e tudo o mais que não uma mídia puramente visual.

O elemento B
Destina-se a marcar um fragmento de texto em negrito, sendo meramente um elemento de apresentação.

Exemplo:
Marcado assim:
Repita comigo <b>três</b> vezes – O elemento B é um estranho no ninho!
É renderizado assim:
Repita comigo três vezes – O elementoB é um estranho no ninho!

Nota: Porções de textos marcados com B em geral são renderizados em negrito.

O elemento I
Destina-se a marcar um fragmento de texto em itálico, sendo meramente um elemento de apresentação.

Exemplo:
Marcado assim:
Repita comigo <i>três</i> vezes – O elemento I é um estranho no ninho!
É renderizado assim:
Repita comigo três vezes – O elementoI é um estranho no ninho!

Nota: Porções de textos marcados com I em geral são renderizados em itálico.

Introdução para STRONG e EM

As Recomendações do W3C para o HTML 4.01 classificam os elementos STRONG e EM como “Elementos de expressão” (ou “Elementos de frase”) e devem ser usados para enfatizar uma palavra ou texto. Estes elementos além de, na maioria dos navegadores, serem renderizados da mesma forma que os elementos B e I deles diferem pelo fato de, agora sim, serem elementos semânticos e transmitirem a ênfase para todos os agentes de usuários.
Assim, marcar textos com estes elementos, não só produzirá uma saída visual diferente, como também será interpretado diferenciadamente pelos diferentes agentes de usuário. Por exemplo: os leitores de tela, mudarão a entonação e o volume de voz de textos marcados com eles.

O elemento STRONG
Destina-se a marcar um fragmento de texto que deva ser fortemente enfatizado.

Exemplo:
Marcado assim:
Repita comigo <strong>três</strong> vezes – O elemento STRONG é semântico!
É renderizado assim:
Repita comigo três vezes – O elementoSTRONG é semântico!

Nota: Porções de textos marcados com STRONG em geral são renderizados em negrito.

O elemento EM
Destina-se a marcar um fragmento de texto que deva ser enfatizado.

Exemplo:
Marcado assim:
Repita comigo <em>três</em> vezes – O elemento EM é semântico!

É renderizado assim:
Repita comigo três vezes – O elementoEM é semântico!

Nota: Porções de textos marcados com EM em geral são renderizados em itálico.

[ « anterior]   [ index ] [   próximo » ]

Livros do Maujor

Desenvolvimento com Padrões Web? Adquira os livros do Maujor
Clique a "capinha" para visitar o site do livro.

capa livro jQuery   capa livro ajaxjQuery   capa livro css   capa livro html   capa livro javascript   capa livro html5   capa livro css3   capa livro jQuery Mobile   capa livro jQuery UI   capa livro SVG   capa livro RWD   capa livro foundation   capa livro HTML5 e CSS3   capa livro Bootstrap3   capa livro Sass e Compass

Esta matéria foi publicada em: 2006-05-20 (sábado). Subscreva o feed RSS 2.0 para comentários.
Comente abaixo, ou link para http://www.maujor.com/blog/2006/05/20/el-bem/trackback no seu site.

3 comentários na matéria: “Elementos B – I – STRONG – EM”

  1. MaujorNo Gravatar disse:

    Projeto DOSVOX : Um leitor de tela desenvolvido na UFRJ muito bom e totalmente brasileiro – http://intervox.nce.ufrj.br/dosvox/

    JAWS: O mais popular: http://www.freedomscientific.com/fs_downloads/jaws.asp

    IBM HP Reader: http://www-306.ibm.com/able/solution_offerings/hpr.html

  2. Osny Santos NettoNo Gravatar disse:

    Seria interessante você postar aqui memso no comentário um link de algum programa que lê um site… como você mesmo colocou ali encima, eu ja andei procurando e não achei nenhum leitor de tela.
    O artigo está muito bom. Abraços Maujor.

  3. Lucas AlvesNo Gravatar disse:

    Olá Maurício, muito interessante você falar sobre essas duas tags.
    Antes de começar a estudar os Web Standards eu sempre usava <b> e <i>, depois de algumas pesquisas e conversas soube que os leitores de tela não interpretam essas duas tags.
    Depois disso comecei a estudar semântica e agora tento ao máximo fazer tudo dentro dos padrões e usar semantica para isso.

    Abraços

Comentário:





Teclar "Enter" cria um novo parágrafo. Teclar "Shift + Enter" causa uma quebra de linha.

Subscribe without commenting

topo