Home
Button Mobile Webdesign em Foco
Newsletter Webdesign em Foco
Support Webdesign em Foco
Contribuition Webdesign em Foco
Doe para a Webdesign em Foco
Suporte da Webdesign em Foco
Fechar

Colocar vídeo no fundo do site - Parte 01

27/08/2017

O tutorial de hoje é de como colocar um vídeo no background do seu site. Vamos realizar o desenvolvimento desde a edição do vídeo até a inserção do código para seu funcionamento.

Requisitos para colocar um vídeo no fundo do site

Para colocar um vídeo no fundo do site vamos precisar das seguintes ferramentas:

  1. Vídeo (pessoal ou baixado de algum site) - Lembrando sempre dos direitos autorais
  2. Um programa para edição de vídeo
  3. Um editor de códigos
  4. Um editor de imagens

No nosso vídeo tutorial utilizamos um vídeo do youtube. Primeiramente fomos até o site Online Converter e baixamos no formato mp4 o vídeo que desejamos.

Características ideais para um vídeo no site

Após isso, realizamos a edição do vídeo no Camtasia observando as seguintes características:

  1. Retirar o áudio do vídeo
  2. Observar direitos autorais
  3. Cortar o vídeo no máximo 15s (pelo tamanho)
  4. Escurecer o vídeo para que possamos inserir texto sobre ele

Após editar o vídeo, vamos salvá-lo na menor resolução para não pesar muito no carregamento do site. Lembrando que o vídeo ficará no background e não há necessidade de alta resolução.

Na próxima aula inseriremos o código para colocar o vídeo no fundo.


Receba as aulas da Webdesign em Foco em Seu Email
Suporte Webdesign em Foco

Posts Relacionados

Colocar vídeo no fundo do site - Parte 02
Na segunda aula do tutorial de como colocar um vídeo no fundo do website, utilizaremos a tag video no HTML5 para implementarmos o vídeo no site.
Saiba mais!
HTML5
HTML5 é a linguagem de marcação da codificação do website. Em claro português, HTML é a base em que virão todos os outros os códigos que farão a composição do website
Saiba mais!