Linguagem de marcação de hipertexto

HTML (linguagem de marcação de hipertexto)
Captura de tela
Extensão do arquivo : .html, .htm
Tipo MIME : text / html
Desenvolvido por: World Wide Web Consortium (W3C)
Lançamento inicial: 1992
Versão Atual: 5.2 (em 14 de dezembro de 2017)
Modelo: Linguagem de marcação
Expandido para: XHTML , HTML5
Padrão (s) : ISO / IEC 15445

W3C HTML 5 W3C HTML 4.01 W3C HTML 3.2

Site : www.w3.org/html

A linguagem de marcação de hipertexto ( HTML , inglês para hipertexto -Auszeichnungssprache ) é uma linguagem de marcação baseada em texto para estruturar documentos eletrônicos , como texto com hiperlinks , imagens e outros conteúdos. Os documentos HTML são a base da World Wide Web e são exibidos por navegadores da web . Além do conteúdo exibido pelo navegador, os arquivos HTML podem conter informações adicionais na forma de metainformações , por exemplo, B. sobre aqueles usados ​​no textoLínguas , o autor ou o conteúdo resumido do texto.

O HTML está sendo desenvolvido pelo World Wide Web Consortium (W3C) e pelo Web Hypertext Application Technology Working Group (WHATWG). A versão atual é HTML 5.2 desde 14 de dezembro de 2017 , que já é compatível com muitos navegadores da web atuais e outros mecanismos de layout . A Extensible Hypertext Markup Language (XHTML) também está sendo substituída por HTML5.

HTML é usado como uma linguagem de marcação para estruturar semanticamente um texto , mas não para formatá-lo. A representação visual não faz parte das especificações HTML e é determinada pelo navegador da web e páginas mestras como CSS . As exceções são os elementos relacionados à apresentação marcados como desatualizados ( inglês obsoleto ).

Emergência

Antes do desenvolvimento da World Wide Web e seus componentes, incluindo HTML, não era possível trocar documentos eletronicamente de forma fácil, rápida e estruturada entre várias pessoas e vinculá-los de forma eficiente entre si. Além dos protocolos de transmissão, era necessária uma linguagem de marcação fácil de entender. Este é exatamente o ponto de partida do HTML. Com o objetivo de compartilhar os resultados da pesquisa com outros funcionários da Organização Europeia para a Pesquisa Nuclear (CERN) e torná-los acessíveis a partir das duas localidades na França e na Suíça, um projeto foi criado no CERN em 1989 para encontrar uma solução para este problema. Em 3 de novembro de 1992, a primeira versão da especificação HTML apareceu.

sintaxe

O texto é estruturado por meio de marcação de partes do texto.

A distinção é feita usando elementos padronizados (SGML) . A maioria desses elementos HTML são marcados por um par de tags, ou seja, uma tag de início e uma tag de fim. Um dia de início sempre começa com o sinal <. Isto é seguido pelo nome do elemento (por exemplo, ppara um ponto ou h1por uma de primeira ordem título ) e, opcionalmente, uma lista dos seus atributos (por exemplo, class="warning"ou id="warning"). O >dia de início está encerrado com um . Uma tag final consiste em caracteres </, o nome do elemento e o de terminação >. As tags de início e fim que pertencem juntas, junto com o conteúdo intermediário, formam um elemento da especificação SGML geral . Esses elementos podem ser aninhados de acordo com as regras especificadas em uma definição de tipo de documento (DTD):

<p>Ein Textabsatz, der ein <em>betontes</em> Wort enthält.</p>

Certos elementos não precisam ser anotados explicitamente. De acordo com a regra SGML "OMITTAG", a tag final pode estar faltando para alguns elementos (por exemplo, </p>ou </li>). Além disso, não houve diferença (z. B. dos nomes de elementos e de atributos são maiúsculas e minúsculas <ul>, <UL>, <uL>). Para comparação: em XHTML, essas regras são escritas de forma mais restrita.

Além de elementos com tags de início e fim, também existem elementos vazios em HTML, como quebras de linha ( br) ou imagens ( img).

Eine Textzeile,<br>die hier fortgesetzt wird.
<img src="E-Mail-Button.jpg" alt="E-Mail">

Se trata de HTML descritivo (Inglês descritiva ), e não processual (Inglês processual ) e orientada para a apresentação (Inglês apresentação ) marcação , mesmo que o HTML foi utilizado em versões anteriores do presente. Os elementos HTML não são informações sobre a apresentação que informam ao navegador da Web como formatar visualmente o texto . Em vez disso, os elementos são um rótulo de estruturação que pode ser usado para atribuir um significado a áreas de texto, por exemplo, B. para um título, para um parágrafo de texto e para texto sublinhado. Como esse significado é finalmente transmitido ao usuário (no caso de um título, por exemplo, por fonte ampliada e em negrito ) depende inicialmente do navegador da web e depende do ambiente de saída. Embora os documentos HTML sejam geralmente exibidos em telas de computador , eles também podem ser impressos em outra mídia, por exemplo, em papel ou usando saída de voz . Os modelos de formato CSS são adequados para influenciar a apresentação de um documento HTML em várias mídias. <h1></h1><p></p><em></em>

Portanto, elementos e atributos para apresentação como , e são considerados desatualizados (inglês obsoleto ) e devem ser evitados de acordo com a opinião geral; eles não devem mais ser usados ​​em software recém-desenvolvido e devem ser substituídos quando o software de geração de documentos for revisado. <font></font><u></u>noshade

Ler o texto de origem e processar as informações existentes também é referido como análise na terminologia técnica e a preparação para o meio de saída como renderização . A linguagem HTML descreve como o navegador (ou outro programa, como um editor de texto ) deve "entender" as marcações no texto, não como ele as converte na exibição. Portanto, diz que um título seguido, mas no qual nenhum tamanho ou estilo de fonte , deve ser apresentado - aqui apenas alguns padrões usuais foram naturalizados, mas parte da especificação HTML não. <h1>

Conjunto de caracteres

O conjunto de caracteres padrão, originalmente baseado em ASCII de 7 bits , foi expandido para incluir vários caracteres especiais nos primeiros dias da WWW e codificados como uma entidade HTML. O suporte de conjuntos de caracteres universais para todos os idiomas comuns em todo o mundo exigia o suporte de UTF (Unicode), que agora é implementado em todos os navegadores comuns. HTML é, portanto, projetado para portabilidade independente de plataforma, desde que isso seja suportado pelo renderizador de HTML usado. A escolha do conjunto de caracteres subjacente para um documento da web é feita nos metaelementos no cabeçalho do arquivo, o navegador então se adapta a ele.

Os criadores de sites cujo teclado pode não fornecer todos os caracteres diretamente, como tremas alemães , podem codificar caracteres especiais de várias maneiras ; Um trema A (“ä”) pode ser codificado como uma entidade HTML ( &auml;), como Unicode decimal ( &#228;) ou como Unicode hexadecimal ( &#x00E4;), consulte as especificações de ponto de código Unicode # em documentos . Muitos editores de sites complexos resolvem automaticamente os caracteres especiais quando o texto fonte é codificado.

Na resolução em linhas de endereço ( URLs ) vai virar o contrário, aqui não são diretamente suportados caracteres são posteriores ao método MIME na codificação de caracteres ASCII, tais. B. %20para um espaço se ocorrer, por exemplo, em um nome de arquivo e deve ser diferente do espaço regular no final do link .

Tipo de linguagem

HTML é uma linguagem de marcação e, como tal, normalmente é diferenciada das linguagens de programação (consulte a seção Sistemática externa: Classificação como linguagem de programação ou formato de dados no artigo sobre linguagens de marcação). Uma coisa em comum com a maioria das linguagens de programação é que nenhum software especial (consulte também a lista de editores de HTML ) é necessário para editar os documentos de origem , mas qualquer editor de texto é suficiente.

Um conceito semelhante (descrição lógica) por trás do HTML está por trás do sistema de composição TeX / LaTeX , que, ao contrário do HTML, visa a saída por impressora em papel.

Versões

O HTML foi proposto pela primeira vez em 13 de março de 1989 por Tim Berners-Lee no CERN em Genebra.

  • HTML (sem número da versão, 3 de novembro de 1992): Versão original baseada apenas em texto.
  • HTML (sem número da versão, 30 de abril de 1993): Além do texto, a integração da imagem foi adicionada aos atributos como negrito ou itálico.
  • HTML + (novembro de 1993) Aprimoramentos planejados que foram incorporados às versões posteriores, mas nunca foram adotados como HTML +.
  • HTML 2.0 (novembro de 1995): A versão definida com RFC 1866 led, entre outros. Tecnologia de formulários. O status deste padrão é "HISTÓRICO". Os antecessores também estão desatualizados.
  • HTML 3.0 : Não publicado porque estava desatualizado com a introdução do navegador Netscape na versão 3 antes da publicação planejada.
  • HTML 3.2 (14 de janeiro de 1997): Vários novos recursos, como tabelas, fluxo de texto em imagens, integração de miniaplicativos .
  • HTML 4.0 (18 de dezembro de 1997): Introdução de folhas de estilo , scripts e frames. Houve também uma separação em estrito , conjunto de quadros e transicional . Uma versão ligeiramente corrigida foi publicada em 24 de abril de 1998.
  • HTML 4.01 (24 de dezembro de 1999): Substituiu o HTML 4.0 com muitas pequenas correções. Foi padrão por muito tempo até 2014.
  • XHTML 1.0 (26 de janeiro de 2000): Reformulado HTML 4.01 usando XML . Uma versão revisada foi publicada em 1º de agosto de 2002.
  • XHTML 1.1 (31 de maio de 2001): Depois que o XHTML foi dividido em módulos, uma versão estrita foi definida com o XHTML 1.1, na qual o conjunto de quadros e as variantes de transição introduzidos com o HTML 4 foram omitidos.
  • XHTML 2.0 (fechado, 26 de julho de 2006): Esta versão não deve mais ser baseada no HTML 4.01 e apresentar alguns novos elementos, como: B. <nl>para listas de navegação. A separação de distinção e estilo deve ser concluída nesta versão. - O W3C parou de trabalhar no XHTML 2.0 no verão de 2009 porque o XHTML estava para ser substituído pelo HTML5.
  • HTML5 (Recomendação, 28 de outubro de 2014): Criado um novo vocabulário baseado em HTML 4.01 e XHTML 1.0. A especificação DOM pertencente ao HTML também foi revisada e expandida.
  • HTML 5.1 (recomendação, 1 de novembro de 2016)
  • HTML 5.2 (Recomendação, 14 de dezembro de 2017): Versão atual.

Estrutura HTML

Estrutura geral

Um documento HTML consiste em três áreas:

  1. a declaração de tipo de documento (doctype) no início do arquivo que contém a definição de tipo de documento usado (DTD), por exemplo. B. HTML 5,
  2. o cabeçalho HTML ( HEAD), que contém principalmente informações técnicas ou documentais que geralmente não são exibidas na área de exibição do navegador
  3. o corpo HTML ( BODY), que contém as informações normalmente vistas na área de exibição do navegador.

A estrutura básica de um site é assim:

<!DOCTYPE html>
<html>
  <head>
    <title>Titel der Webseite</title>
    <!-- weitere Kopfinformationen -->
    <!-- Kommentare werden im Browser nicht angezeigt. -->
  </head>
  <body>
    <p>Inhalt der Webseite</p>
  </body>
</html>

HTML head

Na cabeça (Inglês cabeça ) pode ser usado sete elementos diferentes:

title
refere-se ao título da página, que a maioria dos navegadores exibe na barra de título.
meta
pode conter uma variedade de metadados . Veja metaelemento .
base
especifica um URI de base ou um quadro de base .
link
é usado para especificar relacionamentos lógicos com outros recursos. Mais frequentemente usado para incluir folhas de estilo .
script
incorpora código em uma linguagem de script específica , principalmente JavaScript .
style
contém informações de estilo, principalmente declarações CSS .
object
integra um arquivo externo. Os navegadores não têm permissão para exibir esses objetos no cabeçalho do documento. A partir do HTML5, a tag de objeto não é mais permitida no cabeçalho HTML.

Corpo HTML

O corpo HTML contém as informações reais da página. HTML distingue entre elementos de bloco e embutidos. A principal diferença é que os primeiros geram seu próprio bloco na saída, no qual o conteúdo é acomodado, enquanto os elementos inline não interrompem o fluxo do texto. Simplificando, os elementos do bloco sempre têm seu próprio parágrafo. No entanto, com a ajuda do CSS é possível exibir elementos de bloco como um elemento embutido e vice-versa. Além disso, todos os elementos também podem ser marcados como blocos embutidos via CSS , o que faz com que esse elemento tenha as propriedades de um elemento de bloco e de um elemento embutido.

Um título de primeira ordem é marcado da seguinte maneira:

<h1>Überschrift</h1>

h1significa Título 1 , portanto, caracteriza um título do primeiro (e em HTML mais alto) nível de estrutura de tópicos. Também é possível h2usar h6cabeçalhos do segundo ao sexto nível da estrutura.

Um hiperlink :

<a href="http://example.com/">Dies ist ein Verweis auf example.com</a>

Os hiperlinks são referências a outros recursos, principalmente também a documentos HTML, que geralmente podem ser acessados ​​no navegador com um clique. Este link pode ser renderizado assim : Esta é uma referência a example.com. Este exemplo também mostra que o elemento de link é um elemento embutido e não inicia uma nova linha.

O texto normal é especificado com p(para parágrafo ) por padrão , embora um texto sem pisso seria possível sem problemas, mas é altamente recomendado, porque por um lado permite uma separação entre o texto fonte e a saída, e por outro lado o comando é obrigatório para a programação CSS, o mais tardar necessário.

É assim que um texto é gerado em HTML:

<p>Ich bin ein Beispieltext</p>

Para a lógica, por exemplo, os elementos strongou emestão disponíveis com os quais o texto fortemente enfatizado ou enfatizado pode ser distinguido. Por padrão (de acordo com a recomendação W3C) strong- e os emelementos são renderizados em negrito ou itálico .

A descrição estrutural do texto torna mais fácil adaptar a renderização para o observador, por exemplo, para ler o texto para uma pessoa com deficiência visual ou gerá-lo como Braille .

Variantes de HTML

Ao redigir a última versão 4 do HTML, deve-se levar em consideração o fato de que elementos e atributos ainda são usados ​​para apresentação em muitos documentos HTML. O resultado foi basicamente três variantes:

Rigoroso

Esta definição de tipo de documento (DTD) compreende o inventário principal de elementos e atributos. A maioria dos elementos e atributos para influenciar a apresentação estão desaparecidas, incluindo os elementos font, centere ue atributos tais como bgcolor, aligne target. As folhas de estilo devem cumprir sua função em documentos estritos . Texto e elementos não formador de blocos no interior dos elementos body, form, blockquotee noscriptdeve, normalmente, ser localizado dentro de um elemento de recipiente, por exemplo em um pelemento.

Transitório

A variante transicional contém elementos e atributos mais antigos que também permitem a marcação de texto físico . Este DTD tem como objetivo dar aos autores da web que ainda não são capazes de separar a estrutura lógica e a apresentação uma da outra, a oportunidade de escrever HTML compatível com o padrão. Ao mesmo tempo, deve garantir que os sites existentes possam continuar a ser exibidos pelo navegador da web atual.

Frameset

Além de todos os elementos da variante transicional, esta variante também contém os elementos para gerar conjuntos de quadros .

Técnicas adicionais e desenvolvimentos adicionais

Folhas de estilo em cascata

Ao longo dos anos, o HTML foi expandido para incluir elementos que servem ao design visual dos documentos. Isso ia contra a ideia original de independência do sistema. Um retorno à separação entre estrutura e layout (melhor: apresentação) foi feito através da definição de Cascading Style Sheets (CSS). A aparência ou apresentação do documento deve ser especificada em um arquivo separado, a chamada folha de estilo. Isso melhora a adaptabilidade do layout ao respectivo dispositivo de saída e às necessidades especiais do usuário, por exemplo, um display especial para deficientes visuais. Hoje em dia, o suporte CSS do navegador é suficiente para implementar um design sofisticado.

Nos primeiros anos do HTML até a década de 2000, nenhuma distinção estrita era feita entre o layout e a física da página. O design foi implementado com a ajuda de atributos de layout, como color="Farbe"ou tags de layout <font>, ou a aparência das tabelas foi tableaproximadamente especificada diretamente na área. Isso agora é considerado desatualizado e pouco profissional. Além disso, o código CSS também pode ser integrado a uma página sem um arquivo exportado.

Um arquivo CSS pode ser integrado ao cabeçalho HTML usando o elemento de link:

<link rel="stylesheet" type="text/css" href="stylesheet.css">

HTML dinâmico

Muito cedo na história do HTML, foram inventadas tecnologias adicionais que permitem que os documentos HTML sejam alterados dinamicamente enquanto são exibidos no navegador. O mais comum é o JavaScript . Esses documentos interativos são chamados de HTML dinâmico . Essas técnicas foram desenvolvidas de forma independente por vários fabricantes de navegadores, principalmente Microsoft e Netscape . Como resultado, houve problemas significativos na implementação das técnicas entre os vários navegadores. Todos os navegadores habilitados para JavaScript populares agora interpretam o Document Object Model (DOM). Isso torna possível escrever scripts executáveis ​​em todos os navegadores. No entanto, ainda existem diferenças no suporte para o padrão DOM.

XHTML

O XHTML 1.0 foi desenvolvido com base no HTML 4.01 (SGML) . O XHTML atende às regras sintáticas do XML, que são mais rígidas do que o SGML , mas suas três variantes DTD são semanticamente idênticas à variante DTD correspondente do HTML 4.01.

HTML5

As respectivas vantagens de SGML e XML das versões HTML anteriores foram combinadas em HTML5. Em contraste com as versões HTML anteriores, não há mais um DTD no HTML5.

Ajax

Com a tecnologia Ajax , o JavaScript pode ser usado para alterar e recarregar especificamente o conteúdo individual do navegador da web já carregado, sem a necessidade de recarregar completamente o site. Devido ao menor volume de dados, por um lado, uma resposta mais rápida do servidor web é habilitada e, por outro lado, os modos de reação de aplicativos de desktop podem ser simulados.

Veja também

literatura

  • Stefan Münz , Wolfgang Nefzger: manual HTML . Franzis-Verlag, Poing 2005, ISBN 3-7723-6654-6 .
  • Stefan Mintert (Ed.): XHTML, CSS & Co. As especificações W3C para publicação na web. Addison-Wesley, Munich 2003, ISBN 3-8273-1872-6 .
  • Mark Lubkowitz: Programação e design de sites - HTML, CSS, JavaScript, PHP, Perl, MySQL, SVG e newsfeeds, com CD . Galileo Press, Bonn 2004, ISBN 3-89842-557-6 .
  • Elisabeth Robson, Eric Freeman: HTML e CSS da cabeça aos pés . O'Reilly, Cologne 2012, ISBN 978-3-86899-934-1
  • Stephan Heller: Workshop HTML5 e CSS3 . Implementar layouts da web profissionalmente - uma introdução ao desenvolvimento front-end . 1ª edição, 2012; dpunkt.verlag, Heidelberg; ISBN 978-3-89864-807-3 .

Links da web

Commons : HTML  - coleção de imagens, vídeos e arquivos de áudio

Tutoriais

Wikibooks: Desenvolvimento de Sites  - Materiais de Aprendizagem e Ensino
Wikilivros: Manual de Web Design  - Materiais de Aprendizagem e Ensino

Validação

Padrões mais antigos

Evidência individual

  1. W3C HTML 5 w3.org
  2. W3C HTML 4.01 w3.org
  3. W3C HTML 3.2 w3.org
  4. a b HTML 5.2. Recomendação. W3C, 14 de dezembro de 2017, acessado em 1 de janeiro de 2018 .
  5. a b Simon Pieters: diferenças do HTML 5 em relação ao HTML 4. w3.org, 18 de setembro de 2014, acessado em 1 de outubro de 2014 (inglês): “HTML 5 substitui estes documentos. [DOM2HTML] [HTML4] [XHTML1] "
  6. HTML / regras / marcação de texto no wiki SELFHTML
  7. Entidades - tabela para tremas, caracteres especiais e símbolos usados ​​com frequência em e-workers.de; acessado em 11 de novembro de 2018
  8. Tim Berners-Lee : Gestão da informação: uma proposta. Março de 1989, recuperado em 25 de novembro de 2014 .
  9. HTML , versão original
  10. ^ David Raggett: Uma revisão do formato HTML + documento.
  11. ^ XHTML 2.0, W3C Working Draft
  12. XHTML 2 foi descontinuado . Anúncio da Heise, 3 de julho de 2009
  13. sobre a descontinuação do desenvolvimento do XHTML 2, anúncio do W3C
  14. HTML5, um vocabulário e APIs associadas para HTML e XHTML. Recomendação. W3C, 28 de outubro de 2014, acessado em 27 de novembro de 2014 .
  15. Tag de objeto HTML. Retirado em 26 de julho de 2017 (inglês americano).