Quais são as principais diferenças entre o rascunho HTML4 e HTML5 ?

Mantenha as respostas relacionadas à sintaxe alterada e aos elementos html adicionados / removidos.

O HTML5 tem vários objetivos que o diferenciam do HTML4.

Consistência no tratamento de documentos malformados

O principal é o tratamento de erros consistente e definido . Como você sabe, o HTML oferece suporte propositalmente à "sopa de tags" ou à capacidade de escrever código malformado e corrigi-lo em um documento válido. O problema é que as regras para fazer isso não são escritas em nenhum lugar. Quando um novo fornecedor de navegador deseja entrar no mercado, ele apenas precisa testar documentos malformados em vários navegadores (especialmente o IE) e fazer engenharia reversa no tratamento de erros. Caso contrário, muitas páginas não serão exibidas corretamente (as estimativas colocam cerca de 90% das páginas na rede como sendo pelo menos um pouco malformadas).

Portanto, o HTML5 está tentando descobrir e codificar esse tratamento de erros, para que os desenvolvedores de navegadores possam padronizar e reduzir bastante o tempo e o dinheiro necessários para exibir as coisas de maneira consistente. Além disso, muito tempo depois do HTML ter morrido como um formato de documento, os historiadores ainda podem querer ler nossos documentos, e ter um algoritmo de análise completamente definido ajudará bastante isso.

Melhores recursos de aplicativos da Web

O objetivo secundário do HTML5 é desenvolver a capacidade do navegador de ser uma plataforma de aplicativos, via HTML, CSS e Javascript. Muitos elementos foram adicionados diretamente para o idioma que estão atualmente (em HTML4) Flash ou hacks baseados em JS, como <canvas>, <video>, e <audio>. Coisas úteis, como armazenamento local (um banco de dados de valores-chave embutido no navegador acessível por js, para armazenar informações além do que os cookies podem conter), novos tipos de entrada, como a data em que o navegador pode expor a interface fácil do usuário (para que possamos não é necessário usar nossos seletores de datas do calendário js), e a validação de formulário suportada pelo navegador tornará o desenvolvimento de aplicativos da Web muito mais simples para os desenvolvedores e muito mais rápidos para os usuários (já que muitas coisas serão suportadas nativamente, em vez de invadir via javascript).

Semântica de elementos aprimorada

Há muitos outros esforços menores que ocorrem em HTML5, como papéis semânticos mais bem definidos para elementos existentes ( <strong>e <em>agora realmente significam algo diferente, e até mesmo <b>e <i>têm uma semântica vagas que devem funcionar bem durante a análise de documentos legados) e adicionando novos elementos com útil semântica - <article>, <section>, <header>, <aside>, e <nav>deve substituir a maioria dos <div>s usados em uma página web, tornando suas páginas um pouco mais semânticas, mas mais importante, mais fácil de ler . Chega de digitalização dolorosa para ver exatamente o que esse aleatório </div>está fechando - em vez disso, você terá um óbvio </header>ou tornará </article>a estrutura do documento muito mais intuitiva.

Da Wikipedia :

• Novas regras de análise orientadas para análise e compatibilidade flexíveis
• Novos elementos - seção, vídeo, progresso, navegação, medidor, tempo, aparte, tela
• Novos atributos de entrada - datas e horas, email, URL
• Novos atributos - ping, charset, assíncrono
• Atributos globais (que podem ser aplicados a cada elemento) - id, tabindex, repeat
• Elementos obsoletos descartados - centro, fonte, greve

Você deve verificar as diferenças completas em HTML5 do HTML4: W3C Working Group Note 9 de dezembro de 2014 . Existem muitos novos elementos e atributos de elemento. Alguns elementos foram removidos e outros têm um valor semântico diferente do que antes.

Também existem APIs definidas, como o uso de canvas, para ajudar a criar a próxima geração de aplicativos da web e garantir que as implementações sejam padronizadas.

O HTML5 apresenta várias APIs que ajudam na criação de aplicativos da Web. Eles podem ser usados ​​junto com os novos elementos introduzidos para aplicativos:

• Uma API para reprodução de vídeo e áudio que pode ser usada com os novos elementos de vídeo e áudio.
• Uma API que permite aplicativos da Web offline.
• Uma API que permite que um aplicativo da Web se registre para determinados protocolos ou tipos de mídia.
• Uma API de edição em combinação com um novo contenteditableatributo global .
• Uma API de arrastar e soltar em combinação com um draggableatributo.
• Uma API que expõe o histórico e permite que as páginas sejam adicionadas a ele para evitar a quebra do botão Voltar.

Você pode estar interessado nesta lista de elementos e atributos HTML5 .

Além disso, observe que é "HTML 4", não "HTML4". De fato, para o HTML 5, as duas variantes são usadas, mas há uma diferença importante no significado. HTML 5 refere-se ao nome da especificação W3C, enquanto "HTML5" é o tipo de documento desses arquivos HTML com um text/htmltipo MIME que segue essa especificação. O mesmo vale para XHTML 5 vs. XHTML5.

Agora o W3c fornece uma diferença oficial em seu site:

http://www.w3.org/TR/html5-diff/

O HTML 5 convida você a adicionar muito valor semântico ao seu código. Além disso, existem soluções nativas para incorporar conteúdo multimídia.

O resto é importante, mas é um açúcar mais técnico que o evitará de fazer o mesmo com uma linguagem de programação do cliente.

Em resumo, é muito simples comparado ao html, o doctype longo é removido e também a tag central e de fonte é removida. Também respondi a essa diferença no meu blog: http://ravisinghblog.in/key-difference-between-html-and-html-5/