Post sobre |Dicas blog, Pc windows

Otimizar imagem e testar o carregamento do blog

Nessa onda de otimizar o blog, melhorar as imagens e encontrei um site que testa a velocidade de carregamento das páginas, mostra as imagens e arquivos mais pesados. Já queria ter feito isso a um tempo mas o brasileiro aqui vai deixando para amanhã; mas agora vai ficar meio bagunçado, por poucos dias. Já diminui três imagens, enquanto posto aqui.


O site que faz o teste de tempo de carregamento do blog ou página é esse Linkvendor.com. Esse site carrega seus links de forma um pouco diferente, caso não apareça nesse endereço(linkvendor.com/seo-tools/site-analysis/website-speed-test,46.html) procure o link para essa ferramenta: website speed test.
Se esse serviço estiver indisponivel para testar o tempo de carregamento de página, tente WebSiteOptimization
Post relacionado
Ferramenta SEO online grátis, Keyword Analise blog, site

Atualização 2009: Esse foi um dos meus primeiros posts usando o blogger, está meio confuso, principalmente abaixo. Mas encontrei um site que reduz o peso(bytes) de algumas imagens sem perda de qualidade, porém, talvez ela deva estar hospedada na web, o site smush.it ou yahoo.com/yslow/smushit

Otimizar imagens online com a ajuda do blogger(diminua bytes)

favoritos

Uma vez eu postei uma imagem animada grande e o blogspot transformou a imagem, dessa vez é uma transparente, ele não modificou essa apenas fez duas, essas são com fundo transparente.



favoritos



scan grátis do Norton anti-vírus Essa imagem acima estava no meu PC, ia postar ela aqui nesse post sobre anti-vírus

Clique com o botão direito do mouse e em propriedade sobre as imagens abaixo e veja (bytes) de cada. Detalhe; Era apenas uma quando postei, entenda mais lendo Três endereços das imagens postadas no BlogSpot


Não usei essabusca, search, + pesada





Otimizada pelo blogger, apenas em bytes, mas a qualidade da imagem ficou muito inferior.busca, search, Otimizada Dica: Clique com botão direito do mouse e depois propriedades sobre a imagem para conhecê-la melhor.

Só que o blogspot me sacaneou nessa acima que era .gif e ele transformou em duas .PNG

Apesar de elas terem nomes com o final .GIF quando coloca o nome na barra de endereço do navegador baixa ou abre uma imagem .PNG, mas o peso delas em byts diminui quando são postadas no BlogSpot, o que me leva a imaginar que antes elas passam por um software que otimiza elas para uso na Internet, bom pro meu blog também que ta precisando de um "regime", já consegui diminuir um terço no tempo dele carregar, mais ainda não ta nada bem, tive que tirar algumas coisas que eram minhas... coisas quase inúteis mas eu gostava, mas vou otimizá-las e colocar de volta, com o tempo...
Essa imagem abaixo era maior, a parte azul, eu usava como background de de um formulário, reduzi seu tamanho para carregar mais rápido, veja a ilustração de como ela era antes:

E abaixo o depois:

imagem exemplo newsleter
Dica: Para página carregar mais rápido especifique o tamanho real das imagens usando:

width para largura, height para altura.

Veja exemplo:

<img alt="newsleter" title="receba postagem por email" description="imagem que irá ativar botão para receber postagem por email" src="http://3.bp.blogspot.com/_NrcfzTud13U/SEzja-B5GBI/AAAAAAAAAEw/2hM-ZDmSaGk/s200/newsleterla3%5B1%5D.gif" width="18" height="14"/>

Otimizar imagens pro google

Também é interessante usar essas três tags para imagem:

E de preferência combinar o nome da imagem com a tag ALT e os textos próximos a ela;

Exemplo: Vamos supor que a imagem abaixo fosse de um software e eu estivesse fazendo no blog, uma campanha, para vender ou demonstrar as utilidades de um construtor de imagens(software)

Otimizar imagens e testar online gratis o blog o blog poderia aparecer com a imagem nas buscas por imagens do google, e ela teria ainda um valor de texto, usaria:

<img src=".../images/software-creator-imagem-otima.gif" Alt="software creator o melhor software para deixar sua imagem com otima qualidade" title="Gif creator - Faça um teste online, grátis" width="50" height="50" />Esse software melhora a imagem, baixe grátis para avaliação, 30 dias....

alt="newsleter"

Caso a imagem não carregue irá aparecer o texto, é bom observar que imagem pequena é aconselhável usar o texto curto pra ALT, se for texto grande e a imagem não aparecer em seu lugar irá aparecer um grande texto.

title="receba postagem por email"

Ao passar o cursor sobre a imagem aparecera um texto geralmente amarelo ou da cor especificada pelo usuário no PC. É bom não exagerar, muitas vezes ele desaparece ao mexer com o mouse e ninguém gosta de ler a "metade".

description="imagem que irá ativar botão para receber postagem por email"

Essa tag define um texto que um usuário com alguma deficiência visual irá ouvir se ele tiver um software para isso(pode descrever em detalhes a imagem).

Também é interessante usar imagens Atrativas, bonitas, engraçadas, etc. para que as pessoas que fazem busca por imagens visitem seu blog.

4 comentários:

Otimizar imagem e testar o carregamento do blog2008-06-09T04:57:00-03:00
  1. Mais uma vez volto a comentar, parabens mesmo por este poste , gostei dessa das imagens eu nao sabia que algus blog poderia mudar formato das imagens .. bom mas eu ja tinha desconfiado .valeu pelas dica.

    Responder
  2. muito bom seu blog

    Responder
  3. Aconteceu comigo,fiz um scrap em gif e quando fui postar no blog ele se multiplicou. Ficou 2 em 1.
    Excelente postagem.

    Responder
  4. oi, obrigada por compartilhar conosco essas informaçoes, muito bom, acabei de usar várias dicas suas para varios blogs meus,....

    obrigada

    Responder

→Dê sua opinião. Faça comentário relacionado ao post.
Comentário com e-mail será excluído
Antes de perguntar leia o texto até comentários e pesquise, a resposta virá no comentário, para ser avisado use uma conta e o link: Subscribe by email(abaixo)
Será excluído comentário não relacionado ou com Url de blog/site(Divulgar? Clique)

Comentário reflete a opinião do comentarista. Desde já, Obrigado!