HTML e HTML 5 conhecendo

Você sabe o que é HTML?

Significa HyperText Markup Language (Linguagem de Marcação de HiperTexto).

É uma das linguagem mais utilizada na construção de páginas, e tornasse comum encontrarmos sites que utilizam somente o HTML.

Sua versão atual é o HTML5,  o HTML organiza as informação e permite a criação de documentos que poderão ser editados em qualquer editor de texto e qualquer alteração poderá ser feita de forma rápida e fácil.

O HTML é composto de tags e atributos que servem para indicar o início e o fim das respectivas funções.

Tags - é um elemento de base, uma especie de marcação, geralmente apresenta duas partes:

Abertura de forma geral: <tag>

Fechamento do tipo: </tag>

Exemplo:

<strong>texto em negrito</strong>

Resultado

 texto em negrito

 Atributos - logo após a tag, seguem os atributos, que são configurações específicas de cada uma das tags, que modificam sua atuação e resultados na página.

Exemplo:

<p style="text-align: center;"> <strong>texto em negrito</strong></p>

Resultado:

 texto em negrito

neste caso o atributo é "text-align: center;" que alinha o texto ao centro do corpo do artigo.

História (resumida) do HTML

O HTML original foi criado por Tim Berners-Lee, utilizando uma estação NextCube com o ambiente de desenvolvimento NeXTSTEP , na época tratava-se de uma coleção de ferramentas, para solucionar a comunicação e aprimoramento das pesquisas entre ele e seu grupo de colegas.

Na década de 1990 foram definidas especificações formais, a primeira publicação foi em 1993, por Berners-Lee e Dan Connolly. Já o HTML 2.0 foi publicado em 1995 e desde 1996 foram mantidas as especificações HTML.

W3C publicou a especificação do HTML5 em janeiro de 2008, que é a mais recente atualização do HTML.

O HTML 5 é a versão mais recente da linguagem de programação conhecida como HTML (Hyper Text Markup Language -  Linguagem de Marcação de Hipertexto). Essa linguagem usa um texto codificado para criar e organizar o conteúdo online.

É a quinta versão da linguagem HTML. Esta nova versão traz importantes mudanças quanto ao papel do HTML no mundo da Web, através de novas funcionalidades como semântica e acessibilidade. Com novos recursos, antes só possíveis por meio de outras tecnologias ou plugins. Com o suporte para as mais recentes multimídias, legível para webmaster e facilmente interpretada por computadores e outros dispositivos.

Certas funcionalidades form introduzidas em 2007, mas apenas em 2010 que esses novos recursos começaram a ser utilizados com mais frequência.

Benefícios do HTML 5

• Talvez o principal recurso do HTML 5 é sua capacidade de gerenciar arquivos de vídeo, essa funcionalidade tornou possível a adição de vídeos, sem a utilização de elementos externos ou adicionais, por exemplo os plugins, influenciando notoriamente na performance  da página, assim também acontece com arquivos de áudio e elementos sonoros;
• Torna a navegação muito mais rápida e simples, melhorando a performance de uma página, o HTML reduz o tamanho dos arquivos, melhorando a experiência do usuário, principalmente os que utilizam conexões de baixa velocidade;

 Canvas, que significa tela em Inglês, é uma ferramenta gráfica que facilita a criação de animações, desenhos, gráficos, utilizando JavaScript;

A função do HTML é indicar que tipo de informação a página está exibindo, os motores de busca baseiam-se nessas marcações para saber diferenciar, por exemplo, um título de um paragrafo.

Em termos de comparativo, na versão anterior, não era possível diferenciar um rodapé do cabeçalho. Essa diferença era percebida somente em termos de layout ou pela posição que os elementos encontravam-se dentro do HTML . Não havia padrão para nomenclatura de IDs e Classes, desta maneira não detectaria-se automaticamente estes elementos, pois as tags utilizadas para ambos poderiam ser iguais.

Com o HTML 5 os  buscadores tem seu trabalho facilitado, eles conseguem interpretar o código de maneira mais eficaz, armazenam informações com maior exatidão e gastam menos tempo para isso.

A internet mudou bastante deste a implementação do HTML 4.01 em 1999. Alguns dos elementos ficaram sem uso ou com pouca utilidade. Estes elementos foram eliminados ou reescritos para estarem em conformidade com as exigências desta nova fase da web. Para isso também foram criados novos elementos para melhorar a estrutura, conteúdos de mídia e formulários.

HTML 5, saiba mais!

 Veja os principais novos atributos:

O atributo autofocus pode ser especificado nos elementos input , textarea, select e button.

A tag a passa a suportar o atributo media como a tag link.
A tag form ganha um atributo chamado novalidate. Quando aplicado o formulário pode ser enviado sem validação de dados.
O elemento ol ganhou um atributo chamado reversed. Quando ele é aplicado os indicadores da lista são colocados na ordem inversa, isto é, da forma descendente.
O novo atributo placeholder pode ser colocado em inputs e textareas.
O elemento area agora suporta os atributos hreflang e rel como os elementos a e link.

O elemento base agora suporta o atributo target assim como o elemento a. O atributo target também não está mais descontinuado nos elementos a e area porque são úteis para aplicações web.

Vejamos abaixo elementos inclusos no HTML 5

Elementos de Marcação

<header> - representa um grupo de introdução ou elementos de navegação. O elementoheader pode ser utilizado para agrupar índices de conteúdos, campos de busca ou até mesmo logos;

<section> - seção do conteúdo, ex: destaques, novidades, artigos recentes...etc;

<article> - apenas um item do conteúdo, como um texto, bloco de cometário, dentro da página ou da seção;

<footer> - o rodapé da página ou de uma seção, último elemento antes de fechar a tag do HTML;

<nav> - o conjunto de links que formam a navegação, seja o menu principal do site ou links relacionados ao conteúdo da página, ligadas dentro do próprio website;

<aside> - conteúdo relacionado ao artigo, separados do conteúdo principal (como arquivos e posts relacionados em um blog, por exemplo);

<time> - define tempo ou data, ou os dois.

Elementos de Mídia

<audio> - conteúdo multimídia, sons, músicas, vinhetas, mp3...etc;

<vídeo> - conteúdo de vídeo, clips, stream de vídeo...etc;

<source> - recursos de mídias, definido dentro dos elementos de áudio e vídeo;1

<embed> - conteúdo embutido, por exemplo os vídeos do YouTube.

Posted in: HTML