Otimização de Imagens + WordPress

26/11/2014

Para quem já usa wordpress e está acostumado a postar, o assunto não é novidade… Mas para quem está começando agora, acredito que essas dicas podem ajudar em algum momento. :)

Separei a postagem em 3 tópicos pra facilitar. São dicas gerais para configurar o seu painel de media, editar as imagens e preencher as informações dela no wordpress de forma mais completa.

Configurando os Tamanhos no WordPress

Menu Lateral -> Settings -> Media
Nele encontramos 3 opções de tamanho.
Você só precisa preencher os que for usar. Se não for, deixa em branco (pois será uma imagem a menos para o wordpress gerar no servidor).

P.S. A configuração desses tamanhos no painel de media (quando as imagens não forem usadas diretamente no post) valem se os mesmos forem chamados na programação do seu tema.

Otimização de Imagens + WordPress

Thumbnail Size

Se o blog vai ter posts relacionados ou qualquer outra imagem de postagem “pequena”, você preenche com o tamanho exato da miniatura do seu layout.

No caso aqui do blog, minhas miniaturas são 110x110px e o wordpress corta certinho neste tamanho.

Medium Size

Se usa um tamanho alternativo de imagem, pode preencher no tamanho médio.
Eu uso 230x230px para as imagens das categorias e arquivos.

Large Size

Preencha com a largura máxima que uma imagem pode ter no seu layout.

No caso aqui no blog, sempre uso imagens com 850px de largura – como a altura varia (e não quero que o wordpress neste caso corte a minha imagem) eu deixo esse valor em branco, assim ele redimensiona proporcionalmente.

DICA: Se você usa slides no topo ou alguma outra imagem maior do que a da postagem, configure ela no tamanho maior e deixe o tamanho médio para o seu post.

Preparando suas Imagens

SEMPRE edite as imagens que irá usar no seu blog. JAMAIS faça o upload de uma imagem que “saiu direto da câmera”.

Imagens grandes e pesadas só cansam o seu servidor e o seu leitor (que precisa ficar esperando uma eternidade o blog carregar).

DICAS: Ajuste o tamanho da imagem para o tamanho da largura do seu post e a resolução opte preferencialmente por 72dpi.

Otimização de Imagens + WordPress

Depois que terminou de editar sua imagem, salve ela pra web! Fica pequena, leve e vai carregar lindamente no blog!

Otimização de Imagens + WordPress

Preenchendo as Informações da Imagem

Assim que você faz o upload de uma imagem no wordpress é essa tela abaixo que aparece. Meus clientes estão acostumados com esse print! Sempre passo quando finalizo a programação.

Considero ele super importante… É simples e se você segue faz uma diferença danada! :)

Fique atento aos passarinhos – eles indicam os lugares importantes que você deve ajustar/preencher.

Otimização de Imagens + WordPress

JAMAIS renomeie as imagens que irá usar no blog com acentos, símbolos ou espaços. Tem alguns navegadores que não entendem isso e sua imagem vai ficar quebrada.

SEMPRE renomeie suas imagens usando letras_numeros_underline-ou-traco_01. Uma imagem renomeada corretamente (com o assunto do post) deixa seu blog mais lindo e ajuda os mecanismos de busca a encontrarem ela e o seu post.

Se acostume a preencher SEMPRE o “title” e o “alt”.

Eles ajudam a “ler” a sua imagem: nas buscas do google, se a imagem não carregar no blog e ainda, deficientes visuais leem as imagens de acordo com o que você escreveu no “alt” – ou seja, é um item super importante de usabilidade.

DICA: Alinhe suas imagens no centro da postagem, se ela não tem link, marque “none” e se configurou o seu painel de media, só usar o tamanho máximo e inserir no post. Vai ficar lindo!

Bom, espero que tenham gostado do post, confesso que estava com saudades de postar na categoria de desenvolvimento web! :)

Comentários!
  1. Lou (Responder)
    27/11/2014

    Não sabia a metade das suas dicas, só colocava mesmo a imagem no tamanho do blogs, rs. Vou melhorar as postagens daqui para frente, obrigada Mari. =D