SEO para imagens: Aprenda otimizar suas fotos para o Google

Este curso foi criado para desenvolvedores da Web iniciantes e avançados, abrangendo tudo, desde o básico para garantir que as fontes de imagem sejam solicitadas e renderizadas com eficiência, até os detalhes de como os formatos de imagem comuns são comunicados do servidor para o cliente. Ao longo deste curso, você aprenderá como obter os menores tamanhos de transferência possíveis para suas imagens sem comprometer a qualidade – pelo menos, não de uma maneira que alguém possa ver.

Você pode percorrer a série do início ao fim para obter uma compreensão holística de como as imagens funcionam na web moderna ou usá-la como referência para os conceitos específicos e padrões de marcação que você usará em seu trabalho diário.

Para aqueles que são novos no desenvolvimento da web, confira os cursos aprenda HTML para os fundamentos do uso de marcação, Cursos aprenda CSS para fundamentos de estilo e Cursos Aprenda design responsivo para entender como as imagens serão renderizadas em layouts responsivos.

Neste guia sobre SEO para imagens você vai aprender sobre:

Uma breve história sobre as imagens na web

Uma história das imagens na web, começando com o elemento imagem em 1993.

Principais problemas de desempenho

Aprenda maneiras de garantir que suas solicitações de imagem sejam as menores e com melhor desempenho possível.

Imagens vetoriais

Saiba mais sobre SVG, o formato de imagem vetorial usado na web.

Imagens rasterizadas

Descubra imagens raster, como JPEG, GIF, PNG e WebP.

Image em formato GIF

Entenda o formato de imagem GIF, junto com uma explicação de como funciona a codificação de imagem.

PNG

Descubra quando o PNG é o melhor formato de imagem para escolher.

JPEG

Learn about the most common image format on the web.

WebP

Saiba mais sobre o formato de imagem mais comum na web.

AVIF

AV1 Image File Format (AVIF) é uma codificação baseada no codec de vídeo AV1 de código aberto.

imagens responsivas

A deep dive into responsive images.

Descriptive syntaxes

Using srcset and sizes to provide the browser with information about image sources and how they’ll be used.

Prescriptive syntaxes

Find out about the picture element.

Automating compression and encoding

Make generating highly performant image sources a seamless part of your development process.

Site Generators, frameworks, and CMSs

Discover how CMSs such as WordPress, and other site generators can make it easier to use responsive images.

Image content delivery networks

Learn how image CDNs have the ability to transform and optimize the contents of an image.

Conclusão

Some additional resources.

So, are you ready to learn Images?