Sopa de tag - Tag soup

HTML
Comparações

No desenvolvimento da web , " tag soup " é um pejorativo para HTML sintaticamente ou estruturalmente incorreto escrito para uma página da web . Como os navegadores da web têm tratado historicamente de erros estruturais ou de sintaxe HTML com leniência, tem havido pouca pressão para os desenvolvedores da web seguirem os padrões publicados e, portanto, é necessário que todas as implementações de navegador forneçam mecanismos para lidar com a aparência de "sopa de tags", aceitar e corrigir sintaxe e estrutura inválidas sempre que possível.

Um analisador HTML (parte de um navegador da web ) que é capaz de interpretar marcação semelhante a HTML, mesmo que contenha sintaxe ou estrutura inválida, pode ser chamado de analisador de sopa de tags . Todos os principais navegadores da web atualmente têm um analisador de sopa de tags para interpretar HTML malformado, com a maioria dos elementos de tratamento de erros padronizados.

"Tag soup" engloba muitos erros comuns de criação, como tags HTML malformadas , elementos HTML aninhados incorretamente e entidades de caracteres sem escape (especialmente e comercial (&) e sinais de menor que (<)).

Usei esse termo em minhas instruções durante anos para caracterizar a confusão de colchetes angulares agindo como tags em HTML em páginas que são aceitas pelos navegadores. Minimização imprópria, construções sobrepostas ... coisas que se parecem com marcação SGML, mas o criador não conhecia ou respeitava as regras SGML para o vocabulário HTML. Na verdade, uma coleção colada de texto e marcação. [...] nunca vi o termo definido em lugar nenhum.

-  G. Ken Holman, Re: [xml-dev] O que é sopa de tag? , Lista de discussão de desenvolvimento XML, 11 de outubro de 2002.

O serviço de validação de marcação é um recurso para autores de páginas da web evitarem a criação de sopa de tags.

Visão geral

"Tag soup" é um termo usado para denegrir várias práticas de criação na web. Alguns deles (ordenados aproximadamente do mais grave para o menos grave) incluem:

  1. Marcação malformada em que as tags são aninhadas ou fechadas incorretamente. Por exemplo, o seguinte: 
    <p>This is a malformed fragment of <em>HTML.</p></em>
  2. Estrutura inválida onde os elementos são aninhados incorretamente de acordo com o DTD para o documento. Exemplos disso incluem aninhar um elemento "ul" diretamente dentro de outro elemento "ul" para qualquer um dos DTDs HTML 4.01 ou XHTML. Dan Connolly cita o uso do elemento de título fora da seção principal .
  3. Uso de elementos e atributos proprietários ou indefinidos em vez dos definidos nas recomendações do W3C. Por exemplo, o uso do elemento Blink ou do elemento Marquee que eram elementos não padrão originalmente suportados apenas pelos navegadores Netscape e Internet Explorer, respectivamente.

Causas e implicações

Marcação malformada

A marcação malformada é, sem dúvida, o problema mais grave na criação da web. No entanto, graças a uma melhor educação e informação e talvez com alguma ajuda do XHTML, o problema de marcação malformada está se tornando menos comum. Os navegadores, quando confrontados com uma marcação malformada, devem adivinhar o significado pretendido do autor. Eles devem inferir as tags de fechamento onde esperam e, em seguida, inferir as tags de abertura para corresponder a outras tags de fechamento. A interpretação pode variar muito de um navegador para o outro.

Embora muitos editores gráficos da web produzam uma marcação bem formada, um autor que escreve o código manualmente com um editor de texto e depois testa apenas em um navegador pode facilmente ignorar esses erros. A apresentação pode, portanto, variar drasticamente de um navegador para outro, à medida que cada um tenta "corrigir" a intenção do autor de maneiras diferentes e, em seguida, aplica um estilo a essas "correções".

Estrutura de documento inválida

Estrutura de documento inválida aqui significa apenas o uso de atributos e elementos aos quais eles não pertencem. Por exemplo, colocar um atributo "cite" em um elemento "cite" é inválido, pois os DTDs HTML e XHTML não atribuem nenhum significado a esse atributo nesse elemento. Da mesma forma, incluir um elemento "p" no conteúdo de um elemento "em" também é inválido. Com o movimento em direção à separação da marcação malformada da marcação inválida, os problemas com marcação inválida têm sido cada vez mais vistos como menos graves. Alguns começaram a defender modelos de conteúdo mais flexíveis que permitem maior flexibilidade na criação de documentos HTML (seja em HTML ou XHTML). No entanto, o uso de marcação inválida pode confundir o significado pretendido pelo autor, embora não tão severamente quanto marcação malformada.

Muitos editores gráficos da web ainda produzem marcação inválida. Além disso, muitos web designers e autores profissionais prestam pouca atenção às questões de validade. É comum ver marcações inválidas em muitos dos sites da World Wide Web.

Uso de elementos proprietários / descontinuados

Na era inicial da web (grande parte da década de 1990), o design da especificação HTML oficial tornou-se cada vez mais tenso, em comparação com o desejo dos designers de flexibilidade na criação de designs visualmente vibrantes. Em resposta a essa pressão, os fabricantes de navegadores adicionaram unilateralmente novos recursos proprietários ao HTML que estavam fora dos padrões da época. Isso significava que havia elementos proprietários em HTML que funcionavam em alguns navegadores, mas não em outros.

Até certo ponto, esse problema foi retardado pela introdução de novos padrões pelo W3C, como CSS, introduzido em 1998, que ajudou a fornecer maior flexibilidade na apresentação e layout de páginas da web sem a necessidade de um grande número de elementos HTML adicionais e atributos.

Além disso, em HTML 4 e XHTML 1, muitos elementos foram substituídos por uma única construção semântica (como elementos de objeto substituindo miniaplicativos proprietários e elementos incorporados ) ou descontinuados por serem de apresentação (como "s", "strike" e " elementos u ").

No entanto, os desenvolvedores de navegador continuaram a introduzir novos elementos em HTML quando perceberam uma necessidade. Alguns navegadores incluíam atributos tabindex em qualquer elemento. Os desenvolvedores do WebKit da Apple introduziram o elemento canvas , uma versão do qual foi posteriormente adotada pela Mozilla .

Em 2004, Apple, Mozilla e Opera fundaram o WHATWG , com a intenção de criar uma nova versão da especificação HTML que fosse compatível com todo o comportamento do navegador. Isso incluiu alterar a especificação, se necessário, para corresponder a um consenso existente entre navegadores diferentes.

Os elementos canvas e embed foram posteriormente padronizados pelo WHATWG. Certos elementos (incluindo b , i e pequeno ) que eram anteriormente considerados de apresentação e obsoletos foram incluídos, mas definidos de maneira independente da mídia, em vez de visual.

As versões da especificação WHATWG foram publicadas pelo W3C como HTML5 .

Especificações em evolução para resolver a sopa de tag

Enquanto alguns dos problemas do tag soup são devido a deficiências dos navegadores e, às vezes, devido à falta de informações para os autores da web, parte da proliferação do tag soup foi devido à falta de links nos próprios padrões da web. O W3C liderou vários esforços para resolver as deficiências dos padrões da web. À medida que mais navegadores suportam revisões mais recentes de padrões, diminui a pressão sobre os desenvolvedores da Web para usar código não padrão para resolver problemas.

Cascading Style Sheets (CSS)

Cascading Style Sheets (CSS) fornece um mecanismo para especificar a apresentação de elementos em um documento sem alterar a estrutura de marcação do documento. Antes do CSS ser comum, os desenvolvedores da web podem ter recorrido a alguma marcação estruturalmente inválida para atingir certos objetivos de apresentação - por exemplo, incluindo elementos de nível de bloco dentro de elementos inline para obter um efeito particular, ou às vezes usando um grande número de <font> e outras tags HTML específicas de exibição . CSS usa regras de estilo para realizar essas tarefas, deixando a marcação mais limpa e simples.

XML e XHTML

XHTML é uma reformulação da linguagem HTML baseada em XML . O XHTML foi desenvolvido para resolver muitos dos problemas associados à sopa de tags.

XML permite que os analisadores separem o processo de interpretação da sintaxe do documento e sua estrutura. Em HTML e SGML , um analisador precisa conhecer certas regras sobre os elementos durante a análise, como quais elementos podem estar contidos em outros elementos e quais elementos fecham implicitamente o elemento anterior. Isso ocorre porque em HTML e SGML, as tags de fechamento e até mesmo as tags de abertura eram opcionais em alguns elementos. Ao exigir que todos os elementos tenham tags de abertura e fechamento explícitos, os analisadores XML podem analisar o documento e produzir uma árvore de documento sem nenhum conhecimento do tipo de documento. Isso permite que os analisadores sejam universais e muito leves, e sejam separados do processo de validação ou interpretação do documento.

A especificação XML define claramente que um agente de usuário em conformidade (como um navegador da web) não deve aceitar um documento e não continuar analisando-o se algum erro sintático for encontrado. Assim, um navegador que interpreta uma página da web como XHTML se recusará a exibir a página se encontrar um erro de formação. Isso pode ajudar a garantir que, quando os autores testarem o código XHTML em um navegador compatível, eles sejam imediatamente informados sobre problemas de malformação: talvez o problema mais grave que os navegadores enfrentam. Quando o código está malformado, a intenção do autor é ambígua. Sem as diretivas de XML, os navegadores HTML devem usar algoritmos complexos para inferir o significado pretendido do autor em uma ampla gama de casos em que sintaxe inválida é encontrada.

XML e XHTML introduzem o conceito de namespaces. Com namespaces, autores ou comunidades de autores podem definir novos elementos e atributos com novas semânticas e misturá-los em seus documentos XHTML. Os namespaces garantem que os nomes de elementos dos vários namespaces não sejam confundidos. Por exemplo, um elemento "tabela" pode ser definido em um novo namespace com uma nova semântica diferente do elemento "tabela" HTML e o navegador será capaz de diferenciar os dois. Ao fornecer namespaces, o XHTML combinado com o CSS permite que as comunidades de autoria estendam facilmente o vocabulário semântico dos documentos. Isso acomoda o uso de elementos proprietários, desde que esses elementos possam ser apresentados ao público-alvo por meio de definições completas de folha de estilo (incluindo estilos auditivos / falados e táteis).

Os documentos XHTML podem ser veiculados na web usando o tipo de mídia da Internetapplication/xhtml+xml ou as versões text/html atuais do Microsoft Internet Explorer (6, 7 e 8) não exibem os documentos XHTML servidos como application/xhtml+xml . As versões beta do IE9 parecem ser compatíveis. Veja também a discussão deste problema no artigo XHTML .

HTML5

Artigo principal: HTML5

O HTML5 pretende ser a solução mais completa para o problema da sopa de tags até agora, enquanto permanece o mais compatível possível com versões anteriores e posteriores. Em contraste com o XHTML, que se afasta da compatibilidade com versões anteriores e adota a abordagem de que os analisadores devem se tornar menos tolerantes a marcações mal formadas, o HTML5 reconhece que o código HTML mal formado já existe em grandes quantidades e provavelmente continuará a ser usado, e considera que a especificação deve ser expandida para garantir a compatibilidade máxima com tal código.

Portanto, a especificação HTML 5 alterou sua definição de sintaxe HTML para acomodar a sintaxe comum em uso hoje e para descrever explicitamente como o "código malformado" deve ser tratado pelo analisador. A manipulação de código malformado agora tem um lugar na própria especificação, com sorte reduzindo a necessidade de futuros analisadores HTML para implementar medidas adicionais fora da especificação para lidar com código que não reconhece.

Ferramentas para consertar sopa de tag

  • HTML Tidy é uma ferramenta de software disponível para muitas plataformas que pode corrigir sintaxe inválida e a maioria da estrutura de documento inválida, convertendo código semelhante a HTML em HTML ou XHTML.
  • Aggiorno é um suplemento do Visual Studio que se concentra em tornar os sites compatíveis com os padrões
  • TagSoup é uma biblioteca Java que analisa HTML, limpa-o e entrega um fluxo de eventos SAX representando XML bem formado (não necessariamente XHTML válido). Esta ferramenta é usada para processar arquivos JNLP na implementação open source do protocolo JNLP disponível no IcedTea-Web , um subprojeto do IcedTea , o projeto de construção e integração do OpenJDK .
  • Beautiful Soup é um analisador Python do tipo DOM para HTML / XML como uma sopa.
  • tagsoup : uma biblioteca para a linguagem Haskell .

Desvios válidos de XHTML

Ao contrário do XHTML estrito, o HTML e seu predecessor SGML são projetados para serem escritos por humanos e já possuem um grau significativo de flexibilidade na sintaxe para reduzir o clichê. Essas diferenças não tornam o documento inválido e, portanto, não são uma sopa de etiquetas. O seguinte se aplica a HTML 4 e HTML5, e os exemplos datam dos primeiros dias do HTML.

  • <head>...</head> Muitas vezes, tags como podem ser completamente omitidas.
  • O fechamento de tags muitas vezes pode ser omitido porque a especificação rejeita alguns elementos aninhados em si mesma. Por exemplo, vários <li>...</li> elementos podem ser gravados sem fechar.

Apesar de sua validade, essas omissões ainda requerem um analisador especial com conhecimento de HTML (em oposição ao XML mais rígido) para analisar. Além disso, é comum que as ferramentas "consertem" essas estruturas também. Por exemplo, HTML Tidy permite omitir tags opcionais, mas o padrão é não fazê-lo.

Veja também

Notas

  • G. Ken Holman. Re: [xml-dev] O que é sopa de tag? , Lista de discussão de desenvolvimento XML, 11 de outubro de 2002. Mensagem arquivada disponível online .
  • "sopa de etiqueta." Definitions.net. STANDS4 LLC, 2013. Web. 19 de novembro de 2013. sopa .

Referências