Incorporação de vídeo em uma página da web HTML5

Nenhum usuário da Internet é um estranho para vídeo incorporado, a partir de anúncios de vídeos YouTube música, vídeo incorporado tornou-se tão parte da maioria das páginas da web como texto ou imagens. Até agora, porém, o padrão HTML não tem qualquer maneira de incluir vídeo nativamente, estes vídeos são incorporados usando outros plugins e não-padronizados maneiras de torná-los perfeitamente mostrar na página.

No padrão HTML5 nova, no entanto, há uma maneira de incorporar vídeo nativamente em uma página web, evitando todas as dores de cabeça de plugins e soluções de terceiros para vídeo incorporado. O problema é resolvido com uma mão (e de senso comum) <video> tag. Como o <img> tag antes dele, ele é usado simplesmente, assim:


< video width = "640" altura = "360" controles>
  < source src = "myvideo.mp4" tipo = "video/mp4" />
  < source src = "myvideo.ogv" tipo = "video / ogg" />
</ video >


Como você pode ver no exemplo acima, o processo de incorporação de vídeo em uma página HTML tornou-se parte integrante do padrão HTML. No tag você pode especificar a largura, altura, controles e do vídeo de origem de forma semelhante e estilo para outras tags de mídia como <img> . É simples, fácil de usar e conveniente.


Há, no entanto, alguns obstáculos para a implementação de tags HTML5 vídeo. Você vai notar no exemplo acima que eu incluí dois vídeos de fonte, um em ogg e um em mp4 . A razão por trás disso é que diferentes navegadores apoio codecs diferentes, alguns browsers, como o Safari, o apoio do codec MPEG-4, enquanto outros, como Firefox e Opera, suporte ogg. Isto significa que você vai ter que manter dois diferentes vídeos codificados em seu site para garantir que o montante máximo de browsers será capaz de usar o vídeo HTML5 incorporado.


Há uma série de razões para isso, a maioria delas devido a licenciamento; a conseqüência para o brotamento HTML5 guru, porém, é que você precisa estar ciente de todos os jogadores diferentes, navegadores e codecs que estão disponíveis no mercado para garantir a máxima compatibilidade. No exemplo acima, a largura ea altura do vídeo estão definidas para 640 x 360, otimizando o vídeo para smartphones menores, como o Android eo IOS-powered dispositivos. Em um cenário da vida real, você teria que ter diferentes controlos e testes para as versões do navegador para assegurar a entrega do seu conteúdo na forma mais suave.


Outro obstáculo do elemento de vídeo no HTML5 é a falta de apoio para ele em navegadores mais antigos. Muitos usuários ainda utilizam navegadores sem suporte a HTML5 nativa, e neste caso você tem que ter um retorno para um player de vídeo do Flash quando o vídeo HTML5 simplesmente não é uma opção. Estas verificações, testes e fallbacks pode aumentar significativamente a complexidade do HTML5 execução; que bloco de código simples acima torna-se um conjunto de condicionais que assegura que cada usuário recebe sua experiência ótima.


Dito isto, no entanto, você deve fugir da implementação de vídeo HTML5 em sua página web, simplesmente porque pode ser um pouco difícil ou complexo. As vantagens do HTML5 em relação a outras soluções integradas como QuickTime e Flash são enormes, o aumento da estabilidade e velocidade sozinho sobre Flash são o suficiente para fazer a mudança para HTML5 um curso muito viável de ação. Além disso, como os navegadores mais e mais começa a seguir os padrões HTML5 e incorporá-las, o processo se tornará mais ágil e menos complexo.


E assim por ventos a nossa breve introdução à incorporação de vídeo em HTML5. O padrão em si é limpa e eficiente, mesmo que as necessidades mais algumas linhas para garantir a compatibilidade através da placa, um desenvolvedor web especializado, no entanto, não deverá ter problemas tomando as especificações novo vídeo e implementá-las em seu site para enormes ganhos em confiabilidade e satisfação do usuário!