curso Lazy Load: Carregue páginas rapidamente

Neste curso aprenderemos a aplicar a técnica de Lazy Load em páginas web com jQuery e CSS, carregando as imagens apenas quando elas forem necessárias e otimizando assim o tempo de carregamento da página. Uma página web moderna pode conter diversas imagens para enriquecer a experiência do usuário, mas a utilização de imagens requer cuidado, pois isso pode comprometer essa experiência deixando o carregamento da página cada vez mais lento. Durante o processo normal de carregamento, onde todo ... Ver mais conteúdo da página é carregado de forma assíncrona, há um consumo de banda desnecessário, porque nesse primeiro momento nem todo o conteúdo da página está visível para o usuário até que ele comece a interagir com o scroll.

Iniciar Carga Horária No Certificado - 6H

Curso de Lazy Load

Aula 1 - free

Introdução ao Lazy Load

Veremos o que é a técnica de Lazy Load e como ela pode ser aplicada para dar mais velocidade ao carregamento da página, permitindo disparar requisições para os elementos do tipo imagem apenas quando estas estiverem visíveis na página.
free
Aula 2 - free

Entendendo o Evento Scroll

Como um primeiro passo para a criação do comportamento de Lazy Load, veremos como criar um listener para o evento de scroll.
free
Aula 3 - free

Usando data e src para carregar imagens

Veremos como carregar uma imagem quando o evento de scroll for disparado, movendo a sua URL de um atributo data-url para o atributo src do elemento imagem.
free
Aula 4 - free

Determinando se uma imagem está visível

Veremos como determinar se o elemento imagem está visível ou não para o usuário que está navegando pelo documento através do navegador. Uma vez que estiver visível, usaremos a técnica introduzida na aula anterior para carregar a imagem.
free
Aula 5 - free

Adicionando Lazy Load a uma página

Aplicaremos o efeito de Lazy Load em uma página com conteúdo textual e diversos elementos imagem em posições diferentes do documento.
free
Aula 6 - free

Suavizando a transição com CSS3

Criaremos um efeito de transição mais suave para o carregamento das imagens utilizando CSS3.
free
Código Fonte - free

Código fonte

Nesse post você encontrará o código fonte completo da roda de código Lazy Load: Carregue páginas rapidamente
free

Autor do curso

Certificado Devmedia

Todos os nossos cursos oferecem certificado com carga horária. Eles são aceitos em todas as faculdades e orgãos públicos do Brasil. Assim que finalizar um curso já emita o seu.

Suporte ao aluno em tempo real

Todos os cursos possuem professores online para ajudar em qualquer dúvida que for necessária para o completo entendimento do curso.

Avaliação do curso

Como adquirir esse curso?

Acesse esse e todos os demais cursos devmedia sendo um assinante mvp

Benefícios MVP
  • Guias de referência
  • Suporte em tempo real
  • Assista o conteúdo offline
  • Emissão de certificado
  • #JOBS - Diversas vagas de emprego
  • Web-currículo
SEJA MVP
R$ 69,90 /mês
Assine agora e tenha acesso ao curso
15 anos de treinamento online
700 mil cadastros
170 mil fãs no facebook
100 mil certificados emitidos