Imagens responsivas

[felipefialho]

Trazendo uma discussão que vi no Facebook e acho interessante colocar em debate.

O que estão utilizando para fornecer imagens responsivas para cada resolução específica?

Acredito que o picturefill continua sendo o mais confiável desses plugins, as novas versões corrigiram vários problemas.

Se usar junto com alguma solução de lazyload como o lazysizes, fica perfeito.

Deem uma olhada em um dos últimos projetos que desenvolvi. Forneço uma imagem 'lazy' de 50x50, que carrega instantemente e só forneço a imagem principal após estar carregada.

http://www.filtro.is/

[vitor-mendrone-deel]

Picturefill que foi você mesmo quem indicou tem sido a solução pra mim.

Deve continuar assim até essa iniciativa sair do mundo dos testes e se tornar realidade.

Ela parece ser o caminho viável pra imagens responsivas sem depender da verbosidade do elemento picture

[abnersajr]

Utilizei no projeto da minha agência ( http://beagleship.com.br/ ) um pluginzinho desse site: http://jquerypicture.com/.
Acredito que não seja TOP, tão completo talvez quanto o picturefill, mas com certeza da para aplicar em alguns projetos onde seja algo mais simples. Aqui testamos em todos navegadores mais atuais. IE 9 e Mobile, funcionou de boas.

[ghost]

http://www.responsivebreakpoints.com/

[raphaelfabeni]

Legal isso hein @lfvirtuoso 💀

[felipefialho]

Eu vi essa ferramenta @lfvirtuoso, bem legal né?

Já tínhamos criado uma solução parecida com essa aqui na Filtro (que faz o corte automático das imagens), mas é bom saber que foi desenvolvida uma ferramenta para isso. Vou dar uma testada depois.

[andersoonweb]

Não conhecia essa abordagem @lfeh . Essa combinação é muito linda!!! Sempre tive essa dúvida, mais nunca precisei usar, logo nunca pesquisei.
Bom, só uma dúvida... Você passa todos os valores na mão ou usa algo pra automatizar?!

Vi a ferramenta que o @lfvirtuoso publicou mais bem bacana, só que ficar subindo a imagem toda hora pra obter seus breakpoint é muito chato...