SEU TUTORIAL

Tenho certeza de que muitos de vocês que possuem um blog, já presenciaram artigos onde um link dentro deste artigo redirecionava para uma parte específica dentro do mesmo post. Seja para explicar uma determinada parte de um artigo extenso, por exemplo.

Se você ainda não entendeu do que se trata, eis aqui um exemplo básico: Por favor, clique sobre o link abaixo e veja o resultado.

Você foi levado ao final do artigo, certo? Pois bem, isso chama-se Âncora de Links Internos.

Eu costumo usar bastante este recurso em alguns dos meus posts. É ideal para deixar o leitor mais satisfeito e à vontade, quando se trata de um artigo grande ou de uma explicação direta.

<a name="NOME-ANCORA"></a>

=> Este código acima é o código da àrea alvo do artigo, a qual o leitor será levado.

<a href="#NOME-ANCORA">TITULO DO LINK</a>

=> Este código acima cria o link clicável, o qual será clicado pelo leitor para que ele seja encaminhado até a parte específica.

2. Vá até a parte do post onde o visitante terá de clicar para ser guiado até a parte específica. Coloque este código abaixo:

<a href="#">NOME-ANCORA">TITULO DO LINK</a>
Clique aqui para copiar o código

3. No local de "NOME-ANCORA" coloque um nome relacionado ao seu artigo. Por exemplo, no meu vou pôr: seu-tutorial. E no campo "TITULO DO LINK", o título do link que levará o leitor até a parte pré-definida. Por exemplo: clique aqui. No nosso caso, ficaria assim:

<a href="#seu-tutorial">clique aqui</a>

 Até aqui tudo bem? Então vamos lá...

1. Agora simplesmente localize a parte do artigo para onde o leitor será levado, quando ele clicar no link que você criou.

2. Chegando lá, coloque o código abaixo antes do texto alvo:

<a name="NOME-ANCORA"></a>
Clique aqui para copiar o código

3. Na área em azul insira o mesmíssimo nome que você colocou no "NOME-ANCORA" do código anterior (do Passo I). No nosso exemplo o nome preenchido foi 'seu-tutorial'. Portanto, o nosso código ficará assim:

<a name="seu-tutorial"></a>

Veja as demonstrações abaixo

 Juntando ambos os códigos, somaremos um resultado de:

<a href="#seu-tutorial">clique aqui</a>

<a name="seu-tutorial"></a>

Certo?

1. Ainda em Editar HTML, clique em Visualizar e veja se o resultado deu certo. Estando tudo ok, publique seu artigo. 

Lembre-se de não sair do Editar HTML. E se for editar o artigo mais tarde, edite-o em Editar HTML mesmo, e não em Escrever.

Se você não estiver no campo Editar HTML do post, e estiver no campo Escrever, o Blogger vai gerar automaticamente o seu blogID no meio dos códigos. Sendo assim, ele não vai reconhecer nenhum dos códigos quando o conteúdo for publicado. Contudo, o efeito não dará certo e o resultado será insatisfatório!

Por isso o recomendável é terminar o seu artigo, e acrescentar o que tiver de acresentar, ajustar o que tiver que ajustar, e só depois, no final de tudo, inserir os códigos da Âncora de Links.

Qualquer dúvida é só postar nos comentários!

Então clique aqui para voltar e continuar lendo...

Quem tem um site ou blog sabe como é difícil mantê-lo 100% organizado. Requer bastante atenção, paciência e trabalho árduo.

Porém, uma das coisas que mais derrubam um site, principalmente sites de downloads, são os links quebrados. O visitante entra na esperança de encontrar o arquivo, ou acessar um conteúdo interessante, quando de repente se depara com uma página do tipo "Not Found". Especialmente links externos de arquivos upados em hosts como Rapidshare, Mediafire, Megaupload (hoje apenas Mega), Putlocker, 4shared, Imageshack e etc.

No entanto, uma página interna do seu site - imagem, feed, ou qualquer outra área importante - pode estar offline e você nem saber disso. E convenhamos, verificar post por post, link por link é inviável. Ainda mais se o seu site possui inúmeros posts.

O Xenu's Link Sleuth (XLS) é um aplicativo levíssimo e gratuito que pode verificar todos os links, internos e externos, do seu site com apenas alguns cliques. O programa realiza um scan em todo o seu site e lhe informa de todos os links e páginas que estão online ou offline. Mais do que isso, o programa ainda mostra todas as descrições dos links, backlinks e é facílimo de mexer.

Link direto

Link 2

3. No primeiro campo em branco, insira a URL completa do seu site ou blog. Mantenha a opção Check external links marcada e clique em OK.

4. Após isso, o programa vai checar todos os links presentes em seu site. Isso pode demorar, dependendo do tanto de links localizados em seu site e fora dele, e do número de posts. Aproveite para ir tomar um cafezinho! :)

Para saber a quantas anda o scan, basta olhar na barra de status (parte inferior da janela do programa) e ver a porcentagem já realizada. Tem que chegar no 100% para acabar.

5. No decorrer do scan, o aplicativo vai informando o estado dos links. Os links que estiverem verdes, com um "ok" ao lado dos endereços, estão online (funcionando normalmente). Os que estiverem vermelhos, com um "timeout" ao lado, provavelmente estão quebrados (offline, não funcionam). No entanto, às vezes o programa erra, colocando um timeout em URLs que estão online. Por isso é bom dar uma conferida.

6. É preciso que você compreenda que o programa não informa apenas os links de downloads. Mas também links de imagens hospedadas em seu site, páginas internas de artigos, páginas externas, e posts editados (geralmente não são um problema, pois o programa intepreta como offline).

Você não precisa acessar todos os links. O que importa são apenas os links que estão vermelho, os quais estão quebrados ou possuem erros.

7. Para acessar a página que está offline ou que possui o link quebrado, basta clicar com o direito do mouse sobre a URL dela e selecionar a opção Open in Browser ou URL properties (ambas explicadas abaixo).

=> A opção Open in Browser abre a página completa em seu navegador padrão. 

=> A opção URL properties abre uma pop-up informando em qual página do seu site ou blog o link quebrado está.

Exemplo:

8. Depois que o scan finaliza, o programa exibe uma pop-up perguntando se você deseja ver o relatório do scan. Na minha opinião, não há necessidade disso pois pela própria tela de scan dá para visualizar os links problemáticos tranquilamente. Mas caso queira acessar o relatório, clique em Sim e aguarde ele ser gerado.

Uma das tarefas mais difíceis para quem está começando um blog ou site é indexá-lo em motores de busca como Google. Claro, o primeiro passo é cadastrar seu blog no serviço de indexação que estes motores oferecem. Porém, o grande problema é que pode levar um bom tempo até que seu site apareça nas pesquisas do grandioso Google. Mas você pode dar um "empurrãozinho" para que o processo acelere.

Este é o objetivo do Website Indexer. Com este aplicativo você pode enviar o seu site para mais de 100 diretórios e motores de busca respeitados da Internet e indexá-lo muito mais rápido, tudo automaticamente e com apenas alguns cliques. Bastando digitar o URL do seu blog/site e uma keyword (palavra-chave), o processo todo é feito ligeiramente pelo Website Indexer!

Além disso, o Website Indexer pode fazer com que seu site ganhe posições privilegiadas nas buscas do Google e outros motores.

Segundo relatos de utilizadores, teve usuários que conseguiram indexar seus sites novos em 5 minutos. Enfim, a ferramenta realmente cumpre o que promete.

2. Depois da instalação, a tela abaixo aparecerá. Ela aparece apenas na primeira vez que o programa é executado.

3. Coloque seu nome e e-mail e clique em Register. Aguarde alguns segundos e poderá surgir um erro (que é aleatório) após isso, mas ignore!

4. Caminhe até o seu e-mail e acesse o e-mail enviado pelo suporte do Website Indexer. Ele pode estar na pasta de lixo eletrônico ou de spam do seu e-mail.

5. O e-mail contém um link de ativação. Clique neste link e você receberá um código de ativação (activation code). Copie ele.

6. Retorne à interface do Website Indexer e cole este código no campo "Enter your activation code below".

7. Na outra tela insira o URL completo de seu site ou blog e coloque uma keyword que especifique melhor o seu site. Mas insira apenas uma keyword mesmo. Por isso, escolha bem ela. Vide imagem de exemplo abaixo.

10. Agora, como diz na mensagem, aguarde de 1 a 5 horas para ver seu blog/site indexado. Se tiver sorte, em minutos ele será indexado.

No entanto, vejam bem: a ferramenta não garante 100% a indexação. De 100% dos utilizadores do aplicativo, 90% tiveram sucesso na rápida indexação.

É muito importante saber como o nosso site ou blog é visualizado a partir de resoluções de tela diferentes. Deixar o template adaptado a todos os tipos de resolução é essencial para que nossos visitantes e leitores tenham uma melhor visão de nosso blog. Afinal, a aparência do site e a facilidade de navegar no mesmo são fatores cruciais.

Por exemplo, se o seu monitor utiliza uma resolução 1024x728 (que é o padrão), você não saberá como o seu site está sendo visto a partir de uma resolução 800x600, 1280x800, 1600x1200 (típicos de LCD), e etc, pois acredite, você pode espantar-se ao ver o seu site através de outras resoluções. Sobretudo, as resoluções de smartphones, iPhones e outros celulares também são bem diferentes.

O site Infobyip.com oferece um serviço chamado Screen Resolution Simulator. Trata-se de um teste com a finalidade de simular o seu site ou blog a partir de vários tipos de resoluções de tela diferentes. Isto é, ele mostra como o seu blog fica com a resolução de tela escolhida por você.

2. Na barra de busca, cole o URL completo do seu blog ou site e posteriormente defina o tipo de resolução que deseja visualizá-lo. Depois clique no botão Load.

Agora é só navegar em seu blog normalmente através do simulador e averiguar se não há nada de errado com seu template na resolução definida.

Recomendo que realize um teste com todas as resoluções. Caso tenha cadastrado seu blog no Google Analytics, você ainda pode verificar quais são as resoluções mais comuns dos visitantes e leitores.

Esta é uma dica para quem tem um blog ou site em qualquer plataforma (seja Blogger, Wordpress, ou host pago).

Quando inserimos uma imagem grande no blog, temos de ajeitá-la corretamente para ficar proporcional ao post, sidebar e etc. Mas e se você deixasse as imagens grandes de maneira mais personalizadas e dar um efeito a elas, tornando a visualização mais prática ao leitor? Seria interessante, não? Isso é possível com o aplicativo online BigImg.it.

Trata-se de um applet que pode ser usado para deixar as imagens em maior destaque em seu blog. Tudo isso é feito através de um iFrame, que por sua vez virá com a imagem nas dimensões estipuladas por você, e com plena capacidade de zoom e visão panorâmica.

Ou seja, você terá a possibilidade de pegar uma imagem grande e colocá-la em uma janela proporcional ao post para que seus leitores possam dar um zoom in e out a vontade, e visualizar a parte da imagem que eles preferirem. Tudo isso com a intenção de aproveitar ao máximo suas imagens e não ter de esperar uma eternidade para a imagem carregar.

Para conferir o resultado, acesse este link para visualizar uma demonstração do efeito que o aplicativo gera nas imagens.

Para navegar na imagem, dê um clique sobre a imagem e vá navegando por ela. Utilize o botão scroll do mouse (aquela rodinha) para dar zoom in e out.

1. Primeiramente, hospede a sua imagem em um servidor de sua preferência e copie o URL da mesma. Recomendo o TinyPic. Dê preferência para imagens grandes.

2. Depois caminhe até o site BigImg.it e cole o URL na caixa Make Your Own. Clique em Next logo em seguida.

3. Na próxima tela, estipule as dimensões (largura e altura) da sua imagem. Selecione a opção Custom para configurar dimensões personalizadas. Depois clique em Next.

4. A seguir selecione a posição da imagem na janela. Pessoalmente recomendo que você coloque a opção Center ou Bottom. Mas fica a seu critério. Clique em Next novamente para prosseguir.

► Se for colocar a imagem na sidebar, vá em Design → Elementos de página → Adicionar um Gadget → Selecione o item HTML/JavaScript e cole o código lá.