Como tocar video como background no mobile (smartphones e tablets)

20 mar, 2017 | Como fazer | 0 Comentários

É possível ter vídeo como background (plano de fundo) do seu site e vou te contar como fazer isso aqui neste vídeo. Se você pesquisou no Google (e talvez esteja aqui graças ao querido Google) a resposta comum que você encontra é: “não é possível pois é uma limitação tecnológica dos celulares e tablets”.

Você teria que ter uma imagem ou cor de fundo como fallback. Mas como eu acredito que tudo tem solução e “impossível” é a palavra que mais me desafia a tentar algo novo, eu não aceitei a resposta comum.

Assiste aqui:

Olá! Novo por aqui?

Olá! Novo por aqui?

Eu sou Laís

Você ama o que faz e quer atrair clientes que gostam disso tanto quanto você. Meu trabalho é te ajudar a cativar seus clientes através da sua marca e site para que elas sintam a conexão com você e confiem em você.

Ponto chave para ter um site com vídeo rodando no fundo no celular

  1. Formatos de vídeo como mp4, ogg e webm realmente não rodam.
  2. Gif é um formato de imagem que pode ser animada e roda em tudo. É raro você ver isso, mas ele pode ser usado como background em sites.
  3. Use gif somente na versão do celular e apenas um trecho curto do vídeo. Ele vai pesar no desktop se for grande ou vai ficar pixelado se for pequeno.
  4. Gifs longos e de grande resolução ficam pesados e vão deixar o site lento. É melhor escolher um trecho (poucos segundos) e deixá-lo em no máximo 800px de largura para não pesar.
  5. Se ainda assim o arquivo ficar muito grande, considere encurtar mais ou reduzir a taxa de frames por segundo.

Veja o site da Tatiana Garcia no celular: http://tatianagarcia.com.br

Vídeo background no mobile + ferramentas

Como criar experiências de compra cativantes

A forma mais fácil de criar um gif animado para usar onde quiser sem precisar instalar programas pra isso é usando uma ferramenta online. Eu recomendo e uso o Ezgif (http://ezgif.com). Funciona tanto para converter trechos de vídeo em gif quanto para criar gifs a partir de imagens.

Outra ferramenta online que faz o mesmo é o popular Giphy (http://giphy.com) mas com ele você precisa criar conta para baixar seus gifs e não tem tanto controle sobre o resultado como no Ezgif.

Você pode usar gifs nos emails que você envia, nas redes sociais e em qualquer lugar do seu site, mesmo no background.

Quer mais?

Pegue minhas dicas de ferramentas para criar conteúdo multimídia cativante. Pegue sua chave e baixe a lista de recursos que coloquei no baú.

Pin It on Pinterest

Share This