Home » Design

Inserir vídeos com o HTML5

22 julho 2012 4.331 Leitores 0 Comentários

Recentemente fiz um artigo com algumas dicas de HTML5. Quem tem um site, ou pretende criar um site, só ganha em começar a familiarizar-se com o HTML5.

Uma das novas funcionalidades do HTML5 é a tag para inserir vídeos. A tag <video>:

<video width="320" height="200" controls="controls">
<source src="exemplo-filme.mp4" type="video/mp4" />
<source src="exemplo-filme.ogg" type="video/ogg" />
O seu browser não suporta a tag vídeo.
</video>

Experimente copiar e colar o código no editor de HTML em tempo real.

Veja o resultado:


Antes do HTML5 havia basicamente duas opções para inserir, ou incorporar, vídeos no seu site. Instalar uma aplicação no seu servidor para reproduzir os seus vídeos (vídeos estes que ficam alojados também no seu servidor), ou então utilizar serviços externos (como o Youtube ou o Vimeo) para alojar os seus vídeos e reproduzi-los no seu site através de códigos que esses serviços fornecem para a sua incorporação.

A maior parte das pessoas usa actualmente a segunda opção. Por toda a web vemos sites com vídeos do Youtube. Tecnicamente esta opção não é melhor do que a primeira, mas é mais rápida e é grátis, o que justifica porque a maior parte das pessoas a usa para apresentar vídeos nos seus sites ou blogs. Mas quem se decide pela primeira opção, quem decide ter a sua própria aplicação para reproduzir vídeos e ter os seus vídeos instalados no seu servidor, rapidamente descobre que a aplicação pode não ser barata e que a sua instalação pode exigir os conhecimentos de um webmaster mais avançado.

É aí que entra em cena a tag <video>, que torna o processo bem mais simples. O único problema é que os navegadores de internet mais antigos não estão preparados para o HTML5. Os navegadores de internet mais recentes já suportam o HTML5, porém, não suportam todos os formatos de vídeo que é possível incorporar com o HTML5 (na versão mais recente, o Chrome suporta todos os formatos, o Firefox suporta ogg e WebM e o Internet Explorer suporta apenas o mp4). Isto significa que algumas pessoas podem não conseguir visualizar o seu vídeo. Uma forma de garantir que o máximo de pessoas consegue ver o seu vídeo é disponibilizá-lo no formato ogg e mp4, como eu fiz no exemplo acima. Assim qualquer pessoa que tenha a versão mais recente de um navegador de internet irá conseguir ver o seu vídeo.

Portanto o HTML5 permite que já seja possível incorporar vídeos guardados no seu servidor. Embora ainda existam algumas limitações, com a generalização do HTML5, à medida que o HTML5 se vai tornando padrão, e à medida que os navegadores de internet vão passando a reconhecer todos os formatos, usar a tag <video>passa a ser a opção mais tecnicamente correcta e a mais simples.

Uma evidência de que o HTML5 é o futuro, e que por isso devemos ir actualizando os nossos sites com o HTML5, é que importantes empresas de construção de sites já começaram a oferecer serviços em que os sites são totalmente criados em HTML5.

A Wix por exemplo que oferecia um serviço de criação de sites em Flash, agora já está a oferecer uma versão do serviço em que os sites são construídos totalmente em HTML5.

Você já conhecia alguma coisa do HTML5? Já usou a tag <video> do HTM5 em algum dos seus sites?

1 Estrela2 Estrelas3 Estrelas4 Estrelas5 Estrelas (Classifique este post)
Loading ... Loading ...


Deixe um comentário!

Seja cordial. Respeite o assunto do tópico. Não faça spam.