O que há de novo no HTML5 / CSS3?

O que há de novo no HTML5 / CSS3?
Design

29/11/2021

Como toda atualização de software que possui novas funcionalidades o mesmo se aplica ao HTML5.

No HTML5 novas tags foram incluídas trazendo uma maior interoperabilidade, mais transparente na comunicação com outros sistemas, e reduz os custos de desenvolvimento com regras precisas de como manusear os diferentes tipos de elementos HTML.

Existem novas funcionalidades para os diferentes tipos de elementos da Web. Algumas dessas novas funcionalidades são usadas para incorporação de vídeo, áudio, gráfico, armazenamento de dados do lado do cliente  e documentos interativos.

As novas características do HTML5

As novas características da versão 5 estão ligadas diretamente às necessidades de suporte independente aos novos formatos de conteúdo multimídia, as novas funcionalidades de semânticas e a acessibilidade. Apresentaremos elas a seguir.

a) Inclusão do elemento canvas para desenho.

O elemento canvas foi incluído para permitir desenhar gráficos em uma página web, tarefa essa que atualmente só é possível com a utilização de plugins externos.

O canvas é uma área retangular onde o usuário, via JavaScript, vai poder controlar todos os pixels, além de desenhar vários elementos gráficos como círculo, retângulo, elipse, linha, texto, imagens, etc. Para usar um elemento canvas no documento, além da inclusão da tag, temos que manipular o elemento via JavaScript:

b) Inclusão dos elementos vídeo e áudio para reprodução multimídia

Outro motivo para integrar plugins externos é o uso de áudio e vídeo nas páginas web. Com a inclusão de tags específicas para este fim, a HTML5 dá suporte nativo para a reprodução de áudio e vídeo sem a necessidade de utilizar mecanismos externos. Para usar o elemento áudio ou vídeo, basta incluir a tag específica no documento.

c) Total suporte ao CSS3

Para dar ainda mais liberdade à criatividade dos usuários, o HTML5 dá total suporte a mais nova versão das famosas Cascading Style Sheets, ou simplesmente CSS. Com essa integração as páginas webs podem receber os mais variados tipos de estilos como sombra nos textos e quadros, efeitos de transição, quadro com cantos arredondados e vários recursos novos que o CSS3 oferece.

Suporte

Apesar da versão 5 não ter sido oficializada, vários navegadores continuam adicionando os novos recursos do HTML5 nas suas recentes versões. Dentre os navegadores podemos citar: Safari, Chrome, Firefox, Opera e Internet Explorer.

Entrando um pouco em CSS3,eu trouxe principais novidades 


As principais novidades são:

Bordas

  • border-color
  • border-image
  • border-radius
  • box-shadow

Fundos

  • background-origin
  • background-clip
  • background-size
  • fazer camadas com múltiplas imagens de fundo

Cor

  • cores HSL
  • cores HSLA
  • cores RGBA
  • Opacidade

Texto

  • text-shadow
  • text-overflow
  • Ruptura de palavras longas

Interface

  • box-sizing
  • resize
  • outline
  • nav-top, nav-right, nav-bottom, nav-left

Seletores

  • Seletores por atributos
  • Modelo de caixa básico
  • overflow-x, overflow-y

Outros

  • media queries
  • criação de múltiplas colunas de texto
  • propriedades orientadas a discurso ou leitura automática de páginas web
  • Web Fonts

Chega de sofrer no photoshop para fazer coisas simples como rotacionar uma foto, o agora já CSS faz sozinho.

Conclusão

Com a chegada da nova versão da linguagem de marcação HTML só temos a ganhar, pois além de contarmos com novos recursos que permitem uma maior estruturação dos documentos, mais funcionalidades, independência de plataforma, tratamento de exceção e suporte nativo aos recentes conteúdos multimídias, ainda podemos ficar livres dos incômodos estresses que temos ao utilizar bibliotecas e plugins externos que nem sempre funcionam como deveriam nos navegadores distintos.


Posts Relacionados

Gestor de tráfego: o que é como se tornar um?

Gestor de tráfego: o que é como se tornar um?

Você possui um e-commerce, site ou vende seus produtos ou serviços pelas redes s...

→ Leia mais...
O que está em alta no mercado para vender?

O que está em alta no mercado para vender?

Não poder sair para a rua fez com que a sociedade olhasse mais para si, prioriza...

→ Leia mais...
Dicas de gerenciamento de tempo para manter o foco e a produtividade

Dicas de gerenciamento de tempo para manter o foco e a produtividade

É cada vez maior o número de pessoas que deixam cargos em grandes empresas para...

→ Leia mais...
André Andrade

André Andrade


André Andrade e gerente de produtos desde 2005 e sócio diretor da Estúdio Site Ltda. Formado em Análise de Sistema, atuou no desenvolvimento de mais de 200 projetos, onde trabalhou no levantamento de requisitos, arquitetura da informação, design das telas, desenvolvimento e etc. Hoje possui grandes cases principalmente utilizando o Moodle, CMS Joomla e com o framework Bootstrap Twitter.

→ Veja o Perfil Completo