No Blogger, quando você envia uma imagem e verifica que o tamanho está maior do que cabe no post, você faz upload dela novamente para colocá-la no tamanho adequado? Não gosto de ser repetitiva, mas, se você faz assim, está fazendo errado.
- Você está desperdiçando seu espaço de armazenamento de imagens.
- Você está tornando o seu blog mais lento com o carregamento de duas ou mais imagens, sendo que ele deveria carregar só uma, já que é a mesma.
A hospedagem de imagens no Blogger-PicasaWeb-Google Plus é muito mais inteligente do que parece. Depois que enviamos a imagem, podemos mudar o tamanho dela fazendo uma pequena modificação no código da mesma, sem perder a nitidez da imagem.
Para exemplificar a pequena modificação (parte do código em destaque) que deve ser feita no código para obter tamanhos diferentes, vou comçar com um papel de parede. Por ser uma imagem em formato paisagem, o valor de pixels refere-se à largura:
150 pixels - s150
200 pixels - s200
320 pixels - s320
400 pixels - s400
Em uma imagem com formato retrato, o valor de pixels refere-se à altura:
150 pixels - s150
200 pixels - s200
320 pixels - s320
400 pixels - s400
Para ver mais exemplos de tamanhos, clique aqui.
Recorte quadrado
Adicione -c para ter um recorte quadrado, sem distorção da imagem:
Mais exemplos no post Exibir recorte quadrado de uma imagem usando Picasa.
Largura e altura
Além do tamanho (s) da manhor dimensão, também é possível definir especificamente a largura (w) ou a altura (h) da imagem. Para decorar, basta se lembrar das palavras em inglês: size, width e height.
400 pixels de largura - w400
400 pixels de altura - h400
Sem redimensionar na janela
Por padrão, quando o tamanho da imagem é maior que o tamanho da janela do navegador, o browser automaticamente redimensiona a mesma para caber 100% na tela. Para que consiga ver em tamanho real, o cursor do mouse se transforma em uma pequena lupa e você tem que clicar sobre a imagem para ampliá-la.
Para que a imagem não seja redimensionada na tela do navegador, você pode adicionar –h logo após o tamanho da imagem. Para compreender melhor, clique nos seguintes exemplos e observe-os:
Redimensiona
Não redimensiona
Até mais!
Imagem do site Sanriotown.
Olá Helen,
ResponderExcluirSuas dicas são ótimas. Será que você pode me ajudar numa coisa? Quando eu clico sobre uma imagem esta se abre ampliada numa nova janela, pergunta: como eu transformo essa imagem ampliada num link?
@Ricardo,
ResponderExcluirSe eu entendi sua pergunta, ela não faz sentido, já que todos os meus exemplos têm códigos e exemplos dos códigos.
Olá Helen,
ResponderExcluirMe desculpe. Não me fiz entender. Vou exemplificar minha duvida. Por exemplo, se eu clicar sobre a última imagem desse seu post ela vai abrir ampliada numa nova janela ok? O que eu quero saber é se é possivel transformar essa imagem ampliada num link que redirecione meus visitantes para um outro lugar qualquer.
@Ricardo,
ResponderExcluirClaro, link é link. Você redireciona para onde bem entender.
kkk
ResponderExcluirOK. Deixa pra lá.
Valeu a dica, no blog do Cris B.
ResponderExcluirCom este padrão do Picasa, dá até pra criar um sistema, com uma função para inserir no post, escolhendo o tamanho, usando os tamanhos padrão ... E, para quem sabe, fazer um plugin p/Wordpress, ou Widget pro blogger...
Valeu a dica.
quero fazer uma pergunta...
ResponderExcluirassim, quando eu coloco uma imagem no meu blog, ela fica com aquele negocio chato, que quando vc passa o mouse ela vira link e quando vc clica ela amplia (como nos exemplos acima, onde vc mostra oa função do -h) eu queria tirar isso, queria tirar esse link da imagem, para que ninguem precisa ficar clicando para ampliar...
POR FAVOR RESPONDA
@Caio, leia o post Como criar links para aprender qual é a parte do código que você tem que tirar.
ResponderExcluirLembrando que, para mudar o código, é preciso editar o post no modo HTML.
Volte sempre!
Olá Helen!
ResponderExcluirMuito obrigada pelas dicas!! Tenho uma dúvida: é possível limitar os tamanhos das imagens pelo HTML? Gostaria que as imagens de todos os autores do blog pudessem ter o mesmo tamanho sem eles terem que ficar ajustando o tamnho certo toda hora...
Obrigada!!!
Daniela, com JavaScript isso é possível, mas eu nunca pesquisei a respeito.
ResponderExcluirMuito obrigado pela dica!
ResponderExcluirAmiga, num dos meus blogs, cliquei em exibir dimensão das figuras. Daí, sempre que acesso esse blog, sobre cada foto aparece um pequeno quadro informando sua dimensão. Como faço para que pare de exibir esse quadro ? Desde já lhe agradeço. sgs@terra.com.br
ResponderExcluirÉ Blogger?
Excluir