PARA

DESENVOLVEDORES
Introduo
O objetivo desse ebook ser um manual de referncia rpido para 1 TITLE E META DESCRIPTION
desenvolvedores, durante o desenvolvimento de um site. Quando
os desenvolvedores web prestam ateno aos elementos SEO que 2 USO DA TAG CANONICAL
podem ser trabalhados nos estgios iniciais de novos projetos,
geralmente economizam muito tempo, evitando retrabalho
posterior. Nesse material, apresentamos alguns elementos de SEO 3 SITEMAP
que voc precisa considerar, eles so 9 ao total:
4 HEADING TAGS

5 ALTERAO DE URL

6 ROBOTS.TXT

7 ESTRUTURA DE URLS E URLS AMIGVEIS

Lendo o contedo a seguir voc ter a oportunidade de conhecer
em mais profundidade cada um desses elementos. Depois de 8 IMAGENS
aprender sobre eles, voc poder aplicar os conhecimentos
adquiridos, tendo a chance de, cada vez mais, aproximar os
usurios dos projetos que voc desenvolve. 9 META TAGS
SEO 1
O que SEO?
SEO a sigla, em ingls, para Search Engine Optimization,
que em portugus quer dizer Otimizao para Mecanismos de
Busca. O mais comum de todos, como vocs j sabem, o Google.
Os resultados orgnicos so aqueles que, quado o usurio faz
uma busca no Google, aparece logo aps os anncios. Ou seja,
no um resultado pago. Hoje o Google costuma apresentar
quatro resultados pagos, para depois exibir os orgnicos. Por isso,
no basta mais estar na primeira pgina, o importante posicionar
o melhor possvel e, de preferncia, buscar a 1 posio orgnica,
logo aps os links patrocinados.
SEO 1.2
Como funciona o algoritmo do Google?
A principal mtrica utilizada pelo Google o PageRank, que
determinado por mais de 200 fatores. Podemos destacar que
reputao e volume/qualidade de backlinks so os principais
fatores do PageRank. Mas, como o Google analisa isso? As
chamadas Spiders fazem uma verificao geral e vo identificando
todas essas informaes, o que chamamos de crawling, em
portugus, rastreio. Os backlinks so todos os links internos ou
externos que direcionam para o seu site.
SEO 1.3
Como trabalhar em SEO
Existem basicamente dois pilares quando falamos de otimizaes
de SEO: on-page e off-page. Ambas so muito importantes, mas
quando falamos em SEO para desenvolvedores, o foco on-page,
ou seja, otimizaes no cdigo. J off-page so aes como link
building e contedo, focando em trazer backlinks externos.

Por isso, quanto maior o volume e melhor a qualidade, maior ser a

sua reputao. Backlinks de qualidade so aqueles que vm de
sites com boa reputao e informaes confiveis. como quando
algum indica um dentista e tem dentes bonitos e saudveis. Essa
uma indicao qualificada, que eleva a reputao do profissional.
J a reputao relacionada com a qualidade das informaes
presentes no site, quando o contedo original, seu site recebe
backlinks positivos e etc. importante lembrar que chegar a um
PageRank alto leva tempo. Se voc fizer otimizaes no seu site
hoje, elas podero levar at trs meses para trazer resultado.
SEO 2
9 recomendaes para SEO on-page
2.1 Title e Meta Description

Quando vemos um resultado orgnico para uma busca, ele vem O Google busca trazer o que melhor para a experincia do usurio.
estruturado com alguns elementos principais: ttulo, URL e Ter o mesmo contedo em todo o site no traz relevncia, ento
descrio. Existem algumas boas prticas importantes na hora de no algo interessante para o Google exibir ao usurio.
desenvolver esse contedo. O ttulo deve ter at 65 caracteres e
importante incluir a sua principal palavra-chave nele. Nunca se
esquea de fazer um levantamento de quais so as principais
palavras-chave do seu site e das suas pginas.

A URL que ir aparecer a prpria URL do seu site, por isso

importante que ela seja amigvel. Falaremos sobre isso na
recomendao 2.3.

J a meta description uma descrio breve do que ser

apresentado naquela pgina. interessante que ela responda a
dvida apresentada pelo usurio ao fazer a busca e tambm deve
conter a sua palavra-chave. No passe de 156 caracteres, pois o
usurio ir ler o contedo completo quando acessar o seu site e o
prprio Google ir cortar parte do seu contedo, substituindo por
reticncias. Lembre-se que no se deve repetir o mesmo ttulo e
descrio para todas as pginas, pois cada uma tem o seu.

SEO
2.2 Heading Tags
Chamamos de heading tags, um recurso utilizado no cdigo da pgina para indicar a hierarquia dos elementos citados em um artigo, por
exemplo. Estas heading tags so orientadas por H1, H2, H3 e assim por diante. o H1 indica, por exemplo, o ttulo da sua pgina, sinalizando
para o Google que a informao contida naquela tag a mais relevante do contedo. Assim como o H2 ser o segundo mais relevante e
assim por diante. importante lembrar que cada artigo dever ter apenas um H1, que geralmente o ttulo, onde est a informao mais
importante e que compila o contedo. J H2, H3 e outros podem ser repetidos, como subttulos para categorias, no caso de H2, e etc. Outro
ponto importante sobre as heading tags que elas vo ter uma aparncia diferente do restante do texto, e isso ser de acordo com o css
do seu site.

Em geral, o H1 a fonte de maior tamanho, seguido por H2, que ser um pouco menor, e H3, que, muitas vezes, do mesmo tamanho do
texto, porm em negrito ou um pouco maior que o texto e menor que H2. Vai depender da sua preferncia. Quando voc utiliza uma
heading tag, dever ser feito dessa maneira: <h1> Ttulo da Publicao </h1>. E o mesmo se aplica s outras.

Fica mais claro na imagem abaixo. comum vermos sites que no utilizam o H1 adequadamente, perdendo a chance de destacar sua
palavra-chave mais importante. Por isso, faa uso desse recurso.

<h1> xxxx </h1> Ttulo Destaques

<h2> xxxx </h2>
Subttulo do Texto
<h3> xxxx </h3>
2.3 Estrutura de URL e URLs amigveis
Quando criamos nosso site, muitas
vezes no pensamos em qual ser a
estrutura das URLs de cada pgina e
isso no pode ser negligenciado. So
muitas coisas que devem ser pensadas
na hora de colocar um projeto no ar,
mas vale a pena decolar com tudo
pronto e otimizado. Por isso, evite URLs
confusas, que possam no ser
compreendidas pelo usurio. Esse
problema ainda mais comum no caso
de e-commerces, pois existe uma URL
para cada produto divulgado. Procurei
por bota azul no Google e encontrei um
site que possui justamente o formato de
URL que devemos evitar:
/feminino/bota/138/Azul?PS=36&map=
c,c,productClusterSearchablelds,specific
ationFilter_26
A gente consegue entender que h a Se optar por ajustar a estrutura das
categoria feminina e dentro dela a URLs que existem no seu site hoje,
categoria de botas. Depois tem um lembre-se de algo muito importante:
nmero, que poder ser um cdigo ou o redirecionamento. Digo isso porque,
uma marca e depois a cor. Porm, a ao mudar uma URL, todos os sites
partir do ponto de interrogao comea (inclusive o seu) vo ter links
o problema: muitas informaes sem quebrados direcionando para essa
sentido nenhum para o usurio. Ou seja, sua pgina. E se voc perder links
se ele quiser acessar posteriormente, vai externos, voc perde backlinks,
ter que entrar no site e procurar. relevncia e perde posicionamento.
Ento, muito cuidado! Evite este
Afinal, quem decoraria algo assim? problema com o redirecionamento 301.
Alm do mais, o usurio sente muito
mais confiana quando consegue
entender o contedo da pgina que ir
visitar ao visualizar a URL da mesma.
Feito isso, acessei um outro site que o
Google me recomendou, esse por sua
vez, melhor posicionado que o anterior
e a URL era assim:
/loja/bota-azul
Ele o mais indicado porque mantm o histrico de relevncia e o
transfere de uma URL para outra. Falaremos mais desse tpico
adiante. Aproveitando o tema, vou falar um pouco sobre o uso do
atributo href. Utiliza-se esse atributo para sinalizar um link a um
texto ao longo de um artigo, ou menu, por exemplo. Devemos
inserir o href e sinalizar a URL, por isso, caso ela tenha mudado, o
redirecionamento ir fazer o usurio chegar na URL nova igual.
Junto com o href voc poder utilizar a tag <a> com um anchor
text, ou seja, um texto ncora que indica para o Google o que ele
ir encontrar na pgina para a qual o link redireciona. Por exemplo:
<a href=/loja/bota-azul>Bota Azul</a>
2.4 Uso da tag Canonical
Explicando de uma forma simples e direta, a tag Canonical tem
como principal objetivo evitar a duplicao de contedos na web.
Todos sabemos que h diversos sites diferentes com o contedo
idntico ou muito parecido.
Os mecanismos de busca no vem algo assim com bons olhos,
afinal, o usurio quer contedo relevante e original, ento por que
exibir pra ele algo repetido e sem a fonte sinalizada
adequadamente?
Pode ocorrer, dentro do seu prprio site, de um contedo se repetir
em pginas diferentes porque voc est reforando uma
comunicao ou por alguma outra razo. Para que o Google saiba a
pgina que possui o contedo original, basta utilizar a tag
canonical e dizer isso para ele.
Veja exemplo:
<link rel=canonicalhrefhttps://www.lojay.com.br/loja
/bolsa-azul/>
Nunca se esquea de conferir se a tag canonical da sua pgina
est com a URL e se a URL est correta. Alm disso, ao fazer
uma troca de URL da pgina, atualize sua tag canonical
com a informao certa.
2.5 Alterao de URL
Aqui vamos falar especificamente do Redirecionamento 301.
Primeiro, importante lembrar que existem dois
redirecionamentos que se assemelham, mas que possuem uma
diferena que fundamental para SEO.
O 301 permanente e o 302 temporrio. Use o segundo para
situaes muito momentneas e por um perodo muito curto de
tempo para no prejudicar a indexao da sua pgina. J no caso
do 301, voc ir redirecionar o usurio da Pgina 1 para a Pgina 2
permanentemente, afinal, a URL anterior no existe mais, e ir
transferir para a Pgina 2 todo o histrico gerado pela Pgina 1.
Ao fazer essa transferncia, a sua Pgina 2 receber todos os
backlinks antigos, relevncia, popularidade e PageRank. Faa dessa
maneira e os resultados no sero prejudicados.
Outro ponto importante o ttulo do arquivo. Muitas vezes
salvamos uma imagem com um ttulo que somente ns
entendemos, ou muito genrico, ou no faz o menor sentido.
Principalmente no caso de fotos, que o nome gerado pela prpria
mquina fotogrfica e apenas numrico. Antes de subir suas
imagens para o site, analise o nome de cada uma e utilize algo que
seja compreensvel. Por exemplo: bota-azul-curta.jpg. Fica fcil de
entender e o Google consegue ler.

2.6 Imagens
Quando falamos de imagens, h algumas coisas que podem ser
pensadas em relao a isso. A primeira delas no quanto podem
interferir na velocidade de uma pgina. Imagens muito pesadas
podem aumentar consideravelmente o tempo de carregamento do
Tambm lembre-se de utilizar o alt text. Isso justamente um texto
seu site, como isso pode ser uma experincia ruim para o usurio, o
alternativo que ir sinalizar para o Google o que h naquela
Google define que no acha bom quando isso acontece,
imagem caso ele no consiga ler e tambm poder aparecer
prejudicando o seu PageRank. Por isso, lembre sempre de
quando o usurio passa o mouse ou quando a imagem no carrega
compactar as suas imagens. Faa o teste da velocidade do seu site
e aparece a marcao com a descrio. Veja exemplos na imagem
aqui:
acima. Para utilizar o alt text siga um raciocnio semelhante ao do
nome do arquivo. Para faz-lo, inclua alt=bota azul curta tag da
https://developers.google.com/speed/pagespeed/insights/
imagem.
2.7 Sitemap
Outro ponto muito importante ao fazer otimizaes de SEO. Existem dois formatos de sitemap: o antigo
sitemap.html e o sitemap.xml. O sitemap.html uma pgina que lista, num formato semelhante a um
menu, todas as pginas do seu site por categoria e de forma clicvel. Muitos sites disponibilizavam um link
visvel com o mapa do site para que o usurio pudesse, inclusive, acessar e encontrar algo que esteja
buscando

O sitemap.xml o que vamos destacar hoje. o que voc poder submeter ao Search Console, por
exemplo. Ele um arquivo, em xml, onde voc ir listar todas as pginas do site que deseja indexar. Ele
muito til para que o rob do Google consiga identificar as suas pginas, para ajudar na indexao do seu
site e para acelerar o rastreio de novos sites.

Tambm recomendado para sites muito grandes, que comportam muitas pginas em sua estrutura,
pginas pouco vinculadas, ou seja, que possuem um volume muito baixo de backlinks, e sites novos que
ainda possuem poucos links externos e precisam ser reconhecidos pelo Google. Lembre sempre de
atualizar o seu sitemap com as pginas novas que surgirem no seu site.
O sitemap.xml possibilita tambm indicar algumas informaes relevantes ao documento, como a
prioridade da pgina: de 0 a 1 e a frequncia com que ela deve ser revisada pelo Google: diariamente,
semanalmente ou mensalmente. A informao ser dada dessa maneira:

<url>
<loc>https://www.seoparadesenvolvedores.com.br/title</loc>
<changefreq>daily</changefreq>
<priority>0.85</priority>
</url>
2.8 Robots.txt

Esse mais um modo de sinalizar o que dever ou no ser

indexado pelo Google. Ele funciona como uma espcie de filtro
para os robos dos buscadores, permite ou bloqueia acesso
pginas do site e pode ser utilizado para indicar o endereo do
prprio sitemap, que falamos anteriormente.
Sempre que voc notar que alguma pgina sua no est indexando
de maneira alguma, verifique se, por alguma razo, ela no est
sendo bloqueada pelo Robots.txt.

importante olhar direto para essa possibilidade, pois ela j ir

evitar que voc fique dias investigando e a resposta est logo ali.
Quer ver o Robots.txt do prprio Google para entender como
funciona? Ento v em https://www.google.com/robots.txt.
Seguindo esse formato, no tem erro. Inclusive, voc poder testar
o funcionamento no Search Console. Para testar, basta ir at o
menu, na opo Rastreamento voc encontrar Testar Robots.txt.
Voc poder ver qual o contedo do arquivo e tambm inserir
qualquer URL do seu site e clicar em Teste. Se no for bloqueado
aparecer a mensagem Permitido. Caso estiver bloqueado, voc
ver a mensagem Bloqueado e tambm onde est esta informao
no arquivo, caso queira alterar.
2.9 Meta tags
L no primeiro item ns citamos as tags de title e meta description, H tambm a tag de nosnippet, que para no exibir a descrio
mas existem outras que voc deve levar em considerao ou, pelo da pgina, dessa forma:
menos, saber que existem. Uma delas a meta keywords. Ela era <meta name=robots content=nosnippet>
utilizada para indicar para os mecanismos quais as palavras-chave ou noodp, mas no usar descrio nos diretrios, como o DMOZ, assim:
importantes para o seu site. O Google no utiliza mais essa <meta name=robots content=noodp>.
informao, pois ele acredita que, se o seu contedo de
qualidade e alinhado com outras informaes do seu site, ento ele Por fim, noarchive e noimageindex. A primeira para no exibir
saber que palavras so essas. Alguns sites ainda utilizam, mas elas verso cache:
mais servem para que a concorrncia possa ver que palavras voc <meta name=robots content=noarchive>
est usando do que para otimizao de fato. e a segunda para no indexar imagens
<meta name=robots content=noimageindex>.
Outra a meta robots. Ns falamos do robots.txt no item anterior, Abaixo a tabela, que mostra de forma mais clara e visual.
mas h outra maneira tambm de sinalizar para o Google
informaes de indexao. Ela pode ser usada de diversas index <meta name=robots content=index> pgina deve ser indexada
maneiras e vai diretamente no cdigo da pgina a ser indexada ou noindex
follow
<meta name=robots content=noindex>
<meta name=robots content=follow>
no indexar pgina
seguir os links dessa pgina
no. Se voc deseja indexar um pgina, utilize a meta tag index, nofollow <meta name=robots content=nofollow> no seguir links da pgina
nosnippet <meta name=robots content=nosnippet> no exibir descrio
dessa maneira: noodp <meta name=robots content=noodp> no usar descrio DMOZ
<meta name=robots content=index> noarchive <meta name=robots content=noarchive> no exibir verso em cache
noimageindex <meta name=robots content=noimageindex> no indexar imagens
Caso no queira indexar, utilize noindex, assim:
<meta name=robots content=noindex>

Outras opes so follow e nofollow, quando voc indica se o

Google dever ou no seguir os links contidos na pgina, poder
ser assim:
<meta name=robots content=follow>
ou assim
<meta name=robots content=nofollow>
3 . Ferramentas de SEO
Existem milhares de ferramentas no mercado, mas nem sempre dispor de muitas
opes vai ser o que vai ajud-lo no dia a dia. Normalmente, o melhor contar com
um pacote complementar de solues, sem dispersar sua ateno com as diversas
ferramentas que surgem a toda hora. Identificamos aqui 5 recursos que podem
ajudar voc tanto a otimizar o contedo quanto a parte tcnica do seu site. Essas
ferramentas diagnosticam e traduzem necessidades de SEO, alm de oferecer uma
maneira intuitiva para que voc mesmo possa intervir no seu site, reparar e evitar
possveis problemas.
3.1 Google Search Console
Esta ferramenta j foi conhecida como
Webmaster Tool, hoje ela , junto com o
Google Analytics, uma das ferramentas mais
importantes para desenvolvedores que focam
nas necessidades dos usurios. Essa ferramenta
entrega uma srie de dados e controle de
configuraes e acesso a dados do seu site.
possvel fazer muita coisa com o Google Search
Console, o retorno do tempo que voc investe
nessa ferramenta garantido.
O Search Console a ferramenta mais
indispensvel para quem deseja trabalhar com
SEO. Ela alerta voc sobre os erros crticos do
site, como a deteco de contedo invadido,
alm de ajudar a gerenciar a exibio do seu
contedo nos resultados da pesquisa. Atravs
dessa ferramenta voc tem total controle sobre
o que acontece do ponto de vista tcnico, e se
algo est atrapalhando seu posicionamento no
buscador do Google.
3.2 Open Site Explorer
Uma ferramenta que mostra a autoridade dos domnios (domain
authority) e a autoridade da pgina (page authority). Alm dessas
duas informaes importantes, atravs dessa ferramente voc pode
obter ideias de domnios com os quais pode ser interessante iniciar
um relacionamento e das palavras-chave que pode investir. Por
exemplo, insira a URL do seu concorrente e confira o resultado
apresentado nas abas linking Domains e Anchor Text. Dessa
forma, sero mostradas at 20 palavras-chave que o seu
concorrente usa como texto para o links, permitindo que voc
saiba como eles esto segmentando as campanhas e quo forte o
trabalho de backlinks deles.
3.3 Pagespeed
Para analisar o carregamento de uma pgina, acesse o link
PageSpeed Insights e digite o domnio desejado. O PageSpeed
Insights gera um relatrio com sugestes de melhorias para o seu
site.
Com o Google PageSpeed voc pode analisar e otimizar o tempo
de carregamento do seu site. A velocidade com que um site
carrega seu contedo influi diretamente na experincia do usurio.
Para ter uma idea, um estudo apontou que usurios comeam a
perder a pacincia aps 2 segundos quando um vdeo trava, sendo
que quando atingidos 5 segundos de espera, 50% dos usurios
desistem de assistir ao vdeo. Outros estudos apontaram
comportamento similar para a espera no carregamento de pginas.
Nesta soluo, voc tem uma anlise detalhada do seu site (poder
escolher entre a avaliao da verso mobile e desktop). O
PageSpeed, alm de mostrar os pontos fortes e fracos da sua
pgina, oferece instrues com exemplos do seu prprio site para
corrigir problemas.
3.4 SEO Certo
O SEO Certo uma ferramenta de diagnstico de SEO. A soluo
fornece relatrios completos e fceis de compreender sobre o seu
site, levando em considerao fatores como uso de palavras-chave,
contedo, tempo de carregamento, presena nas redes sociais,
desempenho em dispositivos mveis e muito mais. O relatrio
personalizado inclui um passo a passo para resolver cada item que
precisa ser melhorado no seu site, com detalhes para a execuo da
tarefa. Alm disso, voc pode cadastrar concorrentes de mercado e
receber informaes valiosas sobre eles, podendo inclusive comparar
o seu site com o deles. A comparao com a concorrncia garante que
seja possvel observar como outras empresas que tm produtos e/ou
servios semelhantes ao seu, esto se posicionando em termos de SEO.
Esse tipo de anlise permite que voc tenha uma vantagem
competitiva frente ao mercado. Os relatrios trazem informaes
altamente relevantes sobre aes que podem ser praticadas para
melhorar a qualidade do seu site quando ele visualizado em
dispositivos mveis. A lista de aes apresentada de modo a priorizar
o que pode trazer um retorno mais rpido e efetivo no volume e
qualidade no trfego do seu site.
3.5 Google Analytics
Essa uma ferramenta que vai ajud-lo a entender o
comportamento dos seus usurios, e implementar algo que em
SEO essencial: a melhoria contnua. O Google Analytics mostra os
principais dados de uso do seu site, como quais as pginas mais
acessadas, a porcentagem de usurios que saem do seu site sem clicar
em outros links e navegar em outras pginas, entre outros dados
que ajudam voc a direcionar seus esforos de melhorias.
justamente essa capacidade de direcionar so seu trabalho depois de
o site ficar no ar que faz do Analytics uma das principais ferramentas
de SEO, que recomendvel para todos os ambientes online e
negcios.
Concluso
Abordamos aqui 9 otimizaes que voc deve levar em
considerao na hora de criar um novo site ou otimizar um site j
existente. Se voc for desenvolvedor, timo, ser uma tarefa muito
mais simples, mas se no for, pea ajuda ao seu, ou contrate um
pelo Workana, pois ser muito importante para garantir a aplicao
correta de todos estes ajustes.
Alm disso, faa uso de ferramentas que podero ajud-lo a
entender melhor qual a situao atual do seu site em termos de
SEO e do que ele precisa. Eu recomendo o uso do Analytics, do
Google, para ter dados estatsticos; o Search Console, para facilitar
a indexao, identificar erros de crawling, em portugus,
rastreamento, e tambm posicionamento, volume de impresses,
renderizao e muito mais. Tambm consideramos o PageSpeed
excelente para analisar a velocidade do seu site, tanto para desktop
quanto para mobile e identificar o que pode ser feito para que ele
seja mais rpido no carregamento; e ferramentas como o SEO certo,
que ajudam a identificar problemas de SEO dentro do site e
indicam o que deve ser otimizado.
H diversas outras ferramentas, como o Open Site Explorer do
MOZ, que indica o Domain Authority e Page Authority, e muitas
outras. Cada um tem uma preferncia e possui as quais se adapta
melhor
Se quiser saber algumas dicas sobre SEO para dispositivos mveis
acesse essa publicao, e se estiver buscando ainda mais
contedos relacionados, acesse o blog da KingHost, o LAB. Mas se
estiver buscando mais contedos aprofundados como esse, acesse
a pgina de contedos grtis.
Voc tambm pode encontrar dicas sobre SEO, SEM e outros
assuntos sobre Marketing Online no blog da Workana! E se estiver
procurando trabalho freelance ou quiser contratar freelancers,
acesse a plataforma! grtis!
Patrcia Sperk
Analista de SEM na KingHost

Administradora por formao, especialista em Online Marketing h 5

anos e com MBA em Marketing pela FGV.

Trabalhou no Marketing da Dell por mais de 3 anos. Com perfil analtico,

mas louca por cinema, encontra na arte o equilbrio da criatividade.
Segurana, suporte tcnico especializado e servidores 100%
brasileiros. Essas so as trs principais caracterscas pelas
quais a KingHost conhecida e recomendada pelos clientes
dos mais de 300 mil sites que hospedamos. Conhea mais
sobre a nossa histria e servios.

www.kinghost.com.br
 Acreditamos no talento e nas ideias da regio, e por isso a workana existe; um
espao digital para conectar os melhores freelancers com os projetos mais
interessantes da Amrica Lana.

Diariamente, novas ideias se transformam em projetos e geram trabalho de

qualidade para os freelancers da regio. Centenas de empreendimentos e PMEs
crescem na Workana, a primeira e maior comunidade de trabalho freelance e
remoto na Amrica Lana.

Empreendedores, criavos, sonhadores, visionrios e independentes se conectam

na Workana com algo em comum: acreditar e criar o futuro da regio.

www.workana.com