Estou certo que sim. Se você trabalha em qualquer área relacionada à web, seja na parte de desenvolvimento ou mesmo escrevendo um blog, já deve ter se perguntado como diabos são gerados aqueles links que aparecem logo abaixo do site, em uma busca pelo nome do mesmo.

Pois bem: é sobre estes links que aparecem nas buscas por determinados sites que eu vou falar.

Com vocês, os sitelinks.

// O que são sitelinks?

Estes são os sitelinks. Muito prazer.

Sitelinks nada mais são que aqueles links que aparecem logo abaixo de um site com destaque no Google, de páginas específicas e relevantes para o maior sistema de busca da atualidade.

Por exemplo: faça uma busca por Globo no Google. Você verá que, logo abaixo do endereço Globo.com, aparecerão alguns links para páginas do domínio que foram consideradas relevantes pelo gigante da busca.

Os sitelinks são gerados automaticamente pelo Google, portanto, não existe nenhuma forma (pelo menos, até o momento) que permita que você coloque-os manualmente. Na verdade, não se sabe ao certo por que o Google gera os sitelinks para um determinado site enquanto para outros não; o que se sabe é que existem alguns fatores que aumentam as chances – eu disse aumentam as chances, e não garantem -  de que os sitelinks sejam gerados para o seu site. É sobre estes fatores que vou falar no post de hoje, baseado em experiências próprias na área de SEO e leitura de alguns artigos pela web.

Os sitelinks são mostrados na busca pelo nome do site em questão: Globo para Globo.com, Hilder ou Hilder Santos para o Hildersantos.com, e por aí vai. Portanto, começar com um nome interessante e original para o seu site/blog é fundamental.

// Como o Google gera os sitelinks

Como havia falado alguns parágrafos antes, não se pode determinar com precisão o que leva um site a ganhar sitelinks. Algumas pessoas insistem em falar sobre o tempo que o domínio está ativo; eu discordo, pois já vi blogs com menos de 6 meses de vida ganharem sitelinks, enquanto outros, com 2 anos ou mais, sequer são bem indexados.

Segundo o próprio Google em suas ferramentas para webmasters:

Se a estrutura do seu site não permitir que nossos algoritmos localizem bons links de sites, ou se você achar que os links de sites não são pertinentes à consulta do usuário, nós não os exibiremos.

Ou seja: websemântica.  Dar a César o que é de César, colocando corretamente títulos em seus devidos h1′s e afins, listas em ul’s e NUNCA esquecer do título da página na barra do navegador condizente com o conteúdo!

Esse papo todo de webstandards não é a tôa. Quando você codifica uma página e a valida como um xHTML Transitional, você pode dormir tranquilo em seu travesseiro, sabendo que fez o dever de casa e está oferecendo uma página com interoperabilidade, que será bem compreendida tanto pelo navegador do usuário quanto pelo robô de busca (neste caso, o nosso artista principal). Portanto, mesmo que leve tempo, procure validar o seu código. Você só tem a ganhar com isso.

// Outros fatores que contribuem para os sitelinks

Um dos fatores que também contribui (embora não seja tão relevante assim para a geração de sitelinks) é o PR do site.

Um site com PR igual ou maior que 4 já tem grandes chances de conseguir sitelinks. Portanto, ser bem referenciado, ou seja, desenvolver conteúdo interessante (pode soar clichê, mas é a mais pura verdade) ainda continua sendo uma regra prima. Com bons links, seu PR sobe, assim como as suas chances de obter sitelinks.

O PR, embora interessante, não é tão importante assim. Por exemplo: o Hildersantos.com está com PR 2 (nada data em que estou escrevendo este artigo), mas acabei de descobrir, via Central Google para Webmasters, que foram habilitados sitelinks para o site. Eles ainda não estão sendo mostrados, pelo menos na busca que acabei de fazer, mas já devem estar ativos dentro de alguns dias.

Ah, por falar nisso, é por lá pela Central Google para Webmasters que você descobre se ganhou sitelinks ou não para o seu site. Com o seu site habilitado por lá, navegue até Links/Links do Site e descubra se há alguma surpresa por lá.

Outra coisa: no título da página-inicial (aquele que aparece na barra do navegador), faça um resumo do contexto do seu site/blog. Diga, em poucas palavras, sobre o que o seu site fala, e não se esqueça de gerar um menu que condiga com o contexto. Lembre-se: menus, preferencialmente separados em lista (ul). Desta forma, como é uma lista fixa, o bot do Google saberá que se trata de uma lista de páginas, e dará a importância necessária na hora de gerar os seus sitelinks.

Outra coisa (nunca é demais lembrar): dê a César o que é de César! Procure colocar títulos principais (de artigos, notícias, posts etc.) dentro da tag h1, mas procure não repetí-la muito numa mesma página; caso contrário, ela perde o seu efeito de destaque. Código é poesia (você já viu isso em algum lugar, hein? ), portanto, deixe-o limpo e hierárquico: h1, h2, h3 e por aí vai. Os números não se referem à ordem, mas sim à importância. Se tudo é importante, que importância terá cada um?

Evite código desnecessário. Não confunda o robô do Google. Quanto mais limpo, semântico e organizado for o código do seu site/blog, mais chances ele terá de “gostar” do que está lendo e dar uma relevância maior ao seu conteúdo – e à sua organização para gerar os sitelinks.

O robô não enxerga design: ele enxerga organização de palavras e tags. Se ele puder percorrer o seu código sem obstáculos, ótimo. Quem sai ganhando nessa história é você.

Se os sitelinks não aparecerem durante algum tempo, não se desespere. Continue otimizando, escrevendo, atualizando o seu site/blog. Estou certo que, mais dia, menos dia, o seu esforço será bem reconhecido.

Só não esqueça de passar aqui para agradecer!

Isso já aconteceu comigo em um de meus blogs e pode acontecer com você também: o perigo pode passar despercebido, e quando você menos espera, o seu posicionamento nos mecanismos de busca cai para a página 100+, você tenta desesperadamente uma solução mas o Google só resolve te “tirar” da punição uns 2 meses depois… e após o seu blog estar totalmente otimizado.

Vamos aos fatos: se você utiliza uma página de categorias, tags e arquivo (ou seja, uma listagem para cada destas páginas), logicamente, o seus posts estão sendo duplicados nelas.

Suponhamos que você escreveu o artigo A, colocou as tags a, b e c e categorizou como x, y e z. Se cada tag e categoria conter um link para uma página diferente (ou seja, quando você clica na tag a, são mostrados todos os posts daquela tag), o Google vai reconhecer a página de tags como uma página diferente – de fato, é, pois até o título da página (aquele que aparece na barra do seu navegador) será, por exemplo, “Post da tag a“. O seu artigo A vai estar nesta página, portanto, vai ser considerado como conteúdo duplicado.

Você já parou para imaginar que o seu conteúdo será duplicado pelo menos 6 vezes, só colocando estas tags e categorias? Ah, sem falar na página de arquivos (aquela página que mostra as listagens por período), que também mostrará o seu artigo.

Este tipo de listagem é praticamente padrão em vários temas utilizados mundo afora. Quando o robô do Google começa a indexar o seu site, vai seguindo todos os links que encontra, excetos os que contenham a tag nofollow (para quem não sabe, esta tag impede que o robô do Google “siga” o link, por exemplo: <a href=”http://algumlugar” rel=”nofollow”>link</a>). Portanto, uma maneira de evitar que o Google indexe a sua página de categorias, tags e arquivo seria colocando a tag nofollow nos links que apontem para estas páginas, correto?

Errado. Além de ser bastante difícil colocar a tag nofollow nestes links (que são gerados dinamicamente pelo WordPress), você esbarraria em outro problema: se houver algum link externo para uma destas páginas – e ele não tenha a tag nofollow - sua página seria indexada da mesma forma, o que faria com que o seu trabalho descesse água abaixo.

Então, tem alguma solução? Existe alguma forma de evitar que estas páginas sejam indexadas pelo Google e você possa dormir tranquilo em seu travesseiro, sabendo que está fazendo o seu dever de casa corretamente?

Sim, existe. Com um código bem simples e criatividade, você evita que o Google indexe estas páginas e acabe confundindo o seu conteúdo com spam. Coloque o código abaixo entre as tags <head> e </head> do arquivo header.php do seu tema (provavelmente), ou substitua pela sua meta tag “robots”, caso ela exista:

<?php if(is_home() || is_single() || is_page()) {
echo ‘<meta name=”robots” content=”follow, all” />’;
} else {
echo ‘<meta name=”robots” content=”noindex, nofollow” /> <!– Previne que o Google indexe a página de arquivos e confunda com spam de palavras –>’;
} ?>

O que este código faz? Simples. Pega tudo que não for um artigo, a home do seu blog/site ou uma página estática e coloca a tag <meta name=”robots” content=”noindex, nofollow” />, prevenindo que o robô do Google indexe as páginas que listem os seus posts.

E de que forma isso impactaria nas suas visitas?

Fala sério, pra quê você precisa que estas páginas sejam indexadas? Você espera que os visitantes cheguem através dos posts, e não destas páginas, não é mesmo? Em termos de navegabilidade, não haverá nenhuma diferença para o usuário: se ele estiver navegando em teu site e resolver ver os artigos da categoria tal, simplesmente ele clicará naquela categoria e continuará seguindo.

Já em termos de SEO, a melhora é explícita: você previne conteúdo duplicado em seu blog/site, e fica tranquilo quando a isso.

Uma coisa eu posso garantir: é muito melhor você perder alguns poucos visitantes do que 2 ou 3 meses de desespero… sem visitante nenhum.

Quem avisa, amigo é. Faça bom proveito do código!

A foto é um tanto antiga, cheia daquelas “manchas do tempo” e está no formato “sépia”, ou seja, aquelas fotos mais amarronzadas que preto-e-branco.

Clique para ampliar

Cores desbotadas, sem um padrão de cores a seguir, vários arranhões… Bem capaz de se perder com alguns anos a mais. Sendo assim, resolvi dar um presente para minha mãe (e minha família): uma nova foto, totalmente restaurada, e mais atual. Um desafio (e eu adoro desafios).

O primeira passo para restaurar a foto foi remover todos os arranhões, manchas e desequilíbrio de cores da foto original. Depois, dividir cada seção da imagem (olhos, boca, cabelos, vestido, etc.) em camadas, ou seja, em “Layers”, para fazer os ajustes necessários de cor e nível.

Por último, reavivar os traços e expressões do rosto, para não parecer uma foto muito artificial.

De fato, a foto original parece um desenho, e a restaurada não ficou atrás. Precisei da ajuda da minha mãe para ir me dizendo as cores do vestido e os detalhes do mesmo, cores dos olhos, pele, colar, etc., sabendo inclusive que ela usava pouco batom, somente para realçar um pouco os lábios.

Com todas as informações em mãos, parti para a ação, e cá está o resultado final, clique para ampliar:

Levei algumas horas, mas valeu a pena. Ao menos, minha mãe terá agora uma imagem que durará praticamente ad infinitum. Felizmente, a tecnologia torna real o sonho de preservar algo que consideramos importante para nossas memórias.

E, mais que nunca, o poder do renovação está em nossas mãos. Mesmo que seja renovando uma memória já anciente.

Por causa delas, correm muitos processos jurídicos de gente famosa que teve suas fotos postas “à prova”, como foi o caso do boxeador Oscar de La Hoya, vestido de mulher. Segundo ele, tudo não passa de uma montagem, e os “responsáveis” pela difamação serão punidos. Veja aqui a foto, clique para ampliar:

Se a foto é ou não “real”, isso eu não sei. O que sei é que você vai aprender aqui como ficar com a “cara” do Brad Pitt, ou quem mais você queira. Para este tutorial, estou utilizando o Photoshop CS 3. Vamos lá:

1) A primeira coisa a se fazer (além de abrir o Photoshop, claro ) é ter as duas imagens em mãos. Dê preferência a imagens que estejam na mesma perspectiva, e no mesmo ângulo de perfil, se for o caso. Pare e pense: minha foto se “encaixa” na outra? Em caso positivo, a montagem fica bem mais fácil de ser produzida.

Eu vou utilizar estas duas imagens:

Brad e Angelina. Lembrando que esta foto está sendo utilizada para fins meramente ilustrativos.

Uma foto minha do David Hank.

2) Com as duas fotos abertas no Photoshop (e a sua ativa, ou seja, selecionada), você provavelmente verá, no canto inferior direito da tela, uma janela chamada “Layers”, ou seja, camadas. O Photoshop trabalha com camadas de sobreposição nas suas imagens. Imagine que as camadas são como papéis transparentes sobrepostos, cada um contendo uma parte do desenho. É como se, num desenho animado, uma camada ficasse para o fundo, outra para um personagem, outra para o cenário, etc.

3) Clique a arraste a camada “Background”, como mostrada acima, para a outra foto a ser montada, neste caso, a do Brad.

03) Agora que a sua foto já está sobreposta na foto a ser montada, você precisará torná-la um pouco transparente, para fazer os ajustes necessários. Antes disso, percebeu como as fotos estão em perfil diferente (o Brad olhando para a direita e eu o David Hank olhando para a esquerda)? Para deixar os dois olhando para a mesma direção, tenha certeza que a “Layer 1″ esteja selecionada na tela das camadas (Layers), e vá em Edit – Transform – Flip Horizontal, na barra principal do programa (a primeira, logo acima). Este comando faz que sua foto seja invertida horizontalmente, mudando a posição do rosto. Pense que você está virando a sua foto no eixo horizontal; caso fosse vertical, o resultado seria uma foto de ponta-cabeça.

04) Agora que os dois olham para a mesma direção, você precisa ajustar a sua foto para que fique corretamente sobreposta no rosto do Brad. Ajuste a opacidade da camada da sua foto: na parte inferior direita da tela, na janela “Layers”, existe uma opção “opacity” que controla a transparência da foto. Quanto menor a porcentagem, mais transparente ela fica.

Deixe esta opção em 40% para a “Layer 1″, ou seja, a camada da sua foto.

05) Agora, com a “Layer 1″ ainda selecionada, aperte Ctrl + T para ativar a ferramenta Free Transform. Como o próprio nome já diz, esta ferramenta serve para você ajustar o tamanho, perspectiva, inclinação, posição e rotação da sua camada, livremente. Ela é bem intuitiva, e creio que não será difícil utilizá-la. À medida que você for passando o mouse sobre a imagem, verá algumas setas: caso seja dentro da imagem, você terá a opção de mudá-la de posição; caso seja nas bordas, você poderá alterar o tamanho da imagem, e nas bordas diagonais, alterar o tamanho da altura e da largura. Dica: ao mudar o tamanho pela borda diagonal, mantenha pressionada a tecla Shift para manter as proporções da sua foto, e não deixá-la “deformada”, ou seja, com a altura maior que a largura, ou vice-versa. Passando o mouse no lado externo da imagem, você verá um conjunto de duas setas, que servem para rotacionar a camada. Bem intuitivo, não? Teste bem, e ajuste a sua imagem para que “caiba” perfeitamente no rosto do Brad, como uma máscara. Após o ajuste, tecle Enter.

Sua foto ficará mais ou menos assim:

Dica: Se fizer algo errado, basta teclar Ctrl + Z para desfazer a última alteração. Para alterações anteriores, Ctrl+ Alt + Z.

06) Agora sim, vem a parte da “montagem” propriamente dita. A melhor forma de fazer montagens é adicionando uma “máscara” na foto sobreposta, e fazendo os ajustes necessários. Com isso, será possível tornar transparente algumas partes da foto, de sua preferência.

As máscaras no Photoshop utilizam o padrão “black to white”: quanto mais escura a cor utilizada para pintar a máscara, mais transparente fica a camada. Vamos ver isto na prática:

Com a “Layer 1″ selecionada, clique no botão “Add Layer Mask”, na janela das camadas, na parte inferior (é um botão com um retângulo e um círculo no meio), como mostrado na foto:

Será criada, ao lado da “Layer 1″, uma “máscara” de transparência, na cor branca. Para conseguir deixar a parte externa da foto (ou seja, tudo que não se encaixe com o rosto) transparente, você precisará selecionar a ferramenta brush, ou pincel, e escolher a cor preta.

O atalho para esta ferramenta é a tecla B.

07) Após selecionar a ferramenta, tenha certeza de que a máscara esteja selecionada (caso tenha dúvidas, dê um clique com o botão esquerdo do mouse na “máscara” branca que aparece ao lado da Layer 1), e selecione a cor preta, na janela logo acima das Layers, caso ainda não esteja selecionada.

08) Feito isto, escolha um pincel grosso, de mais ou menos 30px de diâmetro, e “pinte” as bordas da imagem sobreposta, que ficarão transparentes. Vá fazendo isto até ter somente os detalhes do rosto da sua foto, como olhos, boca e nariz, vísiveis. Não se preocupe com o caso de “comer” uma parte da sua foto: para torná-la opaca novamente, tecle X (atalho utilizado para trocar as duas cores selecionadas na aba “Colors”) e escolha a cor branca, caso ela já não esteja selecionada. Após isso, pinte a parte transparente, e ela voltará a aparecer.

Mágica? Não. Como falei anteriormente, quanto mais escura a cor utilizada para pintar a máscara, mais transparente fica a sua camada. Portanto, você pintado-a na cor branca, está tornando-a 0% transparente. Você inclusive pode utilizar cores não tão escuras para dar um efeito não muito transparente. Veja como vai ficar a sua imagem, até agora:

Já dá pra perceber como a foto vai ficar, não? Está um pouco distorcida pois dei um zoom para mostrar os detalhes. Você pode fazer o mesmo teclando Z e clicando com o botão esquerdo na foto, para aumentar o Zoom, ou segurando a tecla Alt e clicando com o botão esquerdo, para diminuí-lo. Ou ainda, pode segurar a tecla Alt e girar a roda central do mouse, caso ele tenha 3 botões. Para que sua imagem volte a ter o zoom em 100%, o atalho é Ctrl + Alt + Número 0 (zero).

09) Após o retoque, é hora de ver como vai ficar a sua imagem. Lembra-se quando ajustou a opacidade da camada, no passo número 4? Você vai fazer o mesmo, só que, desta vez, colocando a opacidade da camada da sua foto em 100%. Olha como está ficando a nossa foto:

Bem estranho ainda, não? Agora, é só ajustar o tamanho com Ctrl +T novamente, caso seja preciso, e “pintar” a máscara onde for necessário, da mesma forma que no passos 6,7 e 8. Veja como vai ficar a foto ajustada (está quase pronta, falta só mais um passo):

Legal. Mas… e a cor da camada, que está ligeiramente diferente do tom de pele de Brad Pitt, sem falar na iluminação?

É aí que entram os ajustes de Levels (ou Níveis, em bom português). São eles que controlam a iluminação e a saturação das camadas, possibilitando a mudança de tons de pele, cor, luz, sombras, e muito mais.

Para abrir a janela de Levels, tecle Ctrl + L. Você verá o menu suspenso “Channels” (canais) com as opções: RGB, Red, Green e Blue.

Selecionando RGB, você irá controlar os níveis de todas as cores da camada.

Red, você irá ajustar o canal da cor Vermelha.

Green, o da Verde.

Blue, o da cor Azul.

Verá também algumas setas pequenas para ajuste na parte superior, em “Input Levels”, e outras na “Output Levels”. Não irei usar termos técnicos aqui, então, entenda da seguinte forma: o “Input Levels” controla o contraste e exposição, enquanto o “Output Levels” controla o brilho (gama) das cores selecionadas. As imagens geralmente utilizam o padrão RGB, que nada mais é que uma mistura das cores Vermelha, Verde e Azul para “imprimir” as cores na tela. Se você chegar bem perto da sua televisão, não percebe minúsculas “escamas” nestas 3 cores? Então, a mistura e a intensidade de cada cor em diversos pontos, formam a imagem propriamente dita.

Como este é um tutorial para “facilitar” as coisas, vá mexendo nos níveis para saber como eles funcionam, e tente deixar a sua foto com o padrão de cor e iluminação da foto sobreposta. Lembre-se: uma montagem nada mais é que uma “máscara” propriamente dita, colocada em cima da foto a ser sobreposta. Após ter um resultado agradável, clique em “ok” na janela “Levels“. Veja a foto original e o resultado final, e compare:

Massa, não? Eu O David Hank conseguiu ficar mais pinta que o Brad com aquela cara de quem comeu e não gostou (sem trocadilhos, por favor). Agora, você já pode espalhar para os seus amigos que tirou uma foto com a Angelina Jolie, ou quem mais você quiser!

Parabéns, você concluiu a sua montagem no Photoshop!

Diz aí? Foi fácil ou não foi? Nem doeu!

E se você quiser aprender tudo que o Photoshop é capaz de fazer por você, compare preços de Cursos de Photoshop no Buscapé, e torne-se um profissional em montagens – ou em pura zuação.

Siga os passos:

• Com o MSN aberto e conectado, clique na seta ao lado do seu nome (logo após a sua foto), na janela principal, e vá em “Opções…”.
• Logo ali, na coluna esquerda, procure por “Privacidade” e dê um clique. Aparecerá uma lista de bloqueios, com todos os seus contatos (bloqueados ou não).
• Para descobrir quem te bloqueou é muito simples: vá clicando com o botão direito do mouse nos contatos mostrados nesta janela. Aparecerão as opções “Adicionar a contatos”, “Mover para a lista de bloqueios” e “Excluir”. Por padrão, somente a “Mover para a lista de bloqueios” deve estar selecionável; as outras opções devem estar em cinza. É aí que está o pulo do gato: Se a opção “Excluir” estiver selecionável, ou seja, não esteja na cor cinza, pode ter certeza que aquele contato te bloqueou. Simples assim: só dá trabalho se você tiver trocentos contatos, mas ainda assim, é melhor que colocar a sua conta e a sua senha em um site duvidoso, que pode até roubá-las!

Agora, você escolhe se quer excluí-lo da sua lista de contatos, ou então, manda um e-mail pra ele cruzando os braços, e perguntando porque ele te bloqueou.

Não se pode agradar a todos.

Mas se você for bem, bem vingativo mesmo, então corra e compare preços de Orixás, Velas, Cachaça e muito Azeite de Dendê no Buscapé para fazer uma bela de uma macumba para esse seu amigo da onça!