Torne seu site mais rápido e venda mais Descubra como criar uma estratégia de aceleração de sites que deixe seu site mais rápido e aumente sua conversão
UAIZO A Uaizo ajuda a sua empresa a definir a estratégia ideal de aceleração para o seu site e possui a tecnologia Edgecast de distribuição de conteúdo. A Edgecast é a solução de distribuição de conteúdo mais rápida e confiável do mundo. Contamos com um time de especialistas em infra estrutura que garantem que a implementação da melhor solução, com suporte 24 horas por dia e 7 dias da semana. Clique aqui para falar conosco.
ÍNDICE 01 Introdução 06 Como o tempo de carregamento pode afetar o seu negócio?... 08 Como um site mais rápido pode me ajudar a alcançar um melhor posicionamento no Google?... 09 O desafio... 10 Resumo do capítulo 02 Ferramentas disponíveis 12 O que é CDN... 13 Por dentro de uma página web... 14 É possível diminuir o tempo de carregamento do conteúdo dinâmico?... 16 Para o desenvolvedor!... 17 Sua página desenvolvida pelo melhor programador do mundo... 19 Para o desenvolvedor!... 20 O caminho entre o usuário e o site... 21 Porque aumentar a banda e o número de servidores não é suficiente?... 23 Resumo do capítulo 03 Como descobrir qual a melhor solução para o seu site 26 Performance... 27 Funcionalidades disponíveis... 28 Atendimento... 29 Preço 04 Conclusão 30 Resumo do conteúdo... Acesse nosso blog
01 Introdução
Esteja você no banco, no trânsito ou até mesmo em momentos de lazer, como na fila do cinema, a verdade é que você odeia esperar. O mesmo comportamento acontece quando navegamos na web. Um estudo realizado pela Forrester aponta que 47% dos visitantes esperam que uma página da web carregue em 2 segundos ou menos, e 40% abandonam o site se o tempo de carregamento demorar mais que 3 segundos. O mesmo estudo aponta que os consumidores associam o tempo de carregamento com a percepção de credibilidade e qualidade da marca: 27% aponta que um site lento deixa-os mais propensos a visitar um concorrente. Tempo de carregamento ideal Demora de 3 segundos Sites lentos 2 segundos ou menos Abandono da página 27% visitam o concorrente Introdução 06
Como o tempo de carregamento pode afetar o seu negócio? Os usuários esperam que os sites carreguem rápido, e isso você já sabe. Mas o que talvez você não saiba é o impacto que um site lento pode ter no seu faturamento. Pesquisas apontam que cada segundo a mais de demora para carregar uma página impacta em 10% a menos em conversões.* Alguns dos maiores sites do mundo analisaram a relação significativa entre tempo de carregamento dos sites e sua receita. Google Cada 500 milisegundos de lentidão equivale a uma redução de 20% na receita de anúncios. Microsoft Bing Amazon Yahoo! Cada 2 segundos de lentidão equivale a uma diminuição de 2,5% nas consultas e nos cliques em geral. Cada 100 milisegundos a mais para carregar uma página (1/10 de segundo) pode significar 1% a menos em receita. Uma melhoria de 400 milisegundos no carregamento configura 9% de aumento de tráfego. Sites são criados para envolver os usuários de alguma forma e convertê-los em usuários ativos. Seja para divulgar uma empresa, distribuir conteúdo, realizar cadastros em formulários de contato, vender online ou qualquer outra forma de conversão, seu site precisa ser rápido se deseja alcançar os objetivos do negócio. Introdução 06
Todos esses números nos apontam para o cenário atual da web. Um cenário onde não podemos mais culpar a internet discada pela lentidão do site. O Brasil possui um índice de 8,6 acessos por 100 habitantes, 67º lugar de penetração da banda larga fixa entre 177 países**. Um cenário onde existe tecnologia disponível para acelerar o carregamento das páginas. E principalmente, um cenário onde o tempo de carregamento de um site não é algo abstrato que apenas profissionais especializados conseguem notar. *Fonte: Edgecast **Fonte: Relatório das Nações Unidas Introdução 07
Como um site mais rápido pode me ajudar a alcançar um melhor posicionamento no Google? Por meio de um algoritmo que envolve uma série de fatores o Google classifica os resultados de busca de acordo com a relevância que a página terá para o usuário. Recentemente o Google anunciou que o tempo de carregamento é um dos fatores avaliados para classificar a relevância dos sites. Nada mais natural tendo em mente que o Google tem como objetivo primordial a satisfação do usuário, e, como já apontado anteriormente, a experiência do usuário está ligada diretamente ao tempo de carregamento das páginas. Introdução 08
O desafio Se o tempo de carregamento dos sites é um ponto crucial no aumento da receita e, como falaremos ao longo desse ebook, existe tecnologia disponível, provavelmente a tendência é que os sites estejam cada vez mais rápidos não é mesmo? Na realidade o que vem acontecendo é o contrário disso. Um estudo realizado pela Radware revelou que 22% dos sites de varejo ficaram mais lentos em 2012, demorando em média 7,25 segundos para carregar, enquanto em 2011 demoravam em média 5,94 segundos. www.siteanos90.com.br www.site2003.com.br www.site2013.com.br T website anos 90 website 2003 website 2013 A verdade é que os usuários são exigentes quando se trata de tempo de carregamento dos sites, mas o nível de exigência não se esgota aí. A expectativa também está em torno do nível de interatividade do site, personalização, imagens em alta qualidade, vídeos em HD. E todos esses recursos aumentam drasticamente o tamanho e a complexidade das páginas da web. Introdução 09
Resumo do capítulo A importância de um rápido carregamento do site: Os usuários tem altas expectativas em relação ao tempo de carregamento dos sites Sites lentos são mal vistos pelos usuários Sites lentos convertem menos Sites lentos são mal vistos pelo Google Recursos como vídeos e imagens em alta qualidade tornam os sites mais pesados e difíceis de serem carregados.
02 Ferramentas disponíveis: o desafio em busca de solução
O que é CDN CDN, ou Content Delivery Network, consiste em uma rede de distribuição de conteúdo, como o próprio nome já diz. Um sistema de servidores distribuídos em pontos estratégicos ao redor do mundo, salvam uma cópia do conteúdo dos sites em cache. Desse modo, toda vez que uma página é carregada a distância que o conteúdo precisa viajar é minimizada, e assim, o tempo de carregamento para o usuário final é otimizado. Vamos citar um exemplo. Suponhamos que um site que não possui CDN receba uma visita de um usuário de Florianópolis e seu servidor esteja localizado em Boston. Desse modo, o conteúdo precisa viajar a distância de Boston a Florianópolis para responder a cada solicitação desse usuário. Se esse site tiver um CDN, os pedidos desse usuário serão encaminhados para o servidor mais próximo e rápido. Desse modo, o servidor iria disponibilizar o conteúdo do seu datacenter de São Paulo, por exemplo. Isso minimiza o tempo de carregamento e os possíveis problemas de conexão. Podemos afirmar que CDN s são verdadeiras vias expressas que pegam um caminho melhor e mais rápido para fugir do trânsito da web.
Por dentro de uma página web A maioria dos sites são constituídos por dois tipos de conteúdo: conteúdos estáticos e dinâmicos. Conteúdo estático é aquele que não é alterado constantemente: imagem, flash, mídia, javascript, CSS,etc. Já o conteúdo dinâmico é alterado constantemente, como feed de notícias, ou também onde há interações dos visitantes, como fóruns e carrinhos de compras de e-commerces. Em geral os sites são constituidos majoritariamente por conteúdo estático, e o CDN torna possível armazenar em cache esses conteúdos que não mudam e são solicitados com frequência pelos usuários. Com isso se evita, por exemplo, que toda vez que algum usuário entrar em um e-commerce todas as imagens dos produtos precisem ser carregadas, o que tornaria o site mais lento e sobrecarregaria os servidores. Ferramentas disponíveis: o desafio em busca de solução 13
É possível diminuir o tempo de carregamento do conteúdo dinâmico? Como o conteúdo dinâmico muda frequentemente ele não pode ser salvo em cache, consequentemente ele não será acelerado pelo CDN, certo? Na realidade o conteúdo dinâmico muda frequentemente, mas sua mudança pode ser previsível. Podemos citar 3 tipos de html, que se caracterizam por diferentes tempos de mudanças das páginas. HTML que consiste em um conteúdo igual para todos os usuários e que se altera com pouca frequência. A página de detalhes de um produto em e-commerces geralmente se altera com pouca frequência e por isso é possível configurar um tempo de cache mais longo. HTML que consiste em um conteúdo igual para todos os usuários e que se altera com muita frequência. Por exemplo, a home de um portal de notícias é igual para todos os usuários mas precisa ser atualizada com frequência, sempre que houver uma nova notícia. Nesse caso é necessário configurar um tempo de cache mais curto, como por exemplo, de 2 minutos. HTML que consiste em um conteúdo específico para cada usuário. Um carrinho de compras em um e-commerce por exemplo é diferente para cada usuário, e por isso, apesar de ser possível, há pouco ganho em salvar esse tipo de conteúdo em cache. Ferramentas disponíveis: o desafio em busca de solução 14
Entendemos portanto, que por mais que um site sofra alterações constantes é possível salvá-lo em cache programando a atualização para 1 em 1 hora ou até de minuto a minuto. Se nesse 1 minuto 100 usuários carregarem o site ele precisará ser carregado apenas uma vez. Na primeira vez que um usuário entrar no site ele será carregado e salvo em cache. Todos os demais usuários irão visualizar aquele conteúdo salvo, eliminando a necessidade de carregamento. Isso torna o site mais rápido para os usuários e economiza o gasto com link no servidor. Além disso, nem todo o conteúdo da página é dinâmico. Provavelmente o logotipo da empresa, o rodapé, o menu e outros elementos não mudam e também podem ser salvos em cache para assegurar um carregamento mais rápido da página. Todos os demais usuários irão visualizar aquele conteúdo salvo, eliminando a necessidade de carregamento. Isso torna o site mais rápido para os usuários e economiza o gasto com link no servidor. Há alguns anos atrás não existiam CDN s que permitiam configurar o tempo de carregamento do cache, o que impedia que o conteúdo dinâmico fosse acelerado. Além disso, não era possível escolher quais elementos da página seriam salvos em cache, o que impossibilitava que os elementos estáticos fossem salvos em páginas que continham conteúdo dinâmico. Nem todas as empresas que comercializam CDN possuem essas ferramentas de personalização, mas são elas que permitem que grande parte do conteúdo dinâmico seja carregado muito mais rápido. Ferramentas disponíveis: o desafio em busca de solução 15
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 Para o desenvolvedor! O modo como os sites são programados pode tornar o carregamento do conteúdo estático mais rápido. Listamos aqui alguns pontos que devem ser considerados pelo desenvolvedor: O ideal é que na troca de imagens ou arquivos estáticos o nome do arquivo também seja alterado, o que não obriga o sistema a expirar o cache da imagem sempre que houver alteração e permite o uso de cache no navegador. A quantidade de arquivos CSS e Javascript afeta o tempo de carregamento da página, por isso o ideal é usar o menor número de arquivos possível. O carregamento de 10 arquivos de 10k é mais lento que o carregamento de 1 arquivo de 100k. Para otimizar o carregamento das páginas é recomendado que o conteúdo estático esteja em um domínio diferente que o conteúdo dinâmico. Desse modo, é possível aplicar uma regra de configuração do CDN para o domínio estático diferente do domínio dinâmico. Por exemplo, o domínio estático terá um tempo de cache de 3 em 3 dias e o domínio dinâmico um tempo de cache mais curto, de 1 em 1 minuto por exemplo. Alguns CDN s conseguem, no entento, resolver isto automaticamente. É possível fazer a programação de modo que áreas da página que se alteram com mais frequência utilizem requisições separadas, via ajax. Desse modo, por exemplo, a página de detalhes de um produto em e-commerces poderia ter as áreas de avaliações e preço carregando via ajax. Assim, todo o conteúdo poderia ser configurado com um tempo de cache de meses (pois quase não se altera), enquanto o preço seria cacheado de 1 em 1 minuto e as avaliações de 3 em 3 horas.
Sua página desenvolvida pelo melhor programador do mundo Já apresentamos acima o CDN, uma solução que torna possível acelerar os sites ao salvar em cache o conteúdo estático e parte do conteúdo dinâmico. Mas ainda existe aquele html que consiste em um conteúdo específico para cada usuário, e esse não consegue ser salvo em cache. Como então otimizar o carregamento desse tipo de conteúdo? Além disso, existe alguma outra forma de acelerar o carregamento do conteúdo estático? No desenvolvimento dos sites vários elementos que passam despercebidos para os programadores podem fazer com que o carregamento das páginas demore mais. Uma aplicação de otimização de páginas, ou Google Page Speed como é mais conhecida, é capaz de interpretar a estrutura das páginas e realizar otimizações inteligentes no conteúdo com base nas melhores práticas de programação do mundo. Essas otimizações aceleram consideravelmente o carregamento tanto do conteúdo estático como do conteúdo dinâmico. A aceleração de páginas consegue tornar mais rápido inclusive o carregamento de conteúdos que não são salvos em cache. Ferramentas disponíveis: o desafio em busca de solução 17
Para e-commerces, sites em que a conversão implica a finalização de uma compra, o uso de tecnologias de aceleração de páginas pode garantir uma excelente experiência do usuário ao tornar o carregamento muito mais rápido. Você não quer que seu cliente abandone o carrinho na boca do caixa devido a uma fila extensa, não é mesmo? Ferramentas disponíveis: o desafio em busca de solução 18
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 Para o desenvolvedor! Listamos aqui algumas otimizações que o Page Speed faz na página, tornando o tempo de carregamento dos sites mais rápido: O Page Speed analisa todas as imagens para garantir que elas estejam realmente com o menor tamanho possível. Caso as imagens possam ser diminuídas sem perda de qualidade, ele corrige os arquivos automaticamente, para não depender de um designer atualizar todas as imagens do site para o tamanho ideal. O Page Speed compacta os arquivos Javascript e CSS, diminuindo o número de arquivos, o que torna o carregamento mais rápido. (Lembre-se: o carregamento de 10 arquivos de 10k é mais lento que o carregamento de 1 arquivo de 100k.) O Page Speed otimiza os arquivos Javascript e CSS ao retirar as funções não utilizadas, o que além de tornar o arquivo menor possibilita que o browser renderize a página mais rápido. O Page Speed reorganiza o html, de modo que o browser consiga desenhar a parte de cima do site mais rápido, seguindo o fluxo de navegação do usuário. Ou seja, desse modo, o topo do site será carregado mais rápido e para o usuário o carregamento será mais rápido. Existem mais algumas dezenas de otimizações. Para mais detalhes, clique aqui.
O caminho entre o usuário e o site Toda vez que um usuário carrega uma página, o conteúdo viaja pela web e precisa atravessar uma série de servidores intermediários. Ao passar por esses servidores o conteúdo pode experimentar problemas que gerariam atrasos no carregamento do site para o usuário final. Como o CDN armazena o conteúdo em cache, ele não precisa passar por todo esse caminho quando o usuário entra no seu site. Assim, além de reduzir consideravelmente a distância que o conteúdo precisa viajar para chegar ao usuário final, o CDN reduz o número de saltos entre servidores, eliminando os gargalos que atrasam a comunicação.
Porque aumentar a banda e o número de servidores não é suficiente? Quando o site apresenta problemas de lentidão, é muito comum que as empresas comprem mais servidores e uma banda mais larga, que consequentemente suportam um maior número de acessos. Com um plano melhor seu site pode até suportar um maior volume de tráfego, mas como volume suportado ainda é fixo e o número de usuários que trafega no site variável, você está apenas adiando o problema. Esta solução não é suficiente, e sequer pode ser vista como a mais econômica. Ao pagar por um servidor robusto ou um link maior, normalmente esta capacidade é superior ao que o site utiliza no dia a dia. Ou seja, é um desperdício de recursos. Ainda assim, quando houverem picos de acesso há grandes chances do site cair por ultrapassar aquilo que foi contratado. O ideal portanto é pagar pelo volume de tráfego e não pelo tamanho do link, e por um serviço que ofereça banda ilimitada, como é o caso do CDN. Ao pagar por um servidor robusto ou um link maior, normalmente esta capacidade é superior ao que o site utiliza no dia a dia. Ou seja, é um desperdício de recursos Ferramentas disponíveis: o desafio em busca de solução 21
O outro ponto que causa lentidão nos sites é a existência de gargalos entre os servidores que o conteúdo percorre para comunicar o usuário ao servidor do site. Ao atravessar uma série de servidores intermediários, o conteúdo pode pode enfrentar problemas na entrega em cada um deles, gerando atraso no carregamento do site. Esse problema facilmente resolvido com o uso de um CDN que salva o conteúdo em cache eliminando a distância que o conteúdo precisa viajar para chegar ao usuário final, persiste quando o site aumenta a largura do link no servidor. Afinal, uma banda mais larga não elimina a necessidade de percorrer esse caminho toda vez que a página for carregada. Ao atravessar uma série de servidores intermediários, o conteúdo pode pode enfrentar problemas na entrega em cada um deles, gerando atraso no carregamento do site. Ferramentas disponíveis: o desafio em busca de solução 22
Resumo do capítulo CDN é uma rede de distribuição de conteúdo que salva cópias dos arquivos do site para garantir que o site carregue através do servidor mais próximo e rápido do usuário. É possível utilizar CDN para acelerar páginas que possuem conteúdo dinâmico. Para isso é necessário configurar o tempo de cache e apontar elementos estáticos da página que podem ser salvos em cache. O Page Speed faz a otimização das páginas com base nas melhores práticas de programação do mundo, garantindo um carregamento ainda mais rápido. O CDN reduz o número de saltos entre servidores, eliminando os gargalos que atrasam a comunicação. Dar um upgrade do servidor não é suficiente para acelerar o site, além de não ser a solução mais econômica.
03 Como descobrir qual a melhor solução para o seu site
Você já está familiarizado com as soluções de aceleração de sites e agora está se perguntando como saber qual a tecnologia ideal, e ainda, qual a melhor opção para o seu caso. Existe uma série de perguntas que precisam ser respondidas antes de contratar qualquer serviço. Seu site possui predominantemente arquivos estáticos? Ou o seu gargalo está no carregamento de conteúdos dinâmicos? Você precisa de suporte 24 horas? Seu suporte precisa falar português? O ideal agora é listar suas necessidades e para ajudá-lo organizamos esse processo dividindo seus requisitos em quatro categorias: performance, recursos, atendimento e custos. Como descobrir qual a melhor solução para o seu site 25
Performance Se o objetivo é tornar seu site mais rápido, você precisa avaliar a velocidade em que o CDN entrega os arquivos para os usuários finais.além disso, a solução de aceleração já apresentada no e-book é fundamental. A otimização dos elementos da página auxilia um carregamento muito mais rápido. Uma forma de avaliar o serviço é realizar alguns testes de desempenho para que você tome a decisão com base na performance do CDN nas condições reais do seu site. No site www.webpagetest.org você consegue executar um teste de velocidade gratuito alterando as variáveis (localização do usuário e browser utilizado) para visualizar as velocidades reais de conexão com os seus usuário Como descobrir qual a melhor solução para o seu site 26
Funcionalidades disponíveis É necessário observar o conteúdo do site para identificar o que o CDN deve ser capaz de fazer. HTTPS: seu site é seguro? E-commerce ou quaisquer outros sites que tenham áreas de usuários precisam de um ambiente seguro, por isso é importante que o CDN consiga salvar em cache as páginas em https. Aceleração de páginas: seu site tem muito conteúdo dinâmico específico para cada usuário? Em qualquer site que possui uma área particular do usuário o page speed, ou aceleração de páginas, é muito importante pois é o único recurso que consegue efetivamente acelerar esse conteúdo. Ferramentas de customização: em sites que possuem muito conteúdo dinâmico é fundamental que o CDN ofereça ferramentas de customização que permitam a definição do tempo de cache e de quais elementos da página deverão ser salvos em cache. Relatórios: relatórios analíticos são sempre importantes para que você saiba o desempenho do site e detecte problemas que precisam ser corrigidos. Qual o tipo de ferramenta analítica o CDN possui? As ferramentas são fácei de usar? Como descobrir qual a melhor solução para o seu site 27
Atendimento Um bom atendimento e suporte é fundamental, principalmente se tratando da área de TI na qual você pode precisar do conhecimento e disposição dos prestadores de serviço. Diagnóstico: se sua empresa não possui uma área de TI com alto conhecimento sobre o assunto é interessante que você procura um fornecedor de CDN que ofereça serviço de diagnóstico para te ajudar a encontrar a melhor solução. Disponibilidade: a maioria dos sites, como e-commerces por exemplo, precisam de um suporte 24/7/365, afinal se o seu site cair no final de semana pode resultar em um grande prejuízo. Se esse é o seu caso é fundamental que seu fornecedor de CDN ofereça atendimento full time. Sinergia: como qualquer serviço contratado é importante que você tenha sinergia com o fornecedor para que haja um bom relacionamento, e que o mesmo seja baseado em confiança de ambas as partes. Como descobrir qual a melhor solução para o seu site 28
Preço As soluções de aceleração de sites (CDN e Page Speed) possuem o melhor custo/benefício quando se trata de tornar o site mais rápido. Clientes que utilizam essas tecnologias observam uma melhora de até 5 vezes na performance do site, o que como já dito anteriormente reflete diretamente no aumento da receita. A utilização do CDN também diminui consideravelmente os gastos com servidores, pois eles suportam a maioria do tráfego dos sites. Assim sendo, torna-se desnecessária a contratação de uma banda larga e você passa a pagar por aquilo que realmente usa. Clientes que utilizam essas tecnologias observam uma melhora de até 5 vezes na performance do site, o que como já dito anteriormente reflete diretamente no aumento da receita. Empresas fornecedoras de CDN cobram por gigabyte, ou seja, a cobrança é feita de acordo com a quantidade de Bytes que o site trafegou. Normalmente, os sites se comprometem com um valor mensal baseando-se na quantidade de gigabyte que costumam utilizar. Em casos de gasto inferior ao comprometido o site paga o que comprometeu, e caso gaste mais paga o excedente. Esse valor combinado permite uma negociação com o fornecedor que diminui o valor por gigabyte. Como descobrir qual a melhor solução para o seu site 29
04 Conclusão
Nesse ebook, passamos pelos principais pontos para que você possa conhecer ferramentas disponíveis para deixar seu site mais rápido e aumentar sua conversão. Passamos pelos principais conceitos para que você possa planejar sua estratégia de aceleração de sites com o máximo de segurança e conhecimento. Agora está em suas mãos. Que tal melhorar tornar seu site mais rápido, melhorar a experiência do usuário e ver de perto as consequências de um site mais ágil? Entre em contato com a Uaizo e conheça nossas soluções, será um prazer acessorá-lo e acompanhar a sua evolução. No nosso blog apresentamos diversos conteúdos sobre aceleração de sites, não deixe de conferir. No nosso blog apresentamos diversos conteúdos sobre aceleração de sites, não deixe de conferir clicando aqui: www.uaizo.com/blog Conclusão 31