Tableless - Desenvolvimento inteligente com Padrões Web

15/05/2006
Geral

Diferenças sutis na semântica

Existem alguns elementos no HTML que parecem ser redundantes, como por exemplo a tag STRONG e a tag EM. Se você já tentou usá-las, percebeu que visualmente elas não mostram nenhuma diferença das tags B e I. Apenas visualmente. Estas …

Por

Existem alguns elementos no HTML que parecem ser redundantes, como por exemplo a tag STRONG e a tag EM. Se você já tentou usá-las, percebeu que visualmente elas não mostram nenhuma diferença das tags B e I. Apenas visualmente.

Estas tags tem uma função semântica que é percebida apenas pelos deficientes visuais (pelo menos deveriam). Visualmente o STRONG e o B não tem nada de diferente, eles apenas marcam uma parte do texto como negrito. Mas a diferença entre os dois é invisivel para você.

Veja… Quando você usa STRONG, você dá um significado para aquela parte especifica do texto. Você diz que ela deve ser lida com mais força, com mais intensidade. Já com o elemento B você apenas marca em negrito o texto, e só. Ou seja, quando um browser para cegos (acho que ainda não existe nenhum assim) lê aquela parte com STRONG, a “voz dele” será alterada, ele passará a ler com mais força, já com o B isso não deve acontecer.
A mesma coisa acontece com o EM e o I. Quando uma parte do texto é marcada com EM, você dá um significado ao texto, você diz que aquela determinada parte deve ser lida com mais ênfase.

Por Diego Eis

Diego Eis criou o Tableless para disseminar os padrões web no Brasil. Como consultor já treinou equipes de empresas como Nokia, Globo.com, Yahoo! e iG. É palestrante e empreendedor.

http://twitter.com/diegoeis/

Veja os outros posts de

  • http://www.monteiro.eti.br/ Júlio Santos Monteiro

    Inicialmente eu achava que o veio para substituir o (assim como o para o ). Agora sim, tudo faz sentido! :P

    Abraços, e volte a postar, por favor &:-)

  • Thiago Viana

    Isso é realidade ou suposição? Pelo que entendi na leitura não há nada de concreto Pode ser ou pode não ser.

  • http://blue.muiomuio.net Mario

    É verdade, a tag STRONG serve para dar enfase.
    Caso o efeito desejado seja apenas realçar o texto a negrito devemos usar a tag .

    Não experimentei mas existe o WebbIE que é um browser para cegos que provavelmente poderá comprovar a diferença entre as tags.

  • Diogo

    Tambem tive essa impressão.

  • Marcelo

    Não é um browser para cegos, mas o Opera tem uma opção de comando por vóz, e opção de ler as paginas(em inglês). Experimente!

  • Micox

    Esqueceu de falar com relação a motores de busca. De acordo com as lendas, uma palavra com STRONG tem mais importancia para buscadores de busca (assim como os h1, h2).

  • http://www.brunodulcetti.com Bruno Dulcetti

    bela abordagem…
    mta gente as vezes preferem usar o b ou o i por serem mais curtos (eu fazia assim ;) ), mas o q vale eh a semântica…

  • http://rufspace.com Fellipe Cicconi

    Na teoria, é assim mesmo que acontece.

    Na prática, um fabricante de browsers, mesmo que para cegos, percebendo que usa-se muito a tag *b* no lugar de *strong* vai deixar ambos com o mesmo efeito sonoro… da mesma forma que os browsers comuns mantém o mesmo efeito visual.

    A mesma coisa para uma ferramenta de busca. Afinal de contas, não existe nada mais fácil que colocar mais uma condição em um IF.

    Acho que o lance de usar *strong* em vez de *b*, ou *em* em vez de *i* é muito mais um hábito de quem realmente SABE o que está fazendo do que uma prática que justifica os efeitos que aquilo causa.

    Não precisamos ficar tentando dizer onde isso ou aquilo funciona. Se simplesmente sabemos o modo correto, agimos de acordo.

    Agora, quem quiser uma razão definitiva, bem, leia o DOC da W3C. Não sei se eles justificam a ausência do *b* e do *i*, mas tenho certeza que as suas recomendações de uso são o *strong* e o *em* pelos motivos já citados aqui.

  • http://www.alexcamillo.com/blog/blogs Alex Camillo

    Parabéns……”pequenas” coisas que fazem muita diferença quanto a questão de acessibilidade.

  • http://www.pinceladasdaweb.com.br/ Pedro Rogério

    Bem legal a abordagem, por incrível que pareça, eu estava pensando sobre isso esse final de semana!!!

  • http://www.maujor.com/blog Maujor

    Os elementos B e I são meramente visuais (completamente ignorados por tecnologias assistivas) e perfeitamente válidos até o XHTML 1.1.
    Os rascunhos do XHTML 2.0 não contemplam estes elementos.

    Se a finalidade é destacar visualmente um trecho de texto use B ou I.
    Se for pretendido um destaque além do visual (um leitor de tela muda a entonação de voz) use STRONG e EM.

    Não encontrei qualquer referência a destaque por tecnologias de busca para estes elementos. Pessoalmente considero isso pouquíssimo provavel, pois levando a um extremo, poderiamos marcar, por exemplo, TODAS as palavras “CSS”, WEB STANDARDS” “TABLELESS” etc existentes em um site com *strong* com a finalidade de indexação sem prejuizo de semântica.

    Leitura complementar:
    Elementos para estilizar fontes

    BOLD versus STRONG

  • Mauricio

    To sentindo que o site ta perdendo as forças
    virando mais um blog de fds do que aquele veículo que ganhou nome no meio.

    Espero que o Tableless volte a imperar, pra muita gente já não é mais um meio de estudo.

    Gosto muito do site, mas está indo devagar quase parando.

    [']s

  • Leonardo Ribeiro

    Negrito É dar força ao texto. Semanticamente ambas tem essa mesma função, destacar um trecho do resto do contexto. Um leitor de texto deveria sim ler com ênfase ambas as tags.

    A real diferença é que enquanto a tag b está limitada (ou deveria limitar-se) a tornar o texto mais escuro e grosso, com a tag strong é possível dar peso da maneira que for, com cores, tamanho diferente, text-decoration. Strong é uma palavra genérica, deixando a critério do programador o tipo de formatação.

    Por esse motivo strong é mais correta, e a tag b está fora de uso em doctypes mais recentes.

  • Diego Dacal

    Eu vejo que o uso do b e do strong são a mesmo coisa. Pq quando eu negrito algum texto eu quero dar mais força à ele, assim como o em e o i.
    Não acedito que se deveria ter diferença auditiva pra isso.
    Vejo as duas tags como sendo a mesma coisa.

  • http://www.dimiguel.com.br Danilo Miguel

    Diego,
    Existem sim “navegadores para cegos”, ou leitores de tela como são conhecidos. Um deles é o Dosvox, que utilizo para testar meus sites – só não tenho o link dele aqui agora.
    Outro pode ser cnohecido aqui: http://www.saci.org.br/?modulo=akemi&parametro=6897
    Este eu nunca utilizei, nem imagino como seja seu funcionamento.
    Sei que, com relação ao STRONG e o B, entre outros, a diferença é sim bastante grande.

    Ah, valeu pelo post. Muito bacana!

  • http://emanuelslima.blogspot.com Hunter_

    Muito bom o post, quanto ao navegador, vale conferir a inciativa do projeto DosVox (http://intervox.nce.ufrj.br/dosvox/) tenha um browser.
    Aqui vc ve as ferramentas(http://intervox.nce.ufrj.br/dosvox/ferramentas.htm)

  • http://www.pinceladasdaweb.com.br Pedro Rogério
  • http://www.numclique.net Joares

    Notei muita gente perguntando se é suposição… na verdade, se estmos tão preocupados em estabalecer códigos segundos os padrões para deixá-los mais acessíveis, cabe a nós implementarmos nos códigos isso para que na hora q surgir esses bronwsers não seja a correria q tem sido pra muitos migrarem!

  • http://www.globalx.com.br Edivaldo Reis

    A discussão está ótima. É bom saber que há muitos profissionais preocupados em ter um bom padrão de desenvolvimento para web.
    Concordo com o Diego Elis. Realmente os browsers tendem a dar mais ênfase as tags e . Além disso, os Robôs de busca valorizam essas tags em suas buscas.

  • http://www.andrey.eti.br Andrey Pedro Lefkum

    Pergunta…. existe algum navegador que faz isso, ou será que existirá algum?

  • Glaucia

    Ô Maurício (#11) acredito que o site Tableless vai bem… e esse tipo de debate onde várias pessoas vão colocando seus argumentos referente a determinado assunto
    é muito válido … afinal é conversando que a gente se entende…:)>-

  • http://flickr.com/photos/henriquev/ Henrique Vicente

    Usando uma boa semântica (entenda por , …) quando necessário também ajuda os indexadores de buscas ajudarem o seu conteúdo ficar mais fácil de achar quando procurado (mas nem adianta pensar em encher disso em todo lugar até onde não devia para tentar enganar… Relevância não é questão só de quantidade).

  • Pingback: tiago.souza // blog » Diferenças sutis na semântica

  • http://tutsmais.com.br/blog/ Ofelquis

    Artigo escrito em 2006 e asado para resposta hoje em 2011 no fórum do tableless \=)