Categorias

Newsletter

  • Coding

    HTML5: quando começar?

    Conceitos básicos de HTML O termo HTML significa Hypertext Markup Language, em portugês: Linguagem de Marcação de Hypertexto. Ou seja,é um conjunto de informações […]


    Conceitos básicos de HTML

    O termo HTML significa Hypertext Markup Language, em portugês: Linguagem de Marcação de Hypertexto. Ou seja,é um conjunto de informações que englobam textos, palavras, imagens e sons. Em geral, é uma linguagem utilizada para o desenvolvimento de páginas para a Web. O acesso se dá através de hiperlinks. Atualmente, o HTML 4.01 é a versão mais utilizada.

    Como surgiu o HTML5

    No início de 2008 o W3C (grupo de empresas que coordenam padrões web)anunciou o HTML5, porém, em Abril de 2010, Steve Jobs publicou uma carta aberta, intitulada “Pensamentos em Flash”, no qual explicava os motivos dos produtos Apple não terem o Flash incluído, o que não vem ao caso, agora. Porém, o que chamou mais atenção foi o trecho em que citava sobre o HTML5:

    Em vez de usar Flash, a Apple adotou HTML5, CSS e JavaScript – todos padrões abertos. Dispositivos móveis da Apple, todos os navios com alta performance, implementações de baixa potência destes padrões abertos. HTML5, o padrão novo web que tem sido adotado pela Apple, Google e muitos outros, permite que os desenvolvedores web criem gráficos avançados, tipografia, animações e transições sem depender de browser de terceiros plug-ins (como Flash). HTML5 é completamente aberto e controlado por um comitê de padrões, do qual a Apple é um membro.

    É certo que a carta de Steve Jobs gerou muita polêmica e discussão, porém, temos que considerar muito o novo padrão HTML5 e começar a entendermos como ele trabalhará a nosso favor.

     

    Principais características do HTML5

    O HTML5 possui características que tornam fáceis o trabalho com multimídias e gráfica, 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.

    • 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

    Exemplo prático

    Observe a imagem abaixo:

    Essa imagem foi feita APENAS com códigos HTML5 e CSS3, nada mais! Surpreendente, não?!

    Obstáculos do HTML5

    É necessário ter consciência dos obstáculos que  o HTML5 enfrenta, como navegadores e tecnologias que não possuem suporte à linguagem ou que não a reconhecem, totalmente. Os browsers Chrome, Firefox 3.6, Internet Explorer 9, Safari 4 e Opera já possuem muitas implementações da linguagem. Desde Julho de 2011, o site HTML5Accessibility faz análise dos browsers e atualiza o suportes que os nagevadores vão realizando. Observa-se que o Firefox é o que tem a maior pontuação (325/370).

    Caso o usuário não possua um navegador que dê suporte ao HTML5, uma mensagem é exibida ou pede-se que ele atualize a versão de seu browser.

     

    Considerações finais

    Iniciar os estudos em HTML5 é sim muito importante em momentos que as tecnologias estão cada vez mais avançadas. Mesmo com o suporte ainda não estabelecido, é algo que não levará muito tempo para que a linguagem se estabeleça 100% nos navegadores. Quando algo surge para facilitar o desenvolvimento e melhorar a acessibilidade, é a hora de começarmos a ação. E quem sabe, uma seção de tutoriais aqui no Choco la? E você, está pronto para o HTML5?

     

    Links Interessantes

    html5gallery.com: Galeria com sites desenvolvidos em HTML5.
    html5accessibility.com: Indica a situação de suporte ao HTML5 dos navegadores.
    html5doctor.com: Uma série de informações e artigos sobre o HTML5.
    www.apple.com/html5 : Exemplos de aplicações do HTML5, inclusive o citado neste artigo.

     

    Nota

    Esse foi meu primeiro artigo aqui no Choco la Design. Espero que tenham gostado e se interessado pelo HTML5. É algo novo para todos, inclusive para mim, mas os estudos sobre esta linguagem estão aceleradíssimos. Não esqueça também de enviar sugestões de Web Design!

    E aqui um agradecimento ao Filipe e Willian, pelo apoio e confiança.

    Em caso de dúvidas, deixe seu comentário ou entre em contato thiago@chocoladesign.com. Ótima semana à todos!


    • http://www.gdesignweb.com.br Luis Gustavo

      legal essa introdução ao html 5. Parabéns pelo inicio Thiago.

    • http://graubi.nu/pixel Graubi

      Então, já faz um tempinho que começei a desenvolver com HTML5, e parece que nesse momento o google Chrome é o que melhor renderiza o HTML5 e as CSS3.

    • http://flickr.com/will_barros will barros

      Estou a um tempo enrolando pra começar a estudar HTML 5. Acho que dessa vez vai.

    • Andre

      legal =)
      estou lendo um livro do Maujor sobre HTML 5 e CSS 3

    • Ana

      Muito bom o post! Estava bem curiosa já faz um tempo para saber o que era de fato o HTML5 e pelo visto você soube esclarecer bem =) Bom início!

      • Thiago Almeida

        Olá Ana, que bom que gostou. Foi exatamente essa minha proposta, abordar de uma forma bem clara o HTML5 e com exemplo na prática. Até mais.

    • Bruno

      Muito bom! Recomendo os livros do Maujor que o Andre citou, são muito bons! Parabéns!

    • http://ecoarte.infohttp://errante.com.br Dido

      Uma sugestão de post seria falar sobre Processing e Processing js, ferramentas poderosas que são softwares livres. Parabéns Thiago, ótimo post!!

      • Thiago Almeida

        Olá Dido! Sugestão anotada, aliás, tratando se software livre, os assuntos podem ser bem discutidos. Até mais!

    • Erika

      Na verdade, a previsão que temos atualmente para que todos os navegadores suportem o html5 100% é de 2023. Vai demorar e muito, mas temos diversas formas de utilizá-lo atualmente (modernizr, por exemplo).

    • Bruna Garcia

      Thiago, muito boa sua explicação sobre o HTML5 e parabéns pelo seu primeiro post aqui. :)
      Estava querendo mesmo entender um pouco mais sobre o assunto e achei interessante o que foi escrito aqui, porque deu para clarear minhas ‘idéias’. rs

      • Thiago Almeida

        Bruna, obrigado! Que bom que gostou. Agora é só ir se aprofundando, cada vez mais, no assunto. Fique ligada que falarei mais sobre HTML5. Até mais!

    • Maria julia

      Parabens pelo artigo, estou comecando a estudar html5 seria otimo ter alguns tutoriais aqui no chocola!
      Espero outros posts!

    • elisa marques

      Parabéns ! Percebi que você escreveu muito bem,que foi muito esclarecedor o seu texto e irá ajudar muitas pessoas.Beijos e muito sucesssssssssssssssssssssssssssssssssssssssssso!!!Estamos muito orgulhosos de você!

    • http://atecnoinfo.blogspot.com Guilherme Vital

      Olá Thiago! Cara gostei do seu post. Realmente o HTML5 é uma linguagem que ainda vai dar muito o que falar. Ela é uma linguagem mais leve e muito pratica. Estou estudando um pouco sobre ela e desenvolvendo um template para Blogger.

      • Thiago Almeida

        Guilherme, valeu! Há muito tempo estava procurando algo que não encontrada de jeito nenhum no blogger, como deixar alguns títulos com fundo dirente. O HTML5 resolveu esse meu problema. Vale a pena estudar! Depois que terminar o template,mostre pra gente! Abraços!

    • http://www.behance.net/brockmarques Brock165

      Olá ficou show esse início ao HTML5, espero ve tutoriais abordando com detalhes a linguagem, abraços! Parabéns!!

    • http://twitter.com/lfiorin SaRNa

      Só pra avisar, os ‘links interessantes’ estão todos ‘relativos’, então no clique cai na pagina de erro 404