monocromatic

Grande parte da massa de internautas possui modens com conexão menor de 56K. Muitos não tem Cable Modem, ISDN ou conexão T1 para internet. Portanto, é muito importante para os desenvolvedores e webdesigners verificarem a velocidade do carregamento do seu website e fazerem de tudo para que seja a mais rápida possível.

• Quando você vê uma página da web, o seu conteúdo carrega em uma ordem específica. Imagens e media são as campeãs em alocar sua banda e são as que mais demoram a carregar. Uma proposta opcional seria: que se tirassem todas as formas de media das páginas principais e de busca do site, exceto imagens (leves).

• Você pode muito bem por um som de fundo em seu website, mas este também aloca muito sua banda, especialmente se for com a extensão .wav. Vídeos devem ser evitados a todo custo, a menos que exista uma real necessidade de manter o arquivo a vista (tente reduzir seu tamanho e peso caso isso aconteça). Arquivos como esses devem ser mantidos em páginas diferenciadas, ou mesmo páginas específicas para isso, pois é como muitos dizem “Pessoas odeiam esperar”.

• O próximo ponto que acentua sua alocação de banda é a superlotação de imagens. Você deve ser cuidadoso ao lidar com imagens. Use pequenas dimensões para as imagens e reduza o tamanho do arquivo (neste caso, use editores de imagem que convertam imagens em outros formatos mais leves e que ajudem a redimensiona-las). Você pode até contar com a ajuda de serviços especiais espalhados pela internet para edições simples como redimensionamento ou mesmo para compactar suas imagens e verificar se elas ficam visíveis de forma agradável em seu website. Se o tamanho da sua imagem é 500 x 500, as pessoas irão esperar para sempre.

• Uma vez que tenha as imagens desejadas já compactadas, você poderá testa-las em lugares isolados do seu website para verificar a duração da carga. A imagem ficará gravada no cache do browser que você a carregou e assim, carregara instantâneamente assim que ela seja acessada novamente em outras páginas, ou na mesma. Com isso, você estará livre para carregar outras coisas sem medo das imagens.

• A mais uma coisa que você deve fazer, defina as dimensões da imagem no campo de tags. Seu tempo de carga será salvo e você salvará muita gente dos típicos travamentos decorrentes pelo grande número de arquivos a serem carregados em websites pesados.

• Você também pode utilizar miniaturas que o redirecionem a página de carga da imagem em seu tamanho original, ou mesmo o Lightbox (que não é tão recomendado). Estes recurso pode ser usado com vídeos também. Além de tudo isso, ainda pode-se usar o vídeo hosting proveniente de serviços como YouTube e outros sites similares para exibir o player da media em seus posts.

• Reduzir a quantidade de conteúdo exibido na página principal irá reduzir a carga de tempo do seu site. O elemento de extensão (!–more–) pode ajudá-lo sempre e é um ótimo recurso para deixar suas páginas leves: você pode apenas postar uma breve introdução e adicionar a extensão “Leia mais…” proveniente do elemento já citado anteriormente.

• Otimize o código CSS (style) da sua theme. Além de limpar as linhas em branco, você pode “abreviar” o código da sua theme. Nos sites CleanCSS e/ou CSSTweak você pode otimizar seu código online, bastando copiar e colar o código em um dos sites, e mandar otimizar. Utilize opções de otimização simples, abenas abreviando parâmetros e caso você tenha experiência, tente manter cada classe em uma linha (otimizadores on-line podem fazer estas coisas).

• Deixe os códigos de javascript em arquivos externos (fora da theme). Ao invés de ficar adicionando códigos javascript na seção head de sua theme, adicione-o 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 Google Pages) e adicione o seguinte código na seção head:
  
  
  (script language=”JavaScript” src=”http://seu-site-grátis.com/seu-javascript.js” type=”text/javascript”)(/script)
  
  
  Obs: Troque () por <>.

• Se possível, deixe também o seu CSS em um arquivo externo. Pegue o teu código CSS e cole no bloco de notas. Salve como “seu-estilo.css“. Hospede esse arquivo em seu host (pode ser gratuito, como o Google Pages) e adicione o seguinte código na seção head:
  
  
  (link rel=”stylesheet” type=”text/css” href=”http://seu-site-grátis.com/seu-estilo.css” /)
  
  
  Obs²: Troque () por <>.

• Use tableless! Tableless significa: não usar tabelas para construir um site/theme. Chega de table, tr e td. Tabelas proporcionam um número caótico de espaços em branco no código HTML e fazem qualquer site carregar mais devagar, sem falar que é péssimo para indexação nos sites de busca: as tabelas “separam” o seu conteúdo. Dê sempre preferência ao trabalho com CSS: div’s e classes (class) não “dividem” seu conteúdo em pedacinhos e além do mais, a Google agradece e seu blog fica show de bola.

• Diminua os comentários do código de sua theme. Se você sabe o que cada código 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 (URL’s). Esta é uma dica que parece boba, mas faz uma enorme diferença. 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ões, do tipo: .html, .htm, .php, .asp, etc. A barra pode e deve ser inserida em endereços absolutos e em endereços que apontem um novo diretório. Por exemplo, http://www.site.com/forum/. Essa dica vale tanto para themes como para postagens e sidebars.

• NÃO USE FLASH! Flash é muito bonito de se ver, mas só deve ser usado se realmente houver necessidade e principalmente, só deve ser usado por quem entende do assunto. 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 contribuem para a lentidão de carga. Se gostar de algum Widget em Flash, teste antes para saber se ele é pesado ou não.

• 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 as Keywords (palavras-chaves). Outras metatags importantes são as de verificação do Google e do Yahoo.

• Não abuse de parcerias. É legal ser linkado por todo mundo, mas colocar trocentos botões na barra lateral de seu blog vai deixar sua página principal lenta e seus visitantes confusos (isto é, se eles não fecharem a página antes). Não transforme seu blog em uma “penteadeira”.

Estas são algumas dicas que você pode usar caso seu website ou blog carrege vagarosamente. Uma ultima dica só pra finalizar: caso você queira testar a velocidade do seu blog, utilize serviços on-line como o Speed Test. Tenho certeza de que você definitivamente vai poupar algum tempo extra e diminuirá a bagunça da sua página.

[Tradução Adaptada/Créditos: Blog Oh! Blog e Templates para Blogger]