Slice 1 - Image 1 Slice 1 - Image 2 Slice 1 - Image 3 Slice 1 - Image 4
Slice 2 - Image 1 Slice 2 - Image 2 Slice 2 - Image 3 Slice 2 - Image 4
Slice 3 - Image 1 Slice 3 - Image 2 Slice 3 - Image 3 Slice 3 - Image 4
Slice 4 - Image 1 Slice 4 - Image 2 Slice 4 - Image 3 Slice 4 - Image 4

html5 - o que ele traz de novo?

 HTML5 - Uma visão geral
O nosso bom e velho Hypertext Markup Language chega a sua versão 5 e um dos seus principais objetivos é o de facilitar a manipulação de elementos. Ao contrário da versão anterior o HMTL5 já fornece ferramentas nativas para que o CSS e o Javascript possam fazer o seu trabalho de maneira mais eficiente.
[Leia Mais]





Antigamente não tínhamos padrões universais para o desenvolvimento de áreas comuns como o cabeçalho, menus, rodapés, etc. Não possuíamos padrão para nomes de ID’s ou classes.
Por isso a ideia agora é a construção de uma padronização universal, tornando nossos códigos mais organizados, semânticos e limpos. Sem a necessidade da instalação de vários plug-ins que muitas vezes acabam prejudicando e muito na performance de nossos sites.

O HMTL5 vem sendo desenvolvido de forma a permanecer compatível com os browsers recentes e permitindo que suas novas características sejam adotadas imediatamente.
Para facilitar um pouco a nossa vida aquelas nossas boas e velhas funções Javascript para mascaras de campos e validação de formulários poderão ser jogadas fora dentre em breve.

Veja só o que será possível fazer em formulários.

Autofocus
<input name="login" autofocos / >
O foco será colocado automaticamente ao elemento ser criado, diferente das soluções em Javascript que apenas colocariam o foco no elemento no final do carregamento da página.

Placeholder text
<input name="p" value="Search here"  onfocus="if(this.value=='Search here')this.value=''" />
Antigamente era necessário a execução de um código Javascript para termos o placeholder que a partir do HTML5 seria escrito da seguinte maneira.
<input name="p" placeholder="Search here" />

Required
Para tornar um campo do nosso formulário obrigatório é uma barbada, basta acrescentarmos o atributo “required”
<input name="login" required />

Maxlength
Esse já é nosso velho conhecido, ele limita o número de caracteres de um campo. Entretanto ele não se aplicava ao textarea, o que era uma grande dor de cabeça pois era muitas vezes necessário a instalação de plug-ins em Javascript para controle desse elemento. Com o HTML5 esse problema está resolvido pois o maxlength foi estendido para o textarea.
Pattern
Com o elemento pattern agora é possível criar expressões regulares sem a necessidade do uso do Javascript. Dessa forma podemos fazer validações de formulários de maneira muito mais rápidas e automatizadas.
Exemplo:
<input name="CEP" id="CEP" required pattern="\d(5)-?\d(3)" />
substitua os parenteses por chaves

Caso queiram buscar mais informações referentes a esse assunto ou ver outros exemplos de como aplicar na prática essas novidades, aconselho o material postado pela tableless.com.br no link http://tableless.com.br/html5

Nenhum comentário:

Postar um comentário