Teste o tempo de carregamento do seu blog



Um dos fatores que o Google tem usado para uma boa indexação de sites e blogs, é o tempo de carregamento de páginas. Sites muito lentos podem acabar perdendo posicionamentos e dificultando o acesso do leitor. Afinal, a internet no Brasil não é uma das melhores e está longe de ter indícios razoáveis de que esse quadro possa se alterar em breve. Assim, quanto mais leve for a sua página, mais atrativa ela será para o seu leitor. Por isso, é muito importante conhecer o tempo de carregamento do seu blog. 

Monitore o desempenho do seu site e otimize os tempos de carregamento. A meta do Google é fornecer aos usuários resultados mais relevantes e uma ótima experiência. Sites mais rápidos aumentam a satisfação do usuário e melhoram a qualidade geral da web (especialmente para os usuários com conexões lentas com a internet), e esperamos que, à medida que os webmasters aprimoram os seus sites, a velocidade geral da web melhore.Fonte: Diretrizes para webmasters
A performance também influencia na taxa de rejeição, já que a maioria dos internautas são apressados, querendo informação fácil e rápida - Mais impacientes, internautas querem sites num piscar de olhos. E se você não quer perder visitas, faça o teste e descubra como anda o seu blog. 
Para testar a velocidade de carregamento, recomendo o site Pingdom. Ao entrar na página, digite o endereço do seu blog : http://tools.pingdom.com/fpt/

O Pingdom irá fornecer as seguintes informações: em Perf.Grade temos uma espécie de rank da performance; em load time aparecerá o tempo de carregamento da página inicial; em page size vemos o tamanho dela em MB. E, logo abaixo, temos um diagnóstico que compara com os demais sites testados nesta ferramenta. No caso do Dicas Blogger apareceu a seguinte frase: "your website is faster than 79% of all tested websites" - o que quer dizer que ele é mais rápido do que 79% dos sites testados. 
Dica: quando aparecer a palavra slower é porque seu blog está lento e quando aparecer faster é porque ele está com uma boa performance. 
Para os mais curiosos, abaixo existem quatro abas que trazem informações bem detalhadas sobre o carregamento do seu blog. São elas: 
Waterfall: são os requerimentos feitos para fazer o carregamento da sua página. Ele lista tudo o que é carregado. Além disso, para analisar melhor, a classificação pode ser feita por ordem de carregamento, tamanho ou tipo de arquivo, por URL e por tempo de carregamento. 
Performance grade: demonstra se a página do seu blog está em conformidade com as práticas de desempenho do Google Page Speed. Ele também indica algumas recomendações, caso você deseje acelerar o seu blog. Ao que tudo indica, é ele que definirá o ranking que ficará a performance do seu blog; 
Page analysis: analisa o tempo gasto por fases, tipo de conteúdo e por domínio. Indicando o tamanho e a quantidade de pedidos feitos para o carregamento da página sobre cada tipo de arquivo e domínio. 
History: que salva os teste realizados e permite o acesso futuro para comparar como está o desempenho do carregamento do seu blog. 
Enfim, é muito importante conhecer o tempo de carregamento do seu blog. Para quem pretende mudar o template, este tipo de informação se torna imprescindível. Quanto mais carregado e lento ficar o seu blog, pior e mais difícil será otimizá-lo. Nos tempos atuais, quanto mais rápido carregar melhor será. E para aqueles que possuem um volume expressivo de visitas do Google, saiba que ele está de olho nisso! 
E ai, como anda o tempo de carregamento do seu blog?

Tutorial Basico De HTML

Assim, mesmo usando bons editores, precisamos conhecer alguns códigos HTML para sabermos como modificar os textos e realizar outras funções em nosso Blog. Vejamos alguns desse e os mais comuns


Destaque das palavras:
<textarea
rows="5"
cols="50"
style="background-color: #ffffff; color: rgb(0, 0, 0);"
wrap="soft">

  1. <strong>Negrito</strong>
  2. <em>Itálico</em>
  3. <u>Sublinhado</u>
  4. <strike>Tachado</strike>
</textarea>

Posição do texto:
<textarea
rows="5"
cols="50"
style="background-color: #ffffff; color: rgb(0, 0, 0);"
wrap="soft">
<p align="left">Alinhado à esquerda</p>

<p align="right">Alinhado à direita</p>
<p align="center">Centralizado</p>
<p align="justify">Justificado (alinhado às duas margens)</p></textarea>


Criar links:
<textarea
rows="5"
cols="50"
style="background-color: #ffffff; color: rgb(0, 0, 0);"
wrap="soft">
<a href=”URL de Destino”>Texto do link</a></textarea>

Inserir imagens:
<textarea
rows="5"
cols="50"
style="background-color: #ffffff; color: rgb(0, 0, 0);"
wrap="soft">
<img src=”URL da Imagem” /></textarea>


Se Você Ja Aprendeu o Basico Va Para a Nossa Proxima Etapa,Mexendo Com Templete

Fazer Backup ou Colocar Template no Blogger (Novo Painel)

Depois das alterações do painel do blog feitas esse ano muitas coisas ficam com pouco destaque em minha opinião por isso vamos mostrar onde achar algumas coisas úteis no painel atualizado do blogger começando pelo link para fazer backup do blog, ou seja, como salvar uma copia do seu template antes de fazer alterações nele.

Isso é muito simples de fazer você só precisa entrar na pagina modelo e clicar no link no canto da pagina fazer backup / restaurar e abre uma janela para você salvar uma copia do código do seu template atual clicando no botão fazer download do modelo completo, isto abrirá uma janela de download e você só precisa salvar o arquivo.




Agora você já pode editar seu HTML sem preocupações porque se algo der errado você só precisa voltar nesta pagina e clicar no botão selecionar arquivo e enviar novamente o arquivo que acabou de baixar e seu template voltará ao que era antes.

Esse mesmo procedimento serve para instalar templates no blogger que tenha achado em algum site na internet com templates prontos para o blogger. Mas neste caso recomendamos também salvar uma cópia do seu modelo antes de instalar o novo pelo mesmo motivo se der algo errado poderá voltar ao seu modelo atual facilmente.

Favicon: como criar e hospedar imagens .ico e utilizar


Ao customizar o template do Diário de Bordo me deparei com um problema. O favicon não aparecia em todos os navegadores, somente no Firefox. Eu nunca me preocupei muito com isso pois o Dicas Blogger é hospedado no blogspot e um íconezinho do Blogger não ia fazer diferença. Sem contar que eu achava que todo mundo deveria usar o Firefox. Já com o novo blog, considerei a idéia de fazer diferente, visto que ele tem domínio próprio e ficaria mais elegante com um favicon próprio. Fui ao super blog Compulsivo, peguei o código e…descobri que eu não sabia criar uma imagem no formato .ico – necessário para que o favicon funcionasse nos outros browsers. Pedi um help ao Compulsivo e ao mesmo tempo fui pesquisar no São Google. E aí está a solução que eu encontrei.
Para quem não sabe, favicon, conforme publicado anteriormente, é aquele pequeno ícone que aparece na barra de navegação, do lado esquerdo da url de uma página web.
Nos posts anteriores, ensinei como criá-lo em formato .png. Agora, para que ele seja visualizado em outros navegadores, é preciso transformar a imagem .png em .ico. Uma forma simplificada de se fazer isso é acessando este site:http://www.favicon.ru/en
Devemos clicar em arquivo e procurar a imagem já salva no computador. Depois, iremos clicar em create favicon.ico. Feito isso, aparecerá uma nova janela para o download.
Legal! Mas, neste ponto, apareceu um novo problema: nem Picasa, nem ImageShack, nem Photobucket hospedam imagens no formato .ico. Nova pesquisa no Google e encontrei diversos sites com esta função. Escolhi o Image Boo Hosting.
Para hospedar a imagem, devemos clicar em arquivo, procurar a imagem com formato .ico recém-criada, fazer o upload dela e copiar a url, conforme nos mostra a imagem abaixo:
Agora, vamos adaptar o código e inserir no html do nosso template. Este código é de autoria do Compulsivo, com todos os direitos reservados.
<link href='URL_DA_IMAGEM_FORMATO_ICO.ico' rel='shortcut icon'/>
<link href='URL_DA_IMAGEM_FORMATO_PNG.png' rel='shortcut icon'/>
Na primeira linha colamos a url da imagem .ico e na segunda, a url da mesma imagem em .png. Agora, é só entrar no html, procurar (Crtl+F) por ]]></b:skin> e colar o código logo abaixo, devendo ficar assim:
Vamos visualizar o template e, se tudo estiver bem, salvar. Para criar a imagem em .png, podemos usar o Paint ou o Photshop e hospedar no Picasa. Não tem erro!
Para que funcione também no Google Chrome, visualize um novo código aqui.

Multiplique as Visitas em seu Blog

Muitos Blogueiros procuram vários meios de aumentar as visitas em seus blog,
sites ou fórum até acabam pagando para ganhar mais visitas que n é nada
mau também, mas eu tenho outro jeito melhor que venho usando a algum tempo
nos meus blog e tem dado muito certo e recomendo.

Entre nesse site: minilua.com ele funciona assim  a cada 1visita que você envia a ele ele te envia 3, após abrir o link vai dar de cara com isso:


Coloque os dados que pede não esqueça de fazer o banner no tamanho que pede 336x70 ou 468x60 após isso você deve esperar eles avaliar seu blog para passar na avaliação você deve adicionar qualquer banners ou widgets do minilua.com (Link dos widgets aqui! // Link dos Banners Aqui!!!)

Lembrando o blog não passara na avaliação se o banner do minilua não estiver no seu blog, para saber se ele foi aprovado só abaixar a pagina e procurar o seu blog que deve nuns dos últimos.

Um meio facil de enviar Visitas é você adicionar o banner claro e um pop-under que editei.Quando alguem entrar em seu blog o pop-under vai abrir o site do minilua junto com o seu em uma nova aba, o pop-under só abre 1 vez por dia em cada PC (IP) vou dechar o código dele logo abaixo:

<script type="text/javascript">
window.onunload=document.onclick=function (){if(document.cookie.indexOf("mnp=")==-1){d=new Date();d.setDate(d.getDate()+1);document.cookie="mnp=yes; expires="+d.toGMTString();(window.open("http://static.minilua.com/live/banners/pop.html","mnp","resizable=no,scrollbars=yes,height="+screen.availHeight+",width="+screen.availWidth+",status=yes,top=0,left=0")).blur();window.focus()}}
</script>



Mostrar Link Curto das Postagens - Encurtador de Links no Blog


Sempre é importante criar novas formas de divulgar seu blog e atrair mais visitantes para suas paginas. Você pode mostrar o link encurtado no final de suas postagens o que pode facilitar as pessoas copiarem o link e postarem no Twitter ou alguma outra rede social. Concordamos que na divulgação do blog em redes sociais existem muitos tipos de botões de compartilhamento que já fazem o envio automático, mas sempre é bom dar mais uma opção principalmente porque ocupa pouco espaço na pagina do blog e serve como mais um incentivo a divulgação.


Entre na pagina editar HTML, nós sugerimos fazer um backup do template antes de alterar o HTML do blogger. Marque para expandir o modelo de widgets e procure por <data:post.body/> e coloque esse código logo depois.


<b:if cond='data:blog.pageType == &quot;item&quot;'><form onsubmit='return false;'>Link Curto
<input id='shorturl' onmouseover='javascript:this.select();void(0);' readonly='readonly' size='20' type='text'>
<script language='javascript' type='text/javascript'> 
//<![CDATA[ 
function encurtaURL(json){ 
document.getElementById("shorturl").value = json.short_url; 

document.body.onload = function(){ 
if(document.getElementById("shorturl").value==''){ 
var el = document.createElement("script"); 
el.language='javascript'; 
el.src = 'http://bitw.in/api/link/create.json?url='+encodeURIComponent(window.location.href)+'&callback=encurtaURL&apikey=74231e775e05ca3fe3387eaf0c1c7be61da2bd23'; 
document.body.appendChild(el); 


if(document.body.addEventListener){ 
document.body.addEventListener("load",document.body.onload,true); 

//]]>
</script></input></form></b:if>


Outro posicionamento interessante pode ser mostrar o link no inicio da postagem e para fazer isso só precisa colocar o código que mostramos antes de <data:post.body/> ao invés de depois dele.

Além disso se quiser você pode colocar o código depois de <div class='post-footer-line post-footer-line-3'/>, isso faz o link aparecer mais para baixo depois do nome do autor da postagem, marcadores e link de comentários do blog. O html div class='post-footer-line post-footer-line-3 varia um pouco em cada template, mas o importante é achar post-footer-line-3 e também esse numero pode ser 1 ou 2, se colocar nesses outros trechos o link encurtado do seu post parecerá numa linha entre os marcadores ou nome do autor do blog dependendo de como está o seu layout de postagem.

Caixa de Texto


Com esta caixinha de texto, é possível também publicar códigos ou mesmo dar um destaque em um post.


<textarea
rows="5"
cols="50"
style="background-color: #ffffff; color: rgb(0, 0, 0);"
wrap="soft">ESCREVA AQUI O SEU TEXTO</
textarea>


Prontinho:

Sobre os atuais problemas do Blogger

Entre maio e  junho deste ano, o Blogger apresentou diversos bugs e instabilidades. Hoje, ao visitar o fórum de ajuda e ao moderar os comentários deste blog, percebi que o gadget seguidores voltou a desaparecer de vários blogs e que muitos usuários estão ansiosos. Então, o motivo deste post é para dizer: don’t panic!
Não há motivo para pânico. Lembrem-se que o Blogger está passando por uma reformulação em seu código e que todos esses problemas são naturais. Reitero o que já disse anteriormente: todos os bugs sempre foram corrigidos. Sempre!
Ao mesmo tempo que estamos passando por problemas, diversos novos recursos estão sendo implantados, em um serviço que é 100% gratuito. É preciso que vocês tenham paciência. E pra quem não tem, basta contratar um host e migrar para outra plataforma de blogagem. Simples assim.
Usem sempre o fórum de ajuda para reportar dificuldades com seu blog:
Nós continuaremos informando-os sobre todas as novidades, bem como sobre todas as instabilidades deste período.
Recomendo a leitura dos seguintes posts:
we-love-blogger-logo
Postagens mais antigas Página inicial