Aguarde...

9 de junho de 2021

É HORA DE REDEFINIR O HTML?

É HORA DE REDEFINIR O HTML?

HTML é um dos blocos de construção fundamentais da web. Mas assim como as melhores práticas e técnicas de web design mudam com o tempo, o código que usamos também muda. À medida que o HTML evolui, algumas de suas marcações mais antigas foram descontinuadas, enquanto outras partes foram reaproveitadas.

Mas isso cria mais problemas para nós? Seria melhor começar de novo para ter certeza de que estamos todos trabalhando na mesma linguagem, em vez de tentar editar as partes que não queremos ou precisamos?

Problemas para manter HTML legado

Vamos dar uma olhada no que acontece quando alteramos as regras do HTML ao longo do tempo e como isso afeta a Web:

1. É ARRISCADO DEIXAR O HTML OBSOLETO PARA TRÁS

Quer certos recursos tenham ficado desatualizados e precisem ser eliminados, quer os navegadores tenham parado de oferecer suporte a certas tags, o código obsoleto  eventualmente se torna um problema.

Você encontrará uma longa lista de HTML obsoletos no site HTML.com :

Para muitos deles, as tags e atributos HTML foram substituídos por um estilo CSS mais eficiente. Também há exemplos de reprovação de HTML porque os recursos ficaram desatualizados (como frames).

No entanto, ainda existem sites por aí que contêm HTML obsoleto.

Em alguns casos, o HTML fica silencioso do outro lado do site. Se houver código errôneo suficiente por aí, entretanto, esses caracteres e diretivas extras podem diminuir o tempo de processamento do seu servidor e renderizar as páginas mais lentamente do que o normal.https://794a9f5c66618fbc99c06eb4763ffe9c.safeframe.googlesyndication.com/safeframe/1-0-38/html/container.html

Em outros casos, o HTML quebra recursos no front-end de um site . Veja, por exemplo, este aviso da Mozilla sobre a <nobr>tag:

O uso de código obsoleto pode criar experiências inconsistentes e ruins no front-end. E quando todos os navegadores finalmente embarcarem e decidirem não suportar mais uma tag HTML, todos os visitantes ficarão com uma IU quebrada.

Portanto, embora seja ótimo que o HTML5 tenha tornado obsoleto o HTML legado que não é mais útil ou necessário, isso não impede que todos o utilizem ou deixem para trás em sites mais antigos. 

2. O CÓDIGO LEGADO SE CONCENTRA NO ESTILO; SEM SEMÂNTICA

Como mencionei, muito HTML obsoleto foi descontinuado e substituído pelo estilo CSS. E isso é bom.

Deixe-me dar um exemplo simples disso …

My favorite book is <i>The Stand</i> by Stephen King. The first time I read it, I didn’t sleep for <i>three days</i>. Thankfully, when I revisit it every year, I have fewer nightmares and can more greatly appreciate the storytelling aspect of it.

No parágrafo acima, usei a <i>tag para colocar várias palavras em itálico.

Nos primeiros dias do HTML, <i>significava “itálico” (a forma <b>significava “negrito”). Com HTML5, no entanto, <i>ainda será processado em itálico, mas seu significado semântico não é tão amplo. Foi reaproveitado para indicar uma mudança estilística , que é importante para coisas como nomes de livros e filmes, palavras estrangeiras e assim por diante. Para expressar ênfase , usamos a  <em>tag. 

No entanto, manter o legado  <i> e as  <b>tags pode levar a problemas. 

Na declaração acima, coloquei em itálico o nome do livro (The Stand), bem como o número de noites sem dormir que passei (três dias) <i>. Quer o designer decida hoje, amanhã ou daqui a dez meses que quer mudar a forma como as referências literárias ou cinematográficas são estilizadas, minha escolha de HTML vai atrapalhar.

Como todo o meu texto em itálico é indicado por <i>, os estilos não podem ser aplicados universalmente a um conteúdo específico (como referências de livros). Em vez disso, o designer teria que revisar e limpar meu código para que ficasse assim:

My favorite book is <i>The Stand</i> by Stephen King. The first time I read it, I didn’t sleep for <em>three days</em>. Thankfully, when I inevitably revisit it every year, I have fewer nightmares and can more greatly appreciate the storytelling aspect of it.https://794a9f5c66618fbc99c06eb4763ffe9c.safeframe.googlesyndication.com/safeframe/1-0-38/html/container.html

Isso permitiria que o conteúdo em itálico semanticamente permanecesse intacto enquanto o designer ou desenvolvedor ajustava os estilos do título do livro aqui e em todo o site. (Embora, na verdade, a primeira frase em itálico deva ser circundada  <cite> , pois seria semanticamente mais precisa.)

Embora seja ótimo termos criado diretrizes para o uso de HTML legado hoje, manter o código antigo por perto pode confundir  escritores, designers e outros que estão familiarizados com a forma anterior de formatação de conteúdo. Redefinindo o HTML, descartando estilos antigos e criando uma linguagem que usamos consistentemente na web, não criaremos mais trabalho para nós mesmos mais tarde.

3. CÓDIGO OBSOLETO DIFICULTA A ACESSIBILIDADE

Outro grande motivo pelo qual o HTML reaproveitado e obsoleto é um problema é a acessibilidade.

Para começar, quando você deixa um código obsoleto e sem suporte para trás, é provável que cause problemas para leitores de tela, mecanismos de pesquisa e navegadores que usam HTML para pistas sobre o conteúdo.

As tags de cabeçalho (por exemplo <h1>,  <h2>,  <h3>), por exemplo, não são apenas usados para quebrar visivelmente até grandes pedaços de texto. As tags de cabeçalho e, mais especificamente sua hierarquia, apresentam informações importantes sobre a relação entre os assuntos em uma página – e esse é o tipo de coisa que os leitores de tela e os mecanismos de pesquisa captam.

É por isso que precisamos ter muito cuidado com o código que deixamos nos bastidores, mesmo se os leitores no front end não puderem vê-lo visivelmente. Vejamos um exemplo de como isso pode afetar a acessibilidade:

Is there an <i>à la carte</i> menu or is it just <i>prix fixe</i> tonight?

Se um leitor de tela lesse esta frase, as frases em francês seriam ditas com a mesma ênfase que qualquer outra palavra em itálico na página.

É por isso que o HTML5 incentiva a codificação semântica em vez de puramente estilística.

A maneira correta de escrever HTML na linha acima seria:

Is there an <i lang="fr">à la carte</i> menu or is it just <i lang="fr">prix fixe</i> tonight?

Existem duas razões para fazer isso:

  1. Para indicar aos leitores de tela que há uma mudança de idioma.
  2. Para tornar mais fácil para designers ou desenvolvedores criar um estilo personalizado para frases estrangeiras.

A codificação semântica é essencial para designers que trabalham em sites multilíngues .

Como explica o World Wide Web Consortium , idiomas como o japonês não usam itálico ou negrito para dar ênfase – pelo menos não da maneira que os falantes de inglês fazem.

Portanto, para traduzir corretamente uma página do inglês, um designer japonês precisaria remover o itálico ou negrito e adicionar colchetes ao redor das palavras. No entanto, se tudo estiver codificado com <i><b>, ou houver uma mistura de  <i><em> e <b><strong>, será muito difícil localizar e substituir o HTML correto com facilidade.

Então, se acessibilidade ou internacionalização são preocupações para você, deixar claro o HTML com o qual você escreve será muito importante.

Embrulhar

O fato é que requer muito trabalho reescrever as regras do HTML. Portanto, embora seja ótimo redefinir o HTML, não sei se é tão prático.

Tudo o que podemos realmente fazer é ficar a par do que está acontecendo com o idioma, editar o código legado de nossos sites no segundo em que ele se tornar obsoleto e sempre usar tags e atributos compatíveis. Ao brincar com o código obsoleto ou reaproveitado, colocamos apenas a experiência dos visitantes do site em risco, portanto, é melhor reservar um tempo para limpar o antigo sempre que pudermos.

Se todos nós conseguirmos entrar na mesma página sobre isso, o HTML legado problemático eventualmente desaparecerá de nossos sites e memórias.

Postado em Blog
Escreva um comentário