Dicas para deixar seu blog mais rápido
Você já parou para pensar em qual é o segredo de alguns blogs ou sites campeões de acesso? Pois saiba que a explicação pode ser mais simples do que você imagina e que os bons resultados e grandes números de acesso deles não acontecem por acaso. É cada mais dia comum na web o trabalho de SEO – Search Engine Optimization.
Traduzindo, trata-se do trabalho de otimizar uma página web, ou mesmo um site inteiro, de modo que ele fique mais “amigável” ou acessível aos sites de buscas. O objetivo das técnicas de SEO é melhorar o posicionamento de uma página nos mecanismos de busca, aumentando a probabilidade de crescimento do número de acessos.
Qualquer um pode aplicar técnicas de SEO em uma página?
Em tese qualquer um pode tornar suas páginas mais acessíveis para os sites de buscas. No entanto, o SEO se baseia em uma série de possibilidades e não é pelo simples fato de você aplicar algumas regras básicas na hora de postar seu conteúdo que seu site aumentará o número de visitantes da noite para o dia.
Não é a toa que o número de profissionais que se especializam nesta área cresce a cada dia. Mas você pode fazer a sua parte dando uma mãozinha para os buscadores, entendendo um pouco como eles funcionam e dando a eles a oportunidade de ser encontrado com mais facilidade.
O primeiro passo: a edição das meta tags
Você sabe o que são meta tags? Elas nada mais são do que um conjunto de informações que são colocadas no código HTML da sua página para passar informações aos robôs dos mecanismo de buscas a respeito do seu conteúdo. É como se elas sintetizassem, em poucas linhas, tudo o que usuário irá encontrar naquele endereço URL.
Cada mecanismo de busca tem uma maneira particular de checar e priorizar essas informações. Por isso é importante dar atenção a esse aspecto. Se você tem algum conhecimento de HTML pode editar as informações do cabeçalho da página. Aspectos como título, descrição e palavras-chaves são alguns dos itens que você deve levar em consideração. Se você utiliza algum sistema de blogs, como Blogger ou Wordpress, pode encontrar alguns plugins que permitem editar esse tipo de informação sem precisar ter contato direto com o código-fonte.
Você pode conhecer um pouco mais sobre edição lendo o “Search Engine Optimization Starter Guide”, um guia para iniciantes disponibilizado pelo Google. O guia está em .PDF e é disponibilizado também em português.
Mais do que edição de código, SEO é conteúdo
De nada adianta você se preocupar apenas com o código das páginas se o seu conteúdo não é relevante, não é original ou é repleto de erros de português. O primeiro passo para atrair visitantes para o seu site é escrever com freqüência, de preferência um conteúdo inédito e original sobre um assunto. Sites e blogs que apenas copiam informação alheia além de agir de maneira antiética, também acabam por se tornar irrelevantes nos mecanismos de busca.
Lembra das aulas de redação, em que você aprendeu que na estrutura de um texto a informação mais relevante aparece por primeiro e, em seguida você apresenta o desenvolvimento e, por último a conclusão? Aqui a regra vale da mesma maneira. O texto que é apresentado por primeiro tem peso maior que o que vem na sequência. Por isso criar um texto com uma estrutura coesa, e num linguajar correto, ainda é a melhor maneira de cativar a audiência dos seus visitantes.
Um dos grandes problemas dos blogs hospedados no blogger/blogspot (alguns em WordPress também) é que com o tempo, eles vão ficando pesados, demorando cada vez mais para abrir a página.
As causas são variadas: pode ser um template mal planejado, pode ser um código CSS não otimizado, ou muitas widgets na sidebar, imagens com tamanho de arquivo grande, javascript, flash….
Ou você pode deixar de ganhar leitores e tráfego. Isso se não perder os leitores já conquistados.
Quer testar o tempo de carregamento de página do seu blog/site? Vá até o site SpeedTester, ou Mestre SEO , digite a URL (endereço) do seu site/blog e o código de confirmação e clique em CHECK. Esse site gerará um pequeno relatório com o tempo de abertura de sua página em conexão discada (56k), ISDN (128k), UMTS, DSL (786k, banda larga normal no Brasil), T1 e T2 (conexões acima de 2 megas).
O ideal é que um blog abra em no máximo 6 segundos em conexão discada.
Mas o quê podemos fazer para que o blog (ou mesmo o site) fique mais rápido, com tempo menor de carregamento de página?
Otimize suas METATAGS:
Use somente metatags importantes para indexação de seu blog. As realmente necessárias são as Metatag Title (nome do site), Description (descrição do site, é o que vai aparecer nas buscas pelo endereço do seu blog) e Keywords (palavras-chaves).
Outras metatags importantes são as de verificação do Google e do Yahoo!, e a metatag robots;
Dê fim aos espaços em branco no código seu template:
Pode parecer loucura, mas os espaços em branco do seu template consomem espaço no arquivo. Retirar os espaços em branco do código podem fazer seu blog/site abrir um pouco mais rápido.
Se você ainda não é muito confortável com edição de códigos e tem medo de se perder, retire somente as linhas em branco. Deixe o código de seu template sem linhas em branco (sem “pular” linha).
Otimize o código CSS (style) do seu template:Além de limpar as linhas em branco, você pode “abreviar” o código de seu template. Nos sites CleanCSS e/ou CSSTweaks você pode otimizar seu código online, bastando copiar e colar o código em um dos sites, e mandar otimizar.
Há opções para otimização simples - somente abreviatura de parâmetros, bom para iniciantes; otimização normal - deixa cada classe em uma única linha, bom para quem tem boa base em CSS e HTML; e otimização profunda - deixa tudo em uma única linha, se você não tem o costume de ter uma cópia de seus códigos no PC não recomendo, pois esse método torna difícil a localização das classes para edição futura.
Deixe os códigos em javascript em arquivos externos (fora do template):
Ao invés de ficar adicionando códigos javascript na seção HEAD de seu template, adicione em páginas externas. Isso vai contribuir para que seu blog carregue mais rapidamente.
Pegue o código javascript e cole no bloco de notas. Salve como '“seu-javascript.js”' Hospede esse arquivo em uma conta de sites (por exemplo, o GooglePages) e adicione o seguinte código na seção HEAD:
TABLELESS
Já ouviu falar em tableless? Se não, preste atenção com carinho: tableless significa não mais usar tabelas para construir um template. Chega de TABLE, TR, TD. Essas tabela geram um enorme espaço em branco no html e fazem qualquer site carregar mais devagar, sem falar que é péssimo para indexação nos sites de busca: as tabelas “separam” o conteúdo.
Dê sempre preferência ao trabalho com CSS: DIVs e classes não cortam teu conteúdo em pedacinhos, o Google agradece e seu blog fica show de bola.
Diminua os comentários do código de seu template:
O seu template tem vários comentários do tipo: /**** início do cabeçalho****/, /**** inicio do código do fulano *****/, , ???
Se você sabe o que cada código de seu template faz, não são precisos esses comentários certo?
Apague-os, deixando seu código mais leve.
Use a barra “/” no fim dos diretórios em endereços URL
Uma dica que parece boba, mas que faz uma enorme diferença, é usar a barra no fim de endereços. http://teublog.blogspot.com/ abre mais rápido do que http://teublog.blogspot.com . Só não adicione a barra se o endereço terminar com extensão .html, .htm, .php, .asp, etc.
A barra pode e deve ser inserida em endereços absolutos e em endereços que apontem um diretório (pasta). Por exemplo, http://www.site.com/forum/. Essa dica vale tanto para o template como para postagens e sidebars.
Imagens: defina SEMPRE a largura e altura
Aqui a bronca aos preguiçosos de plantão: inserir uma imagem no seu blog, seja no código ou mesmo nas postagens e widgets, sem os atributos WIDTH e HEIGHT (largura e altura) obriga o navegados a ter que “calcular” essas medidas, deixando o carregamento da página mais lento. Essa dica vale tanto para o template como para postagens e sidebars.
Defina sempre a largura e altura de suas imagens dentro da tag IMG SRC e
veja seu blog carregar mais rápido.
Mais Imagens: Use miniaturas (thumbnails) nas postagens ou diminua o tamanho de arquivo delas
Usar miniaturas, além de deixar seu blog mais profissional, pode deixar ele mais rápido a seus leitores: Se o seu leitor quiser ver a imagem no tamanho real, basta clicar sobre a miniatura. Tanto o Blogger quanto o WordPress têm suporte ao uso de miniaturas.
Se você prefere o tamanho normal, então use um programa para diminuir o tamanho de arquivo (procure por “Image Resize programs”), ou otimize para WEB em programas como Photoshop, PSP, GIMP, etc.
NÃO USE FLASH
Flash é muito bonito de se ver, mas é prá quem entende e não para quem quer. Quem trabalha ou estuda Flash vai saber fazer uma animação ou banner (ou ainda um site todo) bem leve.
Mas se você é um simples blogueiro como eu, PASSE LONGE das animações em flash: elas deixam o carregamento do blog muito lento.
Widgets em Flash normalmente também são lentos.
Se gostar de algum Widget em Flash, teste antes prá saber se ele é pesado ou não. Seus visitantes agradecem.
Há muitos outros jeitos de se deixar um site/blog bem otimizado e leve, mas essas 11 dicas já ajudam muito um blog-carroça a ganhar mais velocidade.
Todavia, não coloque widgets demais no seu blog. Eles deixam de fato qualquer site mais lento. Opte pelos realmente necessários à você e seus visitantes.
Também não abuse de parcerias: É legal ser linkado por todo mundo, mas colocar trezentos botões na barra lateral de seu blog vai deixar sua inicial lenta e seu visitante confuso (se ele não fechar a página antes). Não transforme teu blog em uma “penteadeira”.
Quer fazer parcerias com vários blogs?
Uma alternativa à essas parcerias é um sistema de troca de banners ou de botão.
Coloquei aqui no Templates para Blogger dois sisteminhas de troca de banners, um para banners de 468×60 pixels e um para botões de 120×60 pixels. Você mostra os parceiros aleatoriamente, seu banner/botão aparece em todos os sites parceiros, e teu blog não fica com botões em excesso.
À medida que adicionamos plugins, imagens e publicidade em nossos blogs, o seu tempo de carregamento acaba crescendo e, às vezes, atinge proporções intoleráveis, principalmente para usuários de internet discada, que ainda existem em grande número no Brasil. Mas existem 17 grandes e simples passos para sanar esse probleminha.
1. Use um plugin de cache
Esse é o básico do básico. Um plugin desses simplesmente cria versões estáticas de suas páginas, não precisando, assim, acessarem toda vez o banco de dados de seu blog, atrasando o carregamento destas páginas. Além da maior velocidade experimentada pelo usuário, você economiza largura de banda de sua hospedagem. Eu recomendo usar o WP Super Cache ou, talvez, o 1st Blog Cacher que conheci hoje e, segundo o Janio, é muito melhor que os outros.2. Otimize os códigos do seu blog
Alguns temas Wordpress (ou templates para o Blogger) acabam vindo com alguns espaços desnecessários: eu já vi temas que pulam 3 linhas para cada código diferente. Deixando apenas uma linha você consegue poupar um bom tempo de carregamento sem atrapalhar seu trabalho de edição.3. Pague por uma hospedagem decente
Muitas empresas por aí (some aqui também todas as hospedagens gratuitas) fazem tremendas sacanagens só para ganhar dinheiro (como usar servidores com pouca potência) e seu blog acaba pagando o pato. Antes de contratar uma empresa, pesquise na internet alguns feedbacks de usuários. Eu, por exemplo, recomendo o Pre-lude por ser a empresa que eu uso e a Porto Fácil, simplesmente porque é do Janio.4. Fique ligado nos updates do WordPress
Nunca deixe seu blog com uma versão antiga, pois as novas sempre podem vir com atualizações que dinamizam todo o sistema dessa grande plataforma de blogagem, deixando seu blog um pouquinho mais rápido.5. Delete plugins inúteis
Estes são grandes inimigos da velocidade de carregamento de um blog. Se não usa, por que deixá-lo ativado ou jogado em uma pasta do servidor, ocupando espaço?6. Diminua o tamanho dos códigos CSS
Esse é um trabalho muito fácil de ser feito. Quando você criar uma nova classe ou id CSS, coloque todas as suas definições na mesma linha: isso geralmente não atrapalha muito o seu trabalho. Veja a diferença deste formato:body {Para este:
background:#BEC3C6 url(img/bg.jpg) repeat-x;
color:#555;
font-family:Sans-serif;
font-size:12px;
}
body {background: #BEC3C6 url(img/bg.jpg) repeat-x; color:#555; font-family:Sans-serif; font-size:12px;}Pode-se trabalhar muito bem com o código, mas poupando muito espaço. Ainda mais se você usar um editor inteligente, como o Notepad++ que deixa tudo com cores diferentes, facilitando a leitura.
7. Troque PHP por HTML
8. Poupe ainda mais tempo de carregamento com PHP
Existem vários snippets em PHP que chamam a mesma coisa. Acontece que alguns fazem esse trabalho muito mais rápido. E encontrei um ótimo site no blog do Daniel Camargo, o PHP Benchmark: ele compara vários códigos que fazem a mesma coisa e mostra qual tem um tempo de carregamento mais rápido que outro. Assim, você pode dar uma bela dinamizada em seu blog (note que este site também é carregado muito rapidamente).9. Use um servidor do seu país
A conexão de pessoas vindas do mesmo país do servidor fica mais rápida do que se viesse de um outro continente, por exemplo.10. Comprima seus scripts em Javascript
O Dean Edwards, mestre do Javascript, criou um site que compacta códigos Javascript rapidamente. Atualmente muitos temas Wordpress vêm com algumas funções em Javascript (inclusive o tema que estou usando). E eu não lido muito com estes códigos, então não me importo de compactá-los. E, realmente, eles ficam muito menores. Já estou mudando todos os meus aqui.11. Acabe com os comentários de códigos
Alguns temas Wordpress vêm com descrições em cada parte do código. Algo do tipo:<!– header START –> e <!– header END –>Se você já conhece bem seu código, não precisa mais disso, pode cortar tudo fora.
Um comentário:
Muito bacana o Post,muito informativo.Continuem com esse tipo de matéria.
Abraço.
Postar um comentário