Logo DrCode Logo DrCode

Blog

Blog / HTML 5 / HTML5

HTML5

html5intro1

HTML5

Você já conhece o HTML não é? Mas e o HTML5? Você o Conhece? Bom se não conhece já passou da hora de conhece-lo, pois isso irá ajudar muito a você programador web.

O html5 nada mais é que uma atualização do html normal, e como toda a atualização traz novidades e melhorias, vamos ver em o que isso melhorou. Atualmente quando você esta contruindo um documento html você enche ele de divs, div id=menu, div id=conteudo div id=post entre outros monte de div, com o html5 isso mudou, pois com ele temos novas tags, mais semanticas, e mais organizadas que é o que o google mais gosta, semantica e organização, vamos ver algumas melhorias que temos.

Primeiro, o Doctype, antes tinhamos que colocar aquele monte de coisa no inicio do documento, agora com o html5 colocamos apenas isso

<!DOCTYPE html>

Ele se encarrega por todo o resto!

Temos tambem a tag header, que como seu nome indica o topo, então assim temos a substituição da div id=topo

<header>
    ...
</header>

Em seguida temos a tag nav, que indica o menu, assim temos

<nav>
    <ul>
        <li>...</li>
        <li>...</li>
        <li>...</li>
    </ul>
</nav>

Temos em seguencia a section, que indica que ali temos uma seção, por exemplo, seção esportes em um jornal, e dentro desta seção teremos as materias sobre o esporte entre outras matérias deste genero. As matérias são separadas por articles, que seram os artigos que servem para aquela seção, desta forma:

<section>
    <article>
        <strong>Titulo</strong>
        <span>Conteúdo</span>
    </article>
    <article>
        <strong>Titulo</strong>
        <span>Conteúdo</span>
    </article>
</section>

Temos então as asides, que são as tags de laterais, que indicam que ali é uma lateral, desse jeito:

<aside>
    <span>Lateral</span>
    <ul>
        <li>...</li>
        <li>...</li>
        <li>...</li>
    </ul>
</aside>

E por fim temos a tag footer, que indica que ali temos um rodapé, assim ficando:

<footer>
    ...
</footer>

Alem disso temos as tags video, que serve para rodar videos direto na página, canvas para animações, audio para execução de audio ná página entre outras, você pode conferir todas as outras funcionalidades do HTML5 Clicando Aqui.

Bom, vou deixar abaixo uma imagem para quem quiser salvar, ou para que entendam melhor como funciona o html5 e o que é cada elemento dele.

structure-html5

Bom pessoal, por em quanto é só isso, deixe um comentário dizendo o que achou da nova versão do HTML5 ou qualquer dúvida deixe um comentário que eu lhe responderei.

Tags: html 5 html tags html5 novo html o que é html5 tags html5
Felipe Mello
Comentários