Blog do The Best

A Eletronic Arts anunciou que dividirá o jogo Need for Speed em três, o que é uma boa notícia para os fãs do jogo. Essa divisão estaria sendo feito para deixar o jogo mais “personalizado” e na categoria que o jogador preferir e trazer mais jogabilidade e realidade para o jogo.

O primeiro a ser anunciado é o Need for Speed SHIFT, que vai retratar as corridas de turismo, pra quem não sabe as corridas de turismo são aquelas onde o corredor escolhe os eu carro preferido e disputa o campeonato em circuitos pré-definidos. Isso mostra a direção que a EA deu ao jogo desde sua última edição, onde os jogos não eram mais disputados nas ruas de grandes cidades e não tinham o envolvimento com a polícia ou gangues.

O SHIFT incide sobre a autenticidade do circuito corridas, trazendo a alta velocidade de condução e a experiência do que o jogador realmente gostaria de obter dirigindo um poderoso carro de corrida. Dos mais de 80 carros, o jogo terá o Audi RS4, Lotus Elise 111R, Pagani Zonda F e Porsche 911 GT2 e outros, para deixar os fãs com agua na boca.

Também foram divulgadas algumas imagens do jogo (Clique na imagem para ampliar):

Para ver o review completo do jogo (em inglês) – Clique Aqui

Para acessar o site de jogo – Clique Aqui

Se você tem problemas com o seu tema ao alinhar as imagens a esquerda, vou tentar ajuda-lo. Depois de muita pesquisa e testes sem sucesso, consegui uma dica que realmente resolveu no meu caso. E não seria justo não compartilhar com os leitores que utilizam o wordpress e estão com problemas.

Tudo isso acontece porque o seu tema, ou template, não tem no CSS as classes necessária para que o alinhamento das imagens ocorra sem problemas. No Wordpress 2.6.X, você configura a imagem para ser alinhada, assim que termina o upload da mesma (conforme fig. abaixo)

Quando você escolhe o posicionamento da sua imagem, o wordpress inclui no código html da inclusão a classe correspondete ao posicionamento escolhido. Para a opção nenhuma é colocado a classe alignnone para a opção esquerda é colocada a classe alignleft, para a opção direita é colocada a classe alignright e para a opção centro é adicionada a classe aligncenter. O mesmo ocorre quando é utilizado os botões do editor de texto sobre as imagens.

O funcionamento do wordpress é simples. E como exemplo, vou colocar o código da imagem acima:

<img class=”aligncenter size-full wp-image-2544″ title=”alinhamento” src=”http://www.thebest.blog.br/wp-content/uploads/2008/08/alinhamento.jpg” alt=”" width=”500″ height=”28″ />

Como podemos ver em negrito foi utilizada a classe aligncenter para centralizar a imagem, caso deseja-se alterar o alinhamento dela, bastaria trocar essa classe pela correspondente. Porém para que funcione é necessário que as classes estejam configuradas no seu arquivo de css.

Para que o seu problema seja resolvido é importante que se inclua as seguintes linhas:

.alignleft { float:left; margin:0 10px 10px 0; }
.alignright { float:right; margin:0 0 10px 10px; }

Obs.: Você pode tirar as margens que estão configuradas. Elas só estão ali para não deixar juntar a imagem com o texto na sua postagem, mas pode-se configura-las de acordo com a sua necessidade ou simplesmente retira-las.

Com isso o problema deve ser resolvido e as imagens passarão a ser exibidas no melhor estilo revista, quando colocadas a direita ou a esquerda.

Um dos fatores que pode levar ao sucesso com os leitores paraquedistas (aqueles que vem de sistemas de buscas) é o tempo de carregamento da sua página. Temos que pensar que esses leitores estão buscando uma informação e, quase sempre, estão com pressa, até porque ele tem uma variedade de escolha com a mesma informação.

O Aconselhável é que o blog/site carregue dentro de 10 segundos, sendo o ideal dentro de 5 segundos. Você deve estar pensando que é difí­cil chegar a um desses valores e eu lhe direi que é muito complicado, pois você acaba tendo que abrir mão de algumas coisas como o excesso de imagens na barra lateral, diminuir os banner de parceiros e etc (mais abaixo vamos ver algumas dicas).

Para você conferir o tempo de carregamento do seu blog/site não é necessário pegar um cronometro e ficar a frente do micro esperando o carregamento, para essa tarefa existem alguns sites que disponibilizam uma ferramenta específica. Vamos conhece-los:

Website Speed Test

Esse site tem uma ferramenta simples e muito intuitiva de usar, pois basta colocar o endereço do blog/site sem o ” http://www. ” e permite verificar até 10 sites diferentes. O resultado é bem simples de se interpretar.

Resultado do blog = 1.43 s

Pingdom

O Pingdom é um site mais completo e mostra em gráfico como está sendo carregada a sua página. Ele leva em consideração todo o processo, para no final dar uma estatística mais completa.

O resultado é um pouco mais complicado de interpretar, porém tem bastante informação para ser analisada e interpretada.

Resultado do Blog = 8 segundos

WebSiteOptimization

Este é site que traz muita informação para analise e informa o tempo de carregamento do seu site para conexões discadas de 14.4k até conexões de 1.44MB. Além de trazer informações sobre imagens internas e externas.

Os resultados são bem estruturados e o site ainda dá algumas sugestões para melhorar a sua performance.

Resultado do blog = 2,26 minutos (56.6k) 14s (1,44MB)

Todos os resultados apresentam diferenças, pois os métodos utilizados são diferentes e, também, pode-se levar em consideração a localização dos servidores.

Dicas para melhorar o tempo do seu blog/site

Antes de dar as dicas é importante que voce entenda como é feito o processo de carregamento de uma página pelo browser. O processo é simples pois ele, basicamente, é um download dos itens que você colocou na sua página.

Vamos ver um exemplo: Numa página tem 5 kB de html (arquivo de texto que contém as informações de carregamento da página), 1 imagem de logo com 20Kb, 1 imagem com 23kb e um texto de 3Kb. O carregamento seria de 5 + 20 + 23 + 3 = 51Kb de downloads.

Porém esses 51 Kb de downloads, que são feitos pelo browser podem apresentar vários resultados dependendo de alguns fatores. O principal deles é a localização do arquivo em relação ao browser e ao site. Para que se entenda esse fator é simples, basta pensar na trajetória do arquivo vindo de um servidor que se encontra na europa para um browser brasileiro e um arquivo que está em um servidor no Brasil para o browser brasileiro.

Agora vamos ver algumas dicas (sugestões) para que seu carregamento melhore bastante.

Compactar imagens

As imagens normalmente são as grandes vilãs para um carregamento lento. Tudo isso por causa do tamanho delas. Dependendo do formato que você utilize para exibir as suas imagens os problemas podem aumentar. eu aconselho que se leia o artigo Que tipo de imagem utilizar em seu blog.

Evitar o excesso de imagens

O excesso de imagens, principlamente nas barras laterais e menus do site, devem ser evitadas, pois ,como vimos anteriormente, elas podem causar alguns problemas de lentidão no carregamento e vão aumentar o a utilização de banda gasta pelo seu site (para os que tem hospedagem paga, o custo também é aumentado).

Devemos apenas usar as imagens necessárias na página fixa do blog/site, pois como ela carrega sempre e independe do artigo que o leitor está lendo, a lentidão e o tráfego passam a ser crônicos. Deixe espaço para que você possa utilizar imagens nos seus textos e embelezar os seus trabalhos.

Evitar layouts muito carregados

É super importante que você antes de escolher o template ou layout do seu blog/site, verificar o tempo de carregamento dele. Para isso você pode utiliza o site de demonstração do template ou instala-lo e testa-lo nos sites acima.

Os templates que são mais básicos tem uma grande probabilidade de serem mais leves, mas não se engane e sempre teste antes. Os templates muito coloridos e com muitas curvas são mais pesados, pois utilzam mais imagens para fazer estas curvas.

Evite colocar muitos banner de parceiros

Como disse anteriormente as imagens são grandes vilãs e os banners, como são imagens e normalmente hospedados em servidores gratuitos, não deixariam de ser também. Cheguei a fazer um teste com 10  e 5 banners numa página de testes e percebi um resultado impressionante de 4,3 segundos de diferença.

* Entendam que não estou entrando no mérito de qualquer sistema de parcerias e muito menos falando o que você deve fazer com suas parcerias, lembre-se que são dicas ou sugestões.

Evite colocar informações duplicadas

Não tem necessidade de você duplicar informação no seu site/blog, principalmente nas partes fixas dele. Toda informação duplicada faz com que seja carregada duas vezes a mesma coisa.

Evite colocar widgets externos

Os widgets externos, principalmente os que mostram informações sobre os visitantes , estatísticas e tráfego. Apesar de ser uma informação interessante para o responsável do blog, mas para os visitantes sócausam transtornos.

O ideal é que se utiliza wigets que tragam informações interessantes para os seus leitores e caso deseje colocar informações estatísticas do seu projeto, faça um artigo com os dados ou coloque em uma página específica. Assim você atingira o seu objetivo e somente quem se interessar pelo assunto vai buscar a informação.

Imagem por apesara

Como disse lá no início do artigo, o tempo ideal para a abertura completa da página é de até 10 segundos em um micro com conexão rápida banda larga. Deveos sempre lembrar que ainda temos pessoas que utilizam conexão discada. Claro que isso depende do objetivo do projeto e de seu tamanho, mas é importante que o carregamento seja rápido para o seu leitor não desistir de lhe visitar.

O Rio de Janeiro é a cidade mais bonita do Brasil, na minha opinião, e continua sendo a cidade maravilhosa, que era adorada e idolatrada pelos grandes músicos da mpb. Apesar de toda violência e a falta de um governo decente e pró-ativo para solucionar os problemas básicos da população, ela consegue resistir ao tempo e a degradação.

O portal da Geo-Rio lançou um projeto muito legal, que consiste na exibição de um filme que mostra  a transformação de um local importante do Rio durante os anos. A animação é feita com imagens que se sobrepõe de acordo com o avanço da linha do tempo. Você pode escolher 4 lugares, para ver a  sua transformação urbana em ilustrações.

Para acessar o site clique aqui

Vale a pena conferir!

Existem vários formatos para disponibilização de imagens, os mais conhecidos são bmp, png, gif e jpg. A grande dúvida é qual deles usar no seu site ou blog.

Para isso vamos fazer algumas comparações que envolvem qualidade e tamanho do arquivo. O melhor tipo de arquivo a se usar  é o que apresentar uma boa relação Tamanho x Qualidade. Para isso teremos a mesma imagem, nos formatos mais conhecidos, para compararmos.

As imagens foram feitas através do programa Winsnap, recortadas do site globo.com e tem o mesmo tamanho.

A imagem acima foi feita no formato bmp e tem 116 KB.

A imagem acima está gravada no formato png e tem 45 KB.

A imagem acima está gravada no formato gif e tem 16 KB.

A imagem acima está gravada no formato jpg e tem 14 KB.

Os melhor formato para imagens, em que não se precisa de muita definção, é o jpg, pois reúne uma boa qualidade com uma compactação excelente. Porém se você deseja mais qualidade poderemos utilizar o formato png, que mantém as cores e a definição semdentilhamento.

Eu, normalmente preciso de fazer redimensionamentos de imagens em massa, seja para postar aqui no blog ou para outros trabalhos. Por isso estou sempre procurando alternativas e facilidades para executa-las.

Eu utilizava o Microsoft  Office Picture Manager 2007, que faz parte do pacote Microsoft Office 2007, sendo que ele é muito pesado para carregar e somente efetuar o redimensionamento das imagens. Seguindo a dica do meu amigo SandroCE fui experimentar o Squash, que é uma ferramenta gratuita (Freeware), muito leve ( 2,94 MB ) e que atende muito bem as necessidades.

Não tem muita configuração a ser feita, apenas a porcentagem que você deseja reduzir e a pasta onde vão ser salvas as imagens modificadas. Porém ele só converte as imagens nos formatos png, jpg e bmp, que são os formatos mais usuais mesmo.

Para fazer o download do programa – Clique Aqui

Eu não ia postar nenhuma piada sobre a descida do corinthians para a segunda divisão, mas não resisti e vou dedicar um post pequeno a eles.

Até o Google sabe???

Soltaram a ancora na hora errada, sacanagem ….

Novo cambio criado para os corintianos

Além das imagens ainda tem as frases gaiatas e bem humoradas:

- Alô.. alô … Corinthians ? Ixiiiii acho que caiu. Tu tu tu ..

- Lulinha: 5 milhões. Felipe: 2 milhões. Gustavo Nery: 1 milhão. Corinthians rebaixado: não tem preço.

- Luciano Huck é no sábado, Faustão é no domingo e o Corinthians é na segunda.