HTML - HTML

HTML
(linguagem de marcação de hipertexto)
Logo HTML5 e wordmark.svg
O logotipo oficial da versão mais recente, HTML5
Extensão de nome de arquivo
Tipo de mídia da Internet
text / html
Digite o código TEXTO
Identificador de tipo uniforme (UTI) public.html
Desenvolvido por WHATWG
lançamento inicial 1993 ; 28 anos atrás ( 1993 )
Último lançamento
Tipo de formato Formato de arquivo de documento
Recipiente para Elementos HTML
Contido por Navegador da web
Estendido de SGML
Alargado a XHTML
Formato aberto ? sim
Local na rede Internet html .spec .whatwg .org

A linguagem de marcação de hipertexto ou HTML é a linguagem de marcação padrão para documentos projetados para serem exibidos em um navegador da web . Pode ser auxiliado por tecnologias como Cascading Style Sheets (CSS) e linguagens de script como JavaScript .

Os navegadores da Web recebem documentos HTML de um servidor da Web ou de armazenamento local e os transformam em páginas da Web multimídia. HTML descreve a estrutura de uma página da web semanticamente e originalmente incluía dicas para a aparência do documento.

Os elementos HTML são os blocos de construção das páginas HTML. Com construções HTML, imagens e outros objetos, como formulários interativos, podem ser incorporados à página renderizada. HTML fornece um meio de criar documentos estruturados denotando semântica estrutural para texto, como títulos, parágrafos, listas, links , citações e outros itens. Os elementos HTML são delineados por tags , escritos usando colchetes angulares . Tags como e introduzem conteúdo diretamente na página. Outras tags, como surround, fornecem informações sobre o texto do documento e podem incluir outras tags como subelementos. Os navegadores não exibem as tags HTML, mas as usam para interpretar o conteúdo da página. <img /><input /><p>

O HTML pode incorporar programas escritos em uma linguagem de script , como JavaScript , que afeta o comportamento e o conteúdo das páginas da web. A inclusão de CSS define a aparência e o layout do conteúdo. O World Wide Web Consortium (W3C), antigo mantenedor do HTML e atual mantenedor dos padrões CSS, tem incentivado o uso de CSS em vez de HTML de apresentação explícito desde 1997.

História

Desenvolvimento

Fotografia de Tim Berners-Lee em abril de 2009
Tim Berners-Lee em abril de 2009

Em 1980, o físico Tim Berners-Lee , um contratante do CERN , propôs e prototipou o INQUIRE , um sistema para os pesquisadores do CERN usarem e compartilharem documentos. Em 1989, Berners-Lee escreveu um memorando propondo um sistema de hipertexto baseado na Internet . Berners-Lee especificou o HTML e escreveu o navegador e o software do servidor no final de 1990. Naquele ano, Berners-Lee e o engenheiro de sistemas de dados do CERN Robert Cailliau colaboraram em um pedido conjunto de financiamento, mas o projeto não foi formalmente adotado pelo CERN. Em suas notas pessoais de 1990, ele listou "algumas das muitas áreas em que o hipertexto é usado" e colocou uma enciclopédia em primeiro lugar.

A primeira descrição de HTML publicamente disponível foi um documento chamado "HTML Tags" , mencionado pela primeira vez na Internet por Tim Berners-Lee no final de 1991. Ele descreve 18 elementos que compreendem o design inicial relativamente simples do HTML. Exceto pela tag de hiperlink, eles foram fortemente influenciados pelo SGMLguid , um formato de documentação baseado em SGML ( Standard Generalized Markup Language ) interno do CERN. Onze desses elementos ainda existem no HTML 4.

HTML é uma linguagem de marcação que os navegadores da web usam para interpretar e compor textos, imagens e outros materiais em páginas da web visuais ou audíveis. As características padrão para cada item da marcação HTML são definidas no navegador e essas características podem ser alteradas ou aprimoradas pelo uso adicional de CSS do designer da página da web . Muitos dos elementos de texto são encontrados no relatório técnico da ISO de 1988 TR 9537 Techniques for using SGML , que por sua vez cobre os recursos das primeiras linguagens de formatação de texto, como a usada pelo comando RUNOFF desenvolvido no início dos anos 1960 para o CTSS (tempo compatível - Sistema operacional de compartilhamento): esses comandos de formatação foram derivados dos comandos usados ​​por compositores para formatar documentos manualmente. No entanto, o conceito SGML de marcação generalizada é baseado em elementos (intervalos anotados aninhados com atributos) ao invés de meramente efeitos de impressão, com também a separação de estrutura e marcação; O HTML foi progressivamente movido nessa direção com o CSS.

Berners-Lee considerou o HTML uma aplicação do SGML. Foi formalmente definido como tal pela Internet Engineering Task Force (IETF) com a publicação em meados de 1993 da primeira proposta para uma especificação HTML, o "Hypertext Markup Language (HTML)" Internet Draft de Berners-Lee e Dan Connolly , que incluiu uma definição de tipo de documento SGML para definir a gramática. O rascunho expirou após seis meses, mas foi notável por seu reconhecimento da tag personalizada do navegador NCSA Mosaic para a incorporação de imagens em linha, refletindo a filosofia da IETF de basear os padrões em protótipos de sucesso. Da mesma forma, o Internet-Draft concorrente de Dave Raggett , "HTML + (Hypertext Markup Format)", do final de 1993, sugeriu padronizar recursos já implementados, como tabelas e formulários de preenchimento.

Depois que os rascunhos HTML e HTML + expiraram no início de 1994, a IETF criou um Grupo de Trabalho HTML, que em 1995 concluiu o "HTML 2.0", a primeira especificação HTML destinada a ser tratada como um padrão no qual as implementações futuras deveriam ser baseadas.

O desenvolvimento adicional sob os auspícios do IETF foi paralisado por interesses concorrentes. Desde 1996, as especificações HTML foram mantidas, com a contribuição de fornecedores de software comercial, pelo World Wide Web Consortium (W3C). No entanto, em 2000, o HTML também se tornou um padrão internacional ( ISO / IEC 15445: 2000). O HTML 4.01 foi publicado no final de 1999, com outras erratas publicadas até 2001. Em 2004, o desenvolvimento começou em HTML5 no Web Hypertext Application Technology Working Group (WHATWG), que se tornou uma entrega conjunta com o W3C em 2008, e foi concluído e padronizado em 28 de outubro de 2014.

Linha do tempo das versões HTML

HTML 2

24 de novembro de 1995
HTML 2.0 foi publicado como RFC  1866 . Suplementar RFC acrescentou capacidades:

HTML 3

14 de janeiro de 1997
HTML 3.2 foi publicado como uma recomendação do W3C . Foi a primeira versão desenvolvida e padronizada exclusivamente pelo W3C, pois a IETF havia encerrado seu HTML Working Group em 12 de setembro de 1996.
Com o codinome inicial de "Wilbur", o HTML 3.2 abandonou inteiramente as fórmulas matemáticas, reconciliou a sobreposição entre várias extensões proprietárias e adotou a maioria das tags de marcação visual do Netscape . Do Netscape elemento piscar e Microsoft 's elemento marquise foram omitidas devido a um acordo mútuo entre as duas empresas. Uma marcação para fórmulas matemáticas semelhante à do HTML não foi padronizada até 14 meses depois no MathML .

HTML 4

18 de dezembro de 1997
HTML 4.0 foi publicado como uma recomendação do W3C. Ele oferece três variações:
  • Strict, em que elementos obsoletos são proibidos
  • Transicional, em que elementos obsoletos são permitidos
  • Conjunto de quadros , no qual principalmente apenas elementos relacionados a quadros são permitidos.
Inicialmente com o codinome "Cougar", o HTML 4.0 adotou muitos tipos e atributos de elementos específicos do navegador, mas ao mesmo tempo procurou eliminar os recursos de marcação visual do Netscape marcando-os como obsoletos em favor de folhas de estilo. HTML 4 é um aplicativo SGML em conformidade com a ISO 8879 - SGML.
24 de abril de 1998
O HTML 4.0 foi relançado com pequenas edições sem incrementar o número da versão.
24 de dezembro de 1999
HTML 4.01 foi publicado como uma recomendação do W3C. Ele oferece as mesmas três variações do HTML 4.0 e sua última errata foi publicada em 12 de maio de 2001.
Maio de 2000
ISO / IEC 15445: 2000 (" ISO HTML", baseado em HTML 4.01 Strict) foi publicado como um padrão internacional ISO / IEC. Na ISO, esta norma cai no domínio da ISO / IEC JTC1 / SC34 (ISO / IEC Joint Technical Committee 1, Subcom Committee 34 - Document description and processing linguagens).
Depois do HTML 4.01, não houve nenhuma nova versão do HTML por muitos anos, pois o desenvolvimento da linguagem paralela baseada em XML XHTML ocupou o HTML Working Group do W3C no início e meados dos anos 2000.

HTML 5

28 de outubro de 2014
HTML5 foi publicado como uma recomendação do W3C.
1 de novembro de 2016
O HTML 5.1 foi publicado como uma recomendação do W3C.
14 de dezembro de 2017
HTML 5.2 foi publicado como uma recomendação do W3C.

Linha do tempo da versão de rascunho de HTML

Outubro de 1991
Tags HTML , um documento CERN informal listando 18 tags HTML, foi mencionado pela primeira vez em público.
Junho de 1992
Primeiro rascunho informal do HTML DTD, com sete revisões subsequentes (15 de julho, 6 de agosto, 18 de agosto, 17 de novembro, 19 de novembro, 20 de novembro, 22 de novembro)
Novembro de 1992
HTML DTD 1.1 (o primeiro com um número de versão, com base nas revisões RCS, que começam com 1.1 em vez de 1.0), um rascunho informal
Junho de 1993
Hypertext Markup Language foi publicado pelo IETF IIIR Working Group como um Internet Draft (uma proposta aproximada para um padrão). Foi substituído por uma segunda versão um mês depois.
Novembro de 1993
HTML + foi publicado pela IETF como um rascunho da Internet e era uma proposta concorrente do rascunho da Hypertext Markup Language. Ele expirou em julho de 1994.
Novembro de 1994
O primeiro rascunho (revisão 00) do HTML 2.0 publicado pela própria IETF (denominado "HTML 2.0" da revisão 02), que finalmente levou à publicação do RFC  1866 em novembro de 1995.
Abril de 1995 (de autoria de março de 1995)
O HTML 3.0 foi proposto como um padrão para a IETF, mas a proposta expirou cinco meses depois (28 de setembro de 1995) sem outras ações. Ele incluiu muitos dos recursos que estavam na proposta HTML + de Raggett, como suporte para tabelas, fluxo de texto em torno de figuras e a exibição de fórmulas matemáticas complexas.
O W3C iniciou o desenvolvimento de seu próprio navegador Arena como um ambiente de teste para HTML 3 e Cascading Style Sheets, mas o HTML 3.0 não teve sucesso por vários motivos. O rascunho era considerado muito grande com 150 páginas e o ritmo de desenvolvimento do navegador, assim como o número de partes interessadas, ultrapassou os recursos do IETF. Os fornecedores de navegadores, incluindo a Microsoft e a Netscape na época, optaram por implementar diferentes subconjuntos de recursos de rascunho do HTML 3, bem como introduzir suas próprias extensões. (veja guerras de navegador ). Isso incluía extensões para controlar os aspectos estilísticos dos documentos, ao contrário da "crença [da comunidade acadêmica de engenharia] de que coisas como cor do texto, textura do fundo, tamanho da fonte e face da fonte estavam definitivamente fora do escopo de um idioma quando sua única intenção era para especificar como um documento seria organizado. " Dave Raggett, que é bolsista do W3C há muitos anos, comentou, por exemplo: "Até certo ponto, a Microsoft construiu seus negócios na Web estendendo os recursos de HTML".
Logotipo oficial HTML5
Logo do HTML5
Janeiro de 2008
HTML5 foi publicado como um Working Draft pelo W3C.
Embora sua sintaxe seja muito semelhante à do SGML , o HTML5 abandonou qualquer tentativa de ser um aplicativo SGML e definiu explicitamente sua própria serialização "html", além de uma serialização XHTML5 alternativa baseada em XML.
HTML5 2011 - última chamada
Em 14 de fevereiro de 2011, o W3C estendeu o estatuto de seu Grupo de Trabalho HTML com marcos claros para HTML5. Em maio de 2011, o grupo de trabalho avançou o HTML5 para "Última Chamada", um convite às comunidades dentro e fora do W3C para confirmar a solidez técnica da especificação. O W3C desenvolveu um conjunto de testes abrangente para alcançar ampla interoperabilidade para a especificação completa até 2014, que era a data prevista para recomendação. Em janeiro de 2011, o WHATWG renomeou seu padrão de vida "HTML5" para "HTML". O W3C, no entanto, continua seu projeto para lançar o HTML5.
HTML5 de 2012 - recomendação do candidato
Em julho de 2012, WHATWG e W3C decidiram sobre um grau de separação. O W3C continuará o trabalho de especificação do HTML5, focando em um único padrão definitivo, que é considerado um "instantâneo" pelo WHATWG. A organização WHATWG continuará seu trabalho com o HTML5 como um "padrão de vida". O conceito de padrão de vida é que nunca está completo e está sempre sendo atualizado e melhorado. Novos recursos podem ser adicionados, mas a funcionalidade não será removida.
Em dezembro de 2012, o W3C designou o HTML5 como uma recomendação candidata. O critério para avançar para a recomendação W3C é "duas implementações 100% completas e totalmente interoperáveis".
HTML5 2014 - recomendação e recomendação propostas
Em setembro de 2014, o W3C mudou o HTML5 para a recomendação proposta.
Em 28 de outubro de 2014, o HTML5 foi lançado como uma recomendação W3C estável, o que significa que o processo de especificação está completo.

Versões XHTML

XHTML é uma linguagem separada que começou como uma reformulação do HTML 4.01 usando XML 1.0. Ele não está mais sendo desenvolvido como um padrão separado.

  • O XHTML 1.0 foi publicado como uma recomendação do W3C em 26 de janeiro de 2000, e posteriormente revisado e republicado em 1º de agosto de 2002. Ele oferece as mesmas três variações do HTML 4.0 e 4.01, reformulado em XML, com pequenas restrições.
  • O XHTML 1.1 foi publicado como uma recomendação do W3C em 31 de maio de 2001. É baseado no XHTML 1.0 Strict, mas inclui pequenas alterações, pode ser customizado e é reformulado usando módulos na recomendação do W3C "Modularização de XHTML", que foi publicada em 10 de abril de 2001.
  • XHTML 2.0 era um rascunho de trabalho, o trabalho nele foi abandonado em 2009 em favor do trabalho em HTML5 e XHTML5 . XHTML 2.0 era incompatível com XHTML 1.x e, portanto, seria mais precisamente caracterizado como uma nova linguagem inspirada em XHTML do que uma atualização para XHTML 1.x.
  • Uma sintaxe XHTML, conhecida como "XHTML5.1", está sendo definida junto com HTML5 no rascunho de HTML5.

Transição da publicação HTML para WHATWG

Em 28 de maio de 2019, o W3C anunciou que WHATWG seria o único editor dos padrões HTML e DOM. O W3C e o WHATWG publicavam padrões concorrentes desde 2012. Embora o padrão W3C fosse idêntico ao WHATWG em 2007, os padrões divergiram progressivamente devido a diferentes decisões de design. O WHATWG "Padrão de vida" foi o padrão da web de fato por algum tempo.

Markup

A marcação HTML consiste em vários componentes principais, incluindo aqueles chamados tags (e seus atributos ), tipos de dados baseados em caracteres , referências de caracteres e referências de entidades . As tags HTML geralmente vêm em pares como e , embora algumas representem elementos vazios e, portanto, não sejam pareados, por exemplo . A primeira tag desse par é a tag inicial e a segunda é a tag final (também são chamadas de tags de abertura e de fechamento ). <h1></h1><img>

Outro componente importante é a declaração do tipo de documento HTML , que dispara a renderização do modo de padrões .

A seguir está um exemplo do clássico "Hello, World!" programa :

<!DOCTYPE html>
<html>
  <head>
    <title>This is a title</title>
  </head>
  <body>
    <div>
        <p>Hello world!</p>
    </div>
  </body>
</html>

O texto entre e descreve a página da web e o texto entre e é o conteúdo visível da página. O texto de marcação define o título da página do navegador mostrado nas guias do navegador e títulos das janelas , e a tag define uma divisão da página usada para estilização fácil. <html></html><body></body><title>This is a title</title><div>

A declaração do tipo de documento <!DOCTYPE html>é para HTML5. Se uma declaração não for incluída, vários navegadores reverterão para o " modo quirks " para renderização.

Elementos

Documentos HTML implicam em uma estrutura de elementos HTML aninhados . Estas são indicadas no documento de HTML marcas , entre colchetes angulares assim: . <p>

No caso geral simples, a extensão de um elemento é indicada por um par de tags: uma "tag inicial" e "tag final" . O conteúdo de texto do elemento, se houver, é colocado entre essas tags. <p></p>

As tags também podem incluir marcação de tag adicional entre o início e o fim, incluindo uma mistura de tags e texto. Isso indica outros elementos (aninhados), como filhos do elemento pai.

A tag de início também pode incluir atributos do elemento dentro da tag. Eles indicam outras informações, como identificadores para seções dentro do documento, identificadores usados ​​para vincular informações de estilo à apresentação do documento e, para algumas tags, como o usado para incorporar imagens, a referência ao recurso de imagem no formato como este :<img><img src="example.com/example.jpg">

Alguns elementos, como a quebra de linha , ou não permitem qualquer conteúdo embutido, seja texto ou outras tags. Eles exigem apenas uma única tag vazia (semelhante a uma tag inicial) e não usam uma tag final. <br><br />

Muitas tags, especialmente a tag de fechamento final para o elemento de parágrafo comumente usado , são opcionais. Um navegador HTML ou outro agente pode inferir o fechamento para o final de um elemento a partir do contexto e das regras estruturais definidas pelo padrão HTML. Essas regras são complexas e não são amplamente compreendidas pela maioria dos programadores de HTML. <p>

A forma geral de um elemento de HTML é, por conseguinte,: . Alguns elementos HTML são definidos como elementos vazios e assumem a forma . Os elementos vazios não podem conter nenhum conteúdo, por exemplo, a tag ou a tag inline . O nome de um elemento HTML é o nome usado nas tags. Observe que o nome da tag final é precedido por uma barra , e que em elementos vazios a tag final não é necessária nem permitida. Se os atributos não forem mencionados, os valores padrão serão usados ​​em cada caso. <tag attribute1="value1" attribute2="value2">''content''</tag><tag attribute1="value1" attribute2="value2"><br><img>/

Exemplos de elementos

Cabeçalho do documento HTML: . O título está incluído no cabeçalho, por exemplo: <head>...</head>

<head>
  <title>The Title</title>
  <link rel="stylesheet" href="stylebyjimbowales.css" /> <!-- Imports Stylesheets -->
</head>

Títulos: títulos HTML são definidos com o de marcas com H1 sendo o mais alto (ou mais importante) nível e H6 a menos: <h1><h6>

<h1>Heading level 1</h1>
<h2>Heading level 2</h2>
<h3>Heading level 3</h3>
<h4>Heading level 4</h4>
<h5>Heading level 5</h5>
<h6>Heading level 6</h6>

Os efeitos são:

Título de nível 1
Título de nível 2
Nível de cabeçalho 3
Título de nível 4
Título de nível 5
Nível 6 do título

Observe que o CSS pode alterar drasticamente a renderização.

Parágrafos:

<p>Paragraph 1</p> <p>Paragraph 2</p>

Quebras de linha: . A diferença entre e é que quebra uma linha sem alterar a estrutura semântica da página, enquanto divide a página em parágrafos . O elemento é um elemento vazio porque, embora possa ter atributos, não pode receber nenhum conteúdo e não pode ter uma tag de finalização. <br><br><p><br> <p><br>

<p>This <br> is a paragraph <br> with <br> line breaks</p>

Este é um link em HTML. Para criar um link, a tag é usada. O atributo contém o endereço URL do link. <a>href

<a href="https://www.wikipedia.org/">A link to Wikipedia!</a>

Entradas:

Existem muitas maneiras possíveis de um usuário dar entrada / s, como:

<input type="text" /> <!-- This is for text input -->
<input type="file" /> <!-- This is for uploading files -->
<input type="checkbox" /> <!-- This is for checkboxes -->

Comentários:

<!-- This is a comment -->

Os comentários podem ajudar na compreensão da marcação e não são exibidos na página da web.

Existem vários tipos de elementos de marcação usados ​​em HTML:

A marcação estrutural indica a finalidade do texto
Por exemplo, estabelece "Golf" como um segundo nível título . A marcação estrutural não denota qualquer renderização específica, mas a maioria dos navegadores da web tem estilos padrão para a formatação do elemento. O conteúdo pode ser ainda mais estilizado usando Cascading Style Sheets (CSS).<h2>Golf</h2>
A marcação de apresentação indica a aparência do texto, independentemente de sua finalidade
Por exemplo, indica que os dispositivos de saída visual devem renderizar "negrito" em texto em negrito, mas dá pouca indicação sobre o que os dispositivos que não podem fazer isso (como dispositivos aurais que leem o texto em voz alta) devem fazer. No caso de e , existem outros elementos que podem ter representações visuais equivalentes, mas que são de natureza mais semântica, como e respectivamente. É mais fácil ver como um agente de usuário auditivo deve interpretar os dois últimos elementos. No entanto, eles não são equivalentes às suas contrapartes de apresentação: seria indesejável para um leitor de tela enfatizar o nome de um livro, por exemplo, mas em uma tela tal nome ficaria em itálico. A maioria dos elementos de marcação de apresentação se tornou obsoleta sob a especificação HTML 4.0 em favor do uso de CSS para estilização.<b>bold text</b><b>bold text</b><i>italic text</i><strong>strong text</strong><em>emphasized text</em>
A marcação de hipertexto transforma partes de um documento em links para outros documentos
Um elemento âncora cria um hiperlink no documento e seu hrefatributo define a URL de destino do link . Por exemplo, a marcação HTML renderizará a palavra " Wikipedia " como um hiperlink. Para renderizar uma imagem como um hiperlink, um elemento é inserido como conteúdo no elemento. Como , é um elemento vazio com atributos, mas sem conteúdo ou tag de fechamento. .<a href="https://www.google.com/">Wikipedia</a>imgabrimg<a href="https://example.org"><img src="image.gif" alt="descriptive text" width="50" height="50" border="0"></a>

Atributos

A maioria dos atributos de um elemento são pares nome-valor , separados por =e escritos na tag inicial de um elemento após o nome do elemento. O valor pode ser colocado entre aspas simples ou duplas, embora os valores que consistem em certos caracteres possam ser deixados sem aspas em HTML (mas não em XHTML). Deixar os valores dos atributos sem aspas é considerado inseguro. Em contraste com os atributos do par nome-valor, existem alguns atributos que afetam o elemento simplesmente por sua presença na tag inicial do elemento, como o ismapatributo para o imgelemento.

Existem vários atributos comuns que podem aparecer em muitos elementos:

  • O idatributo fornece um identificador exclusivo em todo o documento para um elemento. Isso é usado para identificar o elemento para que as folhas de estilo possam alterar suas propriedades de apresentação e os scripts possam alterar, animar ou excluir seu conteúdo ou apresentação. Anexado ao URL da página, ele fornece um identificador globalmente exclusivo para o elemento, normalmente uma subseção da página. Por exemplo, o ID "Atributos" em https://en.wikipedia.org/wiki/HTML#Attributes.
  • O classatributo fornece uma maneira de classificar elementos semelhantes. Isso pode ser usado para fins semânticos ou de apresentação. Por exemplo, um documento HTML pode usar semanticamente a designação para indicar que todos os elementos com este valor de classe são subordinados ao texto principal do documento. Na apresentação, esses elementos podem ser reunidos e apresentados como notas de rodapé em uma página, em vez de aparecer no local onde ocorrem no código-fonte HTML. Os atributos de classe são usados ​​semanticamente em microformatos . Vários valores de classe podem ser especificados; por exemplo, coloca o elemento em ambos os e as classes.<class="notation"><class="notation important">notationimportant
  • Um autor pode usar o styleatributo para atribuir propriedades de apresentação a um elemento específico. É considerada uma prática recomendada usar um elemento idou classatributos para selecionar o elemento em uma folha de estilo , embora às vezes isso possa ser muito complicado para um estilo simples, específico ou ad hoc.
  • O titleatributo é usado para anexar uma explicação subtextual a um elemento. Na maioria dos navegadores, esse atributo é exibido como uma dica de ferramenta .
  • O langatributo identifica a linguagem natural do conteúdo do elemento, que pode ser diferente daquela do resto do documento. Por exemplo, em um documento em inglês:
    <p>Oh well, <span lang="fr">c'est la vie</span>, as they say in France.</p>
    

O elemento de abreviação,, abbrpode ser usado para demonstrar alguns desses atributos:

<abbr id="anId" class="jargon" style="color:purple;" title="Hypertext Markup Language">HTML</abbr>

Este exemplo é exibido como HTML ; na maioria dos navegadores, apontar o cursor para a abreviatura deve exibir o texto do título "Linguagem de marcação de hipertexto".

A maioria dos elementos usa o atributo relacionado ao idioma dirpara especificar a direção do texto, como com "rtl" para texto da direita para a esquerda em, por exemplo, árabe , persa ou hebraico .

Referências de personagem e entidade

A partir da versão 4.0, o HTML define um conjunto de referências de entidades de 252 caracteres e um conjunto de 1.114.050 referências de caracteres numéricos , ambos permitindo que caracteres individuais sejam escritos por meio de marcação simples, em vez de literalmente. Um caractere literal e sua contraparte de marcação são considerados equivalentes e são processados ​​de forma idêntica.

A capacidade de " escapar " dos caracteres dessa maneira permite que os caracteres <e &(quando escritos como &lt;e &amp;, respectivamente) sejam interpretados como dados de caractere, em vez de marcação. Por exemplo, um literal <normalmente indica o início de uma tag e &normalmente indica o início de uma referência de entidade de caractere ou referência de caractere numérico; escrevê-lo como &amp;ou &#x26;ou &#38;permite &ser incluído no conteúdo de um elemento ou no valor de um atributo. O caractere de aspas duplas ( "), quando não usado para citar um valor de atributo, também deve ser escapado como &quot;ou &#x22;ou &#34;quando aparecer dentro do próprio valor de atributo. Da mesma forma, o caractere de aspas simples ( '), quando não usado para citar um valor de atributo, também deve ser escapado como &#x27;ou &#39;(ou como &apos;em documentos HTML5 ou XHTML) quando aparecer dentro do próprio valor de atributo. Se os autores do documento negligenciarem a necessidade de escapar desses caracteres, alguns navegadores podem ser muito complacentes e tentar usar o contexto para adivinhar sua intenção. O resultado ainda é uma marcação inválida, o que torna o documento menos acessível a outros navegadores e outros agentes de usuário que podem tentar analisar o documento para fins de pesquisa e indexação , por exemplo.

O escape também permite que os caracteres que não são facilmente digitados ou que não estão disponíveis na codificação de caracteres do documento sejam representados no conteúdo do elemento e do atributo. Por exemplo, o acento agudo e( é), um caractere normalmente encontrado apenas em teclados da Europa Ocidental e da América do Sul, pode ser escrito em qualquer documento HTML como referência de entidade &eacute;ou como referências numéricas &#xE9;ou &#233;, usando caracteres que estão disponíveis em todos os teclados e são suportados em todas as codificações de caracteres. Codificações de caracteres Unicode , como UTF-8, são compatíveis com todos os navegadores modernos e permitem acesso direto a quase todos os caracteres dos sistemas de escrita do mundo.

Exemplo de sequências de escape HTML
Nomeado Decimal Hexadecimal Resultado Descrição Notas
&amp; &#38; &#x26; & E comercial
&lt; &#60; &#x3C; < Menor que
&gt; &#62; &#x3e; > Maior que
&quot; &#34; &#x22; " Citação dupla
&apos; &#39; &#x27; ' Citação única
&nbsp; &#160; &#xA0; Espaço inquebrável
&copy; &#169; &#xA9; © direito autoral
&reg; &#174; &#xAE; ® Marca registrada
&dagger; &#8224; &#x2020; Punhal
&Dagger; &#8225; &#x2021; Punhal duplo Os nomes diferenciam maiúsculas de minúsculas
&ddagger; &#8225; &#x2021; Punhal duplo Os nomes podem ter sinônimos
&trade; &#8482; &#x2122; Marca comercial

Tipos de dados

HTML define vários tipos de dados para conteúdo de elemento, como dados de script e dados de folha de estilo, e uma infinidade de tipos de valores de atributo, incluindo IDs, nomes, URIs, números, unidades de comprimento, idiomas, descritores de mídia, cores, codificações de caracteres, datas e horários, e assim por diante. Todos esses tipos de dados são especializações de dados de caractere.

Declaração de tipo de documento

Os documentos HTML são necessários para começar com uma Declaração de Tipo de Documento (informalmente, um "doctype"). Em navegadores, o doctype ajuda a definir o modo de renderização - principalmente se usar o modo quirks .

O propósito original do doctype era permitir a análise e validação de documentos HTML por ferramentas SGML baseadas na Document Type Definition (DTD). O DTD ao qual o DOCTYPE se refere contém uma gramática legível por máquina que especifica o conteúdo permitido e proibido para um documento em conformidade com esse DTD. Os navegadores, por outro lado, não implementam HTML como uma aplicação de SGML e, por consequência, não leem o DTD.

HTML5 não define um DTD; portanto, em HTML5, a declaração doctype é mais simples e mais curta:

<!DOCTYPE html>

Um exemplo de um doctype HTML 4

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "https://www.w3.org/TR/html4/strict.dtd">

Esta declaração faz referência ao DTD para a versão "estrita" do HTML 4.01. Os validadores baseados em SGML leem o DTD para analisar corretamente o documento e realizar a validação. Em navegadores modernos, um doctype válido ativa o modo padrão em oposição ao modo quirks .

Além disso, o HTML 4.01 fornece DTDs de transição e de conjunto de quadros, conforme explicado a seguir . O tipo de transição é o mais inclusivo, incorporando tags atuais, bem como tags mais antigas ou "obsoletas", com o Strict DTD excluindo tags obsoletas. O conjunto de quadros tem todas as marcas necessárias para fazer quadros em uma página junto com as marcas incluídas no tipo de transição.

HTML semântico

HTML semântico é uma forma de escrever HTML que enfatiza o significado das informações codificadas sobre sua apresentação (aparência). HTML incluiu marcação semântica desde o seu início, mas também incluiu marcação de apresentação, tais como , e tags. Existem também as tags span e div semanticamente neutras . Desde o final da década de 1990, quando o Cascading Style Sheets estava começando a funcionar na maioria dos navegadores, os autores da web foram incentivados a evitar o uso de marcação HTML de apresentação com o objetivo de separar a apresentação do conteúdo . <font><i><center>

Em uma discussão de 2001 sobre a Web Semântica , Tim Berners-Lee e outros deram exemplos de maneiras pelas quais "agentes" de software inteligente podem um dia rastrear automaticamente a web e encontrar, filtrar e correlacionar fatos publicados anteriormente não relacionados para o benefício de usuários humanos . Esses agentes não são comuns até agora, mas algumas das ideias da Web 2.0 , mashups e sites de comparação de preços podem estar chegando perto. A principal diferença entre esses híbridos de aplicativos da web e os agentes semânticos de Berners-Lee reside no fato de que a agregação e hibridização atuais de informações geralmente são projetadas por desenvolvedores da web , que já conhecem os locais da web e a semântica da API dos dados específicos que desejam para misturar, comparar e combinar.

Um tipo importante de agente da web que rastreia e lê páginas da web automaticamente, sem conhecimento prévio do que pode encontrar, é o rastreador da web ou o mecanismo de busca spider. Esses agentes de software dependem da clareza semântica das páginas da web que encontram, pois usam várias técnicas e algoritmos para ler e indexar milhões de páginas da web por dia e fornecer aos usuários da web recursos de pesquisa sem os quais a utilidade da World Wide Web seria muito reduzida.

Para que os spiders do mecanismo de pesquisa possam avaliar a importância dos trechos de texto que encontram em documentos HTML, e também para aqueles que criam mashups e outros híbridos, bem como para agentes mais automatizados à medida que são desenvolvidos, as estruturas semânticas existentes em HTML precisam ser amplamente e uniformemente aplicados para revelar o significado do texto publicado.

As tags de marcação de apresentação foram descontinuadas nas recomendações atuais de HTML e XHTML . A maioria dos recursos de apresentação de versões anteriores de HTML não são mais permitidos, pois levam a uma acessibilidade mais pobre, maior custo de manutenção do site e tamanhos maiores de documentos.

Um bom HTML semântico também melhora a acessibilidade de documentos da web (consulte também Diretrizes de acessibilidade de conteúdo da web ). Por exemplo, quando um leitor de tela ou navegador de áudio pode determinar corretamente a estrutura de um documento, ele não desperdiçará o tempo do usuário com deficiência visual lendo informações repetidas ou irrelevantes quando tiverem sido marcadas corretamente.

Entrega

Os documentos HTML podem ser entregues da mesma forma que qualquer outro arquivo de computador. No entanto, eles são geralmente entregues por HTTP de um servidor da web ou por e-mail .

HTTP

A World Wide Web é composta principalmente de documentos HTML transmitidos de servidores da web para navegadores da web usando o protocolo de transferência de hipertexto (HTTP). No entanto, o HTTP é usado para servir imagens, som e outros conteúdos, além de HTML. Para permitir que o navegador da web saiba como lidar com cada documento que recebe, outras informações são transmitidas junto com o documento. Esses metadados geralmente incluem o tipo MIME (por exemplo, text/htmlou application/xhtml+xml) e a codificação de caracteres (consulte Codificação de caracteres em HTML ).

Em navegadores modernos, o tipo MIME enviado com o documento HTML pode afetar a forma como o documento é interpretado inicialmente. Espera-se que um documento enviado com o tipo XHTML MIME seja um XML bem formado ; Erros de sintaxe podem fazer com que o navegador falhe ao renderizá-lo. O mesmo documento enviado com o tipo HTML MIME pode ser exibido com sucesso, uma vez que alguns navegadores são mais tolerantes com HTML.

As recomendações do W3C afirmam que os documentos XHTML 1.0 que seguem as diretrizes estabelecidas no Apêndice C da recomendação podem ser rotulados com qualquer tipo de MIME. O XHTML 1.1 também afirma que os documentos XHTML 1.1 devem ser rotulados com qualquer um dos tipos MIME.

E-mail HTML

A maioria dos clientes de e-mail gráfico permite o uso de um subconjunto de HTML (geralmente mal definido) para fornecer formatação e marcação semântica não disponíveis com texto simples . Isso pode incluir informações tipográficas, como títulos coloridos, texto enfatizado e citado, imagens embutidas e diagramas. Muitos desses clientes incluem um editor de GUI para compor mensagens de e-mail em HTML e um mecanismo de renderização para exibi-las. O uso de HTML em e-mail é criticado por alguns por causa de problemas de compatibilidade, porque pode ajudar a disfarçar ataques de phishing , por causa de problemas de acessibilidade para cegos ou deficientes visuais, porque pode confundir filtros de spam e porque o tamanho da mensagem é maior do que o normal texto.

Convenções de nomenclatura

A extensão de nome de arquivo mais comum para arquivos contendo HTML é .html. Uma abreviatura comum para isso é .htm, que se originou porque alguns sistemas operacionais e sistemas de arquivos antigos, como o DOS e as limitações impostas pela estrutura de dados FAT , limitavam as extensões de arquivo a três letras .

Aplicativo HTML

Um aplicativo HTML (HTA; extensão de arquivo ".hta") é um aplicativo do Microsoft Windows que usa HTML e HTML dinâmico em um navegador para fornecer a interface gráfica do aplicativo. Um arquivo HTML normal está confinado ao modelo de segurança do navegador da web , comunicando-se apenas com os servidores da web e manipulando apenas objetos de página da web e cookies do site . Um HTA é executado como um aplicativo totalmente confiável e, portanto, tem mais privilégios, como criação / edição / remoção de arquivos e entradas do Registro do Windows . Como eles operam fora do modelo de segurança do navegador, os HTAs não podem ser executados via HTTP, mas devem ser baixados (assim como um arquivo EXE ) e executados a partir do sistema de arquivos local.

Variações HTML4

Desde o seu início, o HTML e seus protocolos associados ganharam aceitação relativamente rápido. No entanto, não existiam padrões claros nos primeiros anos da língua. Embora seus criadores tenham originalmente concebido o HTML como uma linguagem semântica desprovida de detalhes de apresentação, os usos práticos empurraram muitos elementos e atributos de apresentação para a linguagem, impulsionados em grande parte pelos vários fornecedores de navegadores. Os padrões mais recentes em torno do HTML refletem os esforços para superar o desenvolvimento às vezes caótico da linguagem e para criar uma base racional para a construção de documentos significativos e bem apresentados. Para retornar o HTML ao seu papel de linguagem semântica, o W3C desenvolveu linguagens de estilo, como CSS e XSL, para arcar com o fardo da apresentação. Em conjunto, a especificação HTML lentamente refreou os elementos de apresentação.

Existem dois eixos que diferenciam várias variações de HTML conforme especificado atualmente: HTML baseado em SGML versus HTML baseado em XML (referido como XHTML) em um eixo, e estrito versus transicional (solto) versus conjunto de quadros no outro eixo.

Baseado em SGML versus HTML baseado em XML

Uma diferença nas especificações HTML mais recentes está na distinção entre a especificação baseada em SGML e a especificação baseada em XML. A especificação baseada em XML é geralmente chamada de XHTML para distingui-la claramente da definição mais tradicional. No entanto, o nome do elemento raiz continua a ser "html" mesmo no HTML especificado pelo XHTML. O W3C pretendia que o XHTML 1.0 fosse idêntico ao HTML 4.01, exceto onde as limitações do XML sobre o SGML mais complexo exigem soluções alternativas. Como o XHTML e o HTML estão intimamente relacionados, às vezes eles são documentados em paralelo. Em tais circunstâncias, alguns autores combinam os dois nomes como (X) HTML ou X (HTML).

Como o HTML 4.01, o XHTML 1.0 tem três subespecificações: estrito, transicional e conjunto de quadros.

Além das diferentes declarações de abertura para um documento, as diferenças entre um documento HTML 4.01 e XHTML 1.0 - em cada um dos DTDs correspondentes - são amplamente sintáticas. A sintaxe subjacente do HTML permite muitos atalhos que o XHTML não permite, como elementos com tags de abertura ou fechamento opcionais e até mesmo elementos vazios que não devem ter uma tag de finalização. Em contraste, o XHTML requer que todos os elementos tenham uma tag de abertura e uma tag de fechamento. XHTML, no entanto, também introduz um novo atalho: uma etiqueta XHTML pode ser aberto e fechado dentro da mesma etiqueta, através da inclusão de uma barra antes do final da tag como este: . A introdução deste atalho, que não é usado na declaração SGML para HTML 4.01, pode confundir software anterior não familiarizado com esta nova convenção. Uma correção para isso é incluir um espaço antes de fechar a tag, como tal: . <br/><br />

Para entender as diferenças sutis entre HTML e XHTML, considere a transformação de um documento XHTML 1.0 válido e bem formado que segue o Apêndice C (veja abaixo) em um documento HTML 4.01 válido. Para fazer essa tradução, são necessárias as seguintes etapas:

  1. O idioma de um elemento deve ser especificado com um langatributo em vez do xml:langatributo XHTML . XHTML usa o atributo de funcionalidade de definição de linguagem embutido do XML.
  2. Remova o namespace XML ( xmlns=URI). HTML não tem recursos para namespaces.
  3. Altere a declaração do tipo de documento de XHTML 1.0 para HTML 4.01. (consulte a seção DTD para obter mais explicações).
  4. Se presente, remova a declaração XML. (Normalmente é:) <?xml version="1.0" encoding="utf-8"?>.
  5. Certifique-se de que o tipo MIME do documento esteja definido como text/html. Para HTML e XHTML, isso vem do Content-Typecabeçalho HTTP enviado pelo servidor.
  6. Altere a sintaxe de elemento vazio XML para um elemento vazio de estilo HTML ( para ).<br /><br>

Essas são as principais mudanças necessárias para traduzir um documento de XHTML 1.0 para HTML 4.01. Traduzir de HTML para XHTML também exigiria a adição de quaisquer tags de abertura ou fechamento omitidas. Quer esteja codificando em HTML ou XHTML, pode ser melhor sempre incluir as tags opcionais em um documento HTML em vez de lembrar quais tags podem ser omitidas.

Um documento XHTML bem formado atende a todos os requisitos de sintaxe do XML. Um documento válido segue a especificação de conteúdo para XHTML, que descreve a estrutura do documento.

O W3C recomenda várias convenções para garantir uma migração fácil entre HTML e XHTML (consulte Diretrizes de compatibilidade de HTML ). As etapas a seguir podem ser aplicadas apenas a documentos XHTML 1.0:

  • Inclua os atributos xml:lange langem quaisquer elementos que atribuam linguagem.
  • Use a sintaxe de elemento vazio apenas para elementos especificados como vazios em HTML.
  • Inclua um espaço extra nas tags de elemento vazio: por exemplo, em vez de .<br /><br>
  • Inclui tags de fechamento explícitas para elementos que permitem conteúdo, mas são deixados vazios (por exemplo , não ).<div></div><div />
  • Omita a declaração XML.

Seguindo cuidadosamente as diretrizes de compatibilidade do W3C, um agente de usuário deve ser capaz de interpretar o documento igualmente como HTML ou XHTML. Para documentos que são XHTML 1.0 e foram tornados compatíveis dessa forma, o W3C permite que eles sejam servidos como HTML (com um text/html tipo MIME ) ou como XHTML (com um tipo application/xhtml+xmlou application/xmlMIME). Quando entregues como XHTML, os navegadores devem usar um analisador XML, que segue estritamente as especificações XML para analisar o conteúdo do documento.

Transicional versus estrito

O HTML 4 definiu três versões diferentes da linguagem: Strict, Transitional (uma vez chamado Loose) e Frameset. A versão Strict destina-se a novos documentos e é considerada a prática recomendada, enquanto as versões Transitional e Frameset foram desenvolvidas para facilitar a transição de documentos que estavam em conformidade com especificações HTML mais antigas ou que não estavam em conformidade com nenhuma especificação de uma versão do HTML 4. As versões Transitional e Frameset permitem marcação de apresentação, que é omitida na versão Strict. Em vez disso, as folhas de estilo em cascata são incentivadas a melhorar a apresentação de documentos HTML. Como o XHTML 1 apenas define uma sintaxe XML para a linguagem definida pelo HTML 4, as mesmas diferenças se aplicam ao XHTML 1 também.

A versão de transição permite as seguintes partes do vocabulário, que não estão incluídas na versão estrita:

  • Um modelo de conteúdo mais flexível
    • Elementos inline e texto simples são permitidos diretamente em: body, blockquote, form, noscriptenoframes
  • Elementos relacionados à apresentação
    • underline ( u) (obsoleto. pode confundir um visitante com um hiperlink.)
    • tachado ( s)
    • center (Obsoleto. Use CSS em vez disso.)
    • font (Obsoleto. Use CSS em vez disso.)
    • basefont (Obsoleto. Use CSS em vez disso.)
  • Atributos relacionados à apresentação
    • background(Obsoleto. Use CSS no lugar.) E bgcolor(Obsoleto. Use CSS no lugar.) Atributos para body(elemento obrigatório de acordo com o W3C.).
    • align(Preterido. Uso CSS em vez disso.) Atributo em div, form, parágrafo ( p() e dirigem h1... h6) elementos
    • align(Obsoleto. Use CSS no lugar.), noshade(Obsoleto. Use CSS no lugar.), size(Obsoleto. Use CSS no lugar.) E width(Obsoleto. Use CSS no lugar.) Atributos no hrelemento
    • align, (Preterido uso CSS em seu lugar..) border, vspaceE hspaceatributos em imge object(Atenção: O objectelemento só é suportada no Internet Explorer (a partir dos principais navegadores)) elementos
    • align(Obsoleto. Use CSS.) Atributo nos elementos legendecaption
    • align(Obsoleto. Use CSS no lugar.) E bgcolor(Obsoleto. Use CSS no lugar.) No tableelemento
    • nowrap(Obsoleto), bgcolor(obsoleto. Uso CSS em seu lugar.), width, heightEm tde thelementos
    • bgcolor(Obsoleto. Use CSS.) Atributo no trelemento
    • clearAtributo (obsoleto) no brelemento
    • compactatributo em dl, dire menuelementos
    • type(Obsoleto. Use CSS no lugar.), compact(Obsoleto. Use CSS no lugar.) E start(Obsoleto. Use CSS no lugar.) Atributos nos elementos oleul
    • typee valueatributos no lielemento
    • widthatributo no preelemento
  • Elementos adicionais na especificação de transição
    • menu (Obsoleto. Use CSS em vez disso.) Lista (sem substituto, embora a lista não ordenada seja recomendada)
    • dir (Obsoleto. Use CSS em vez disso.) Lista (sem substituto, embora a lista não ordenada seja recomendada)
    • isindex(Obsoleto.) (O elemento requer suporte do lado do servidor e normalmente é adicionado aos documentos do lado do servidor, forme os inputelementos podem ser usados ​​como um substituto)
    • applet(Obsoleto. Use o objectelemento em vez disso.)
  • O languageatributo (obsoleto) no elemento de script (redundante com o typeatributo).
  • Entidades relacionadas a quadros
    • iframe
    • noframes
    • target(Obsoleto nos elementos map, linke form.) Atributo em a, mapa de imagem do lado do cliente ( map) link, forme baseelementos

A versão Frameset inclui tudo na versão Transitional, bem como o framesetelemento (usado em vez de body) e o frameelemento.

Conjunto de quadros versus transição

Além das diferenças de transição acima, as especificações do conjunto de quadros (seja XHTML 1.0 ou HTML 4.01) especificam um modelo de conteúdo diferente, com framesetsubstituição body, que contém qualquer um dos frameelementos ou, opcionalmente, noframescom um body.

Resumo das versões de especificação

Como esta lista demonstra, as versões soltas da especificação são mantidas para suporte de legado. No entanto, ao contrário dos equívocos populares, a mudança para o XHTML não implica na remoção desse suporte legado. Em vez disso, o X em XML significa extensível e o W3C está modularizando toda a especificação e abrindo-a para extensões independentes. A principal conquista na mudança de XHTML 1.0 para XHTML 1.1 é a modularização de toda a especificação. A versão estrita do HTML é implementada em XHTML 1.1 por meio de um conjunto de extensões modulares para a especificação base do XHTML 1.1. Da mesma forma, alguém procurando especificações soltas (transicionais) ou de frameset encontrará suporte estendido para XHTML 1.1 semelhante (grande parte dele está contido nos módulos legados ou de frame). A modularização também permite que recursos separados sejam desenvolvidos em seus próprios horários. Assim, por exemplo, o XHTML 1.1 permitirá uma migração mais rápida para padrões XML emergentes, como MathML (uma linguagem matemática de apresentação e semântica baseada em XML) e XForms - uma nova tecnologia de formulário da web altamente avançada para substituir os formulários HTML existentes.

Em resumo, a especificação HTML 4 restringiu principalmente todas as várias implementações HTML em uma única especificação claramente escrita com base em SGML. XHTML 1.0, portou esta especificação, como está, para a nova especificação definida por XML. Em seguida, o XHTML 1.1 tira proveito da natureza extensível do XML e modulariza toda a especificação. O XHTML 2.0 foi planejado para ser o primeiro passo na adição de novos recursos às especificações em uma abordagem baseada em padrões.

WHATWG HTML versus HTML5

O HTML Living Standard, que é desenvolvido pela WHATWG, é a versão oficial, enquanto o W3C HTML5 não é mais separado do WHATWG.

Editores WYSIWYG

Existem alguns editores WYSIWYG (o que você vê é o que você obtém), nos quais o usuário organiza tudo como deve aparecer no documento HTML usando uma interface gráfica do usuário (GUI), geralmente semelhante aos processadores de texto . O editor renderiza o documento em vez de mostrar o código, portanto, os autores não requerem um conhecimento extenso de HTML.

O modelo de edição WYSIWYG tem sido criticado, principalmente por causa da baixa qualidade do código gerado; há vozes defendendo uma mudança no modelo WYSIWYM (o que você vê é o que você quer dizer).

Os editores WYSIWYG continuam sendo um tópico controverso por causa de suas falhas percebidas, como:

  • Baseando-se principalmente no layout em oposição ao significado, geralmente usando marcações que não transmitem o significado pretendido, mas simplesmente copiam o layout.
  • Geralmente produzindo código extremamente detalhado e redundante que falha em fazer uso da natureza em cascata de HTML e CSS .
  • Freqüentemente produzindo marcação não gramatical, chamada sopa de tag ou marcação semanticamente incorreta (como para itálico).<em>
  • Como muitas das informações em documentos HTML não estão no layout, o modelo foi criticado por sua natureza "o que você vê é tudo o que você obtém".

Veja também

Referências

links externos