Desenvolvimento HTML5

Desenvolvimento HTML5 – Olá pessoal, não sei o quanto vocês estão acompanhando a evolução do HTML, mais o HTML5 já chegou e será o novo padrão para substituir o HTML e XHTML. Atualmente o HTML5 está em fase de esboço, porém diversos navegadores já implementaram algumas de suas funcionalidades, o Chrome sem duvida é o mais compatível e o que recomendo a todos.

HTml5 - VidaNerdEm 2008 o W3C (empresa que coordena os padrões Web) anunciou a primeira especificação do HTML5 e após cinco longos anos de trabalho estamos quase chegando à versão final que está prevista para 2014.

Um dos principais objetivos do HTML5 é facilitar a manipulação do elemento, possibilitando o desenvolvedor a alterar as características dos objetos de forma completa de maneira que seja transparente para o usuário e claro dar suporte a outras plataformas que estão chegando ao mercado.

Principais características

O HTML5 possui características que facilitam o trabalho com arquivos multimídia e gráfico, sem recorrer a plugins e APIs de terceiros. Além disso, a semântica do conteúdo poderá ser trabalhada com novas definições sintáticas. É um grande candidato para aplicações em multiplataformas móveis como smarphone e TVs.

Um exemplo pagina em HTML5:

Script-VidaNerd

Características:

  • Mais semântica e menos código
  • Interatividade sem plugins
  • Novos elementos para os cabeçalhos, rodapés, menus, seções e artigos.
  • Novos elementos de formulários, novos atributos, tipos de entradas e validação automática.
  • Suporte completo ao CSS3.
  • Uso de princípios de acessibilidade

O que vai mudar para o usuário Final?

Se você não desenvolve e esta em um perfil um pouco mais usuário, o novo HTML5 apresentará boas diferenças ao navegar pela Internet. Isso porque ele irá facilitar muito a vida quer sejamos desenvolvedores ou apenas usuários.

Para a galera que desenvolve, fica mais rápido produzir sites cada vez mais fáceis e limpos para que os usuários possam aproveitar ao máximo cada uma dessas melhorias. Será notável a facilidade de adicionar uma midia do YouTube em seu site ou até mesmo blog, assim como os conteúdos específicos direcionados para pessoas que estão procurando por um supermercado ou shopping pelo navegador do seu smartphone. Os conteúdos possuem a tendência de serem convergentes, assim como a linguagem de programação. O HTML5 vem exatamente para facilitar esse processo!

Aqui eu coloquei as principais TAGS do HTML5. ( Irei fazer uma lista mais atualizada e completa, mais isto pode demorar um pouco).

Tag Descrição
<!–…–> Especifica um comentário
<!DOCTYPE> Especifica o tipo do documento html.
<a> Especifica um hyperlink
<abbr> Especifica uma abreviação
<address> Especifica um endereço relacionado com o autor do documento atual, ou seção do documento
<area> Especifica uma área no interior de um mapa de imagem
<article> Especifica um artigo
<aside> Especifica o conteúdo relacionado com o artigo dentro de um artigo ou página web
<audio> Especifica um streaming de áudio em um documento HTML
<b> Especifica que o texto deve ser em negrito
<base> Especifica uma URL base para todos os links da página
<bdo> Especifica a direção em que o texto deve ser mostrado
<blockquote> Especifica uma citação longa
<body> Especifica o elemento body da página
<br> Especifica uma quebra de linha
<button> Especifica um botão em uma página
<canvas> Especifica a criação de gráficos em uma página web
<caption> Especifica a criação de legendas em tabelas
<cite> Especifica uma citação curta
<code> Especifica um pedaço de código
<col> Especifica atributos para colunas em tabelas
<colgroup> Especifica grupo de colunas em tabelas
<command> Especifica um comando que o usuário pode invocar
<datalist> Especifica um “autocomplete” em formulários
<datatemplate> Especifica um template de dados
<dd> Especifica uma descrição em uma lista de definição
<del> Especifica texto deletado
<details> Especifica informações adicionais que o usuário pode visualizar ou esconder sob demanda
<device> Representa um dispositivo seletor, que permite ao usuário dar o acesso à página para um dispositivo.
<dfn> Especifica uma definição
<div> Especifica uma seção no documento, utilizado para agrupar vários elementos HTML
<dl> Especifica uma lista de definição
<dt> Especifica a definição de um termo em uma lista de definição
<em> Especifica um texto com emfase
<embed> Especifica uma aplicação externa com conteúdo interativo
<eventsource> Especifica um destino para eventos enviados por um servidor
<fieldset> Especifica um grupo de elementos relacionados com o formulário
<figure> Especifica ilustrações, imagens, fotos, associado juntamente com alguma legenda
<footer> Especifica um rodapé para a seção de uma página
<form> Especifica um formulário
<h1> Especifica um cabeçalho de nível 1
<h2> Especifica um cabeçalho de nível 2
<h3> Especifica um cabeçalho de nível 3
<h4> Especifica um cabeçalho de nível 4
<h5> Especifica um cabeçalho de nível 5
<h6> Especifica um cabeçalho de nível 6
<head> Especifica informações sobre o documento
<header> Especifica um cabeçalho para uma seção de uma página
<hgroup> Especifica um container para elementos de título do nível h1 ao h6
<hr> Especifica uma linha horizontal
<html> Especifica um documento html
<i> Especifica um texto em itálico
<iframe> Especifica uma sub janela no documento
<img> Especifica uma imagem
<input> Especifica um campo de entrada de texto
<ins> Especifica que um novo texto foi inserido no lugar de um que foi removido
<kbd> Especifica um texto que foi digitado pelo usuário
<keygen> Especifica um par de chaves público-privadas
<label> Especifica um rótulo para controle dos elementos em um formulário
<legend> Especifica um título para um fieldset
<li> Especifica um item de uma lista
<link> Especifica uma referência a um documento externo
<mark> Especifica um texto destacado para fins de referência
<map> Especifica um mapa de imagem
<menu> Especifica uma lista de comandos
<meta> Especifica meta informação
<meter> Especifica medição dentro de um intervalo predefinido
<nav> Especifica uma lista de links para navegação
<noscript> Especifica conteúdo alternativo para browsers que não suportam JavaScript ou outras linguagens de script
<object> SpEspecifica um objeto dentro de um documento HTML
<ol> Especifica uma lista ordenada
<optgroup> Especifica um grupo de itens relacionados dentro de uma lista
<option> Especifica as opções de uma lista, utilizado em conjunto com as tags <select> e <datalist>
<output> Especifica o resultado de um cálculo, por exemplo, o efetuado por algum script
<p> Especifica um parágrafo
<param> Especifica um parâmetro para um objeto incorporado no documento HTML
<pre> Especifica um texto pré-formatado
<progress> Especifica o progresso de uma tarefa de qualquer tipo
<q> Especifica uma breve citação
<ruby> Especifica texto Ruby (tipografia utilizada no Sudeste Asiático)
<rule> Especifica as regras para a atualização de um <datatemplate>
<rp> Especifica anotações ruby em benefício dos browsers que não suportam ruby
<rt> Especifica um componente do texto ruby em uma anotação ruby
<samp> Especifica a saída de um programa de computador, script, etc.
<script> Especifica scripts em um documento html
<section> Especifica uma seção dentro de um artigo
<select> Especifica uma lista de itens selecionáveis
<small> Especifica um texto em tamanho pequeno para impressão
<source> Especifica múltiplos recursos multimídia em uma página
<span> Especifica elementos inline em um documento HTML
<strong> Especifica uma importância maior ao texto onde ele é utilizado
<style> Especifica a declaração de folhas de estilo em documentos HTML
<sub> Especifica texto subscrito
<sup> Especifica texto sobrescrito
<table> Especifica uma tabela
<tbody> Especifica um corpo para a tabela
<td> Especifica uma célula para a tabela
<textarea> Especifica um textarea onde o usuário pode introduzir várias linhas de texto
<tfoot> Especifica um rodapé para a tabela
<th> Especifica uma célula de cabeçalho em uma tabela
<thead> Especifica o cabeçalho de uma tabela
<time> Especifica data e hora
<title> Especifica o título do documento HTML
<tr> Especifica uma linha em uma tabela que pode conter colunas ou células individuais
<ul> Especifica uma lista não ordenada
<var> Especifica uma variável
<video> Especifica um streaming de vídeo em um documento html

Em breve irei fazer um artigo sobre html5 css3, aguardem.

html5_css3

Espero que tenham gostado.

 

 

 

 

 

Post Relacionado

Leave a Reply

Your email address will not be published.