O documento fornece informações sobre otimização para mecanismos de busca (SEO). Discute aspectos internos como URL amigável, títulos e descrições otimizados. Também aborda aspectos externos como link building e integração em redes sociais. Reforça a importância de diagnóstico contínuo e teste A/B para melhorar o desempenho do site.

1. POR LEONARDO FERREIRA @LEONARDOFERREIRA

2. LEONARDO FERREIRA
• Graduando em Design Gráfico - ESAMC
• WebDesigner e Programador Front-End (UI e UX)
• CEO FerreiraStudios e BlogdosOito
• Youtube Creator

3. POR QUE
BUSCAR?BUSCAMOS MAIS DO QUE INFORMAÇÕES

4. 90%
DOS USUÁRIOS
BUSCAM NO GOOGLE

5. 85%
DOS USUÁRIOS
ENCONTRAM O QUE
PROCURAM

6. 70%
CLICAM NOS
RESULTADOS DA PRIMEIRA PÁGINA

7. 100BILHÕES DE
BUSCAS
SÃO FEITAS TODO MÊS

8. ... AND NOW?

9. SEO(SEARCH ENGINE OPTIMIZATION)

10. 86%
CLICAM EM
RESULTADOS DA
BUSCA ORGÂNICA (SEO)
14%
CLICAM EM
RESULTADOS DE
LINKS PATROCINADOS

11. • LINKS PATROCINADOS
• EFETUA-SE O PAGAMENTO E
SE TEM UM RESULTADO MAIS
IMEDIATO.
• SEO
• OS CUSTOS SÃO RELATIVAMENTE
BAIXOS (OU NÃO EXISTEM) E SE
TEM UM RESULTADO A LONGO
PRAZO.
SEO
DIVULGAÇÃO
EM MÍDIAS
LINKS
PATROCINADOS

12. SEO
LINKS
PATROCINADOS INVESTIMENTO

13. SEO ON-PAGE
(ASPECTOS INTERNOS)

14. SEO ON-PAGE (ASPECTOS INTERNOS)
• URL AMIGÁVEL
• Evite utilizar “URLS” muito
longas e mal posicionadas.
• Quanto mais curta melhor!
• Utilize hífen (-)
 EXEMPLO
 www.ferreirastudios.com/
marketing/redes-sociais
х EXEMPLO
х www.ferreirastudios/category.ph
p?codigo.153

15. FEMININO
MASCULINO
INFANTIL
• ARQUITETURA DA
INFORMAÇÃO
• Pense sempre no usuário e em
sua experiência
• Entenda o que ele procura e
facilite sua navegação
• Hierarquia e Fluxo é importante
PÁGINA INICIAL
SOBRE ROUPAS FILIAIS FALE CONOSCO
SEO ON-PAGE (ASPECTOS INTERNOS)

16. • DESCRIPTION
• Use a “meta tag” description
• Construa uma description atraente
• Seja verdadeiro e Criativo
• Utilize palavras chave
(Keywords)
SEO ON-PAGE (ASPECTOS INTERNOS)
<meta name=”description” content=”Escreva aqui a descrição da sua
página” />

17. • DEFINIÇÃO DE TÍTULOS
• Ficam entre tags como title,
H1 e H2
• Defina títulos criativos,
chamativos e claros
SEO ON-PAGE (ASPECTOS INTERNOS)
 EXEMPLO
 MELHORE SEU PAGE RANK
NOS BUSCADORES
х EXEMPLO
х SAIBA COMO MELHORAR O
PAGE RANK DO SEU SITE NOS
MECANISMOS DE BUSCA

18. • MÚLTIPLAS URLS NA MESMA
PÁGINA
• Várias URLs que indiquem o mesmo
conteúdo
• Páginas diferentes são consideradas
conteúdo duplicado e reduzem a relevância
• Canonical
<link rel=“canonical” href=“url.principal”/>
EXEMPLOS
• http://www.ferreirastudios.com.br
• http://ferreirastudios.com.br
• http://www.ferreirastudios.com.br/inde
x.php
• http://ferreirastudios.com.br/index.php
• http://ferreirastudios.com.br/php?site=
version1
SEO ON-PAGE (ASPECTOS INTERNOS)

19. • OTIMIZAÇÃO DE IMAGENS - UTILIZAÇÃO DE SPRITES
• Essa técnica consiste em agrupar
diversas imagens em uma só.
EXEMPLO
.icon-social {
background-image: url('mySprite.png');
background-position: -10px -10px;
}
SEO ON-PAGE (ASPECTOS INTERNOS)

20. • OTIMIZAÇÃO DE IMAGENS - UTILIZAÇÃO DE SPRITES
• Reduz absurdamente o número
de requisições HTTP e evita
atrasos nos recursos página.
• Espaços em branco afeta o uso
de memória para processar o
mapa de pixels.
SEO ON-PAGE (ASPECTOS INTERNOS)

21. • OTIMIZAÇÃO DE IMAGENS - DATA-URI (BASES 64)
• É uma maneira de adicionar conteúdo inline de uma URI que você
normalmente iria apontar reduzindo o número de requisições HTTP
necessárias para carregar uma página.
EXEMPLO
.bg-container { background-image: url('foo.png');}
.bg-container { background-image:
url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABAQMAAAAl21bKAAAAA1BMVEUAAACnej3aAAAA
AXRSTlMAQObYZgAAAApJREFUCNdjYAAAAAIAAeIhvDMAAAAASUVORK5CYII%3D') ;}
SEO ON-PAGE (ASPECTOS INTERNOS)

22. • OTIMIZAÇÃO DE IMAGENS - DATA-URI (BASES 64)
• IE8 para cima suportam codificação base64.
• Esse método e CSS Sprites precisam de
ferramentas de build para serem de fácil
manutenção.
• Desvantagem - Aumenta consideravelmente o
tamanho do seu HTML/CSS se você possuir
imagens grandes.
• GERADORES DE BASE 64
• http://dopiaza.org/tools/datauri/index.php
• http://websemantics.co.uk/online_tools/imag
e_to_data_uri_convertor/
SEO ON-PAGE (ASPECTOS INTERNOS)

23. • FERRAMENTAS DE OTIMIZAÇÃO DE IMAGENS
SOFTWARES
• RIOT - http://luci.criosweb.ro/riot/download/
• JPEG MINI - http://www.jpegmini.com/
• CAESIUM – http://www.caesium.com
ONLINE
• Tinypng - https://tinypng.com
• Smulthit - http://www.smushit.com/ysmush.it
• Kraken - https://kraken.io
SEO ON-PAGE (ASPECTOS INTERNOS)

24. • PLUGINS ATUALIZADOS
• jQuery – Um dos plugins mais utilizados
(constantemente atualizado)
• Esteja sempre atento as novidades de plugins
• Evite utilizar plugins sempre que for possível.
quanto menos plugins melhor !
SEO ON-PAGE (ASPECTOS INTERNOS)

25. SEO OFF-PAGE
(ASPECTOS EXTERNOS)

26. • LINK BUILDING
• Captar links externos para o web-site
• Quanto mais links se recebe em uma página, melhor seu
posicionamento
• Produza conteúdo de valor, publique entrevistas, aborde
temas polêmicos e que geram interesse.
SEO OFF-PAGE (ASPECTOS
EXTERNOS)

27. • INTEGRAR O SITE EM REDES SOCIAIS
• INVISTA EM DIVULGAÇÃO
• FACILITAR O COMPARTILHAMENTO E ACESSO
• OS BUSCADORES TEM LEVADO EM CONSIDERAÇÃO
O COMPARTILHAMENTO NAS MÍDIAS SOCIAIS PARA
DEFINIR
A RELEVÂNCIA DA PÁGINA
• DAR LIKE E COMPARTILHAR É UMA PROVA SOCIAL DE
CONTEÚDO QUALIFICADO
SEO OFF-PAGE (ASPECTOS
EXTERNOS)

28. 1. INDEXABILIDADE
• DOMÍNIOS
• INVESTIR EM DORMÍNIOS PERTINENTES, INVESTIR EM PALAVRAS CHAVES
COMBINATIVAS COM A EMPRESA E SEMPRE INVESTIR EM DOMÍNIOS CURTOS
• PLANEJADOR DE PALAVRAS DO GOOGLE ADWORDS http://adwords.google.com.br/keywordplanner
• CONTEÚDO NÃO INDEXÁVEL PELOS NAVEGADORES
ex FLASH, JAVA, VÍDEO, IMAGENS... (SEMPRE INTEGRAR O ATRIBUTO ALT E
DESCRIÇÕES)
• SITEMAPS
• A AUSÊNCIA DO SITEMAP DIFICULTA A INDEXAÇÃO
• ex ENVIAR ARQUIVO “SITEMAP.XML”
GERADOR DE SITEMAP –
http://www.xml-sitemaps.com/
ENVIAR PARA O GOOGLE –
https://support.google.com/webmasters/answer/183669?hl=en&ref_topic=8476

29. 2. ESTRUTURA E CÓDIGO
• UTILIZAR CÓDIGO EXTERNO (ESTILOS NO TOPO E
SCRIPT NO RODAPÉ )
<LINK> E <SCRIPT>
• COMPRIMIR O CSS
• PARA O NAVEGADOR NADA IMPORTA
ECONOMIZA BITES E O TEMPO DE EXECUÇÃO
• COMPRESSADOR - http://cssminifier.com

30. 2. ESTRUTURA E CÓDIGO
• PREFIRA LINK AO INVÉS DE
@IMPORT
• Há duas maneiras de incluir uma folha
de estilo externa na sua página, pode
ser através da tag “link”
<link rel="stylesheet" href="style.css">
Ou da propriedade @import:
@import url('style.css');
• Com o atributo @import
o navegador é incapaz de
realizar o download em
paralelo, o que causa
atraso na cascata de
carregamento dos
arquivos.

31. 2. ESTRUTURA E CÓDIGO
• CARREGAMENTO ASSÍNCRONICO
• É IMPORTANTE PRINCIPALMENTE QUANDO
CARREGAMOS O CÓDIGO DE TERCEIROS PARA
EMBEDAR UM BOTÃO LIKE OU TWEET POR EXEMPLO.
• OS CÓDIGOS MUITAS VEZES ESTÃO INEFICIENTES
DEVIDO A CONEXÃO DO USUÁRIO OU PELA CONEXÃO
COM O SERVIDOR ONDE ESTÃO HOSPEDADOS
• USAMOS ENTÃO OS CÓDIGOS DE FORMA
ASSÍNCRONICA (OU ENTÃO IFRAMES)
COMPRESSOR JAVASCRIPT -
http://developer.yahoo.com/yui/compressor/
var script = document.createElement('script'),
scripts = document.getElementsByTagName
('script')[0];
script.async = true;
script.src = url;
scripts.parentNode.insertBefore(script, scripts);

32. 3. DIAGNÓSTICO
• FERRAMENTAS DE DIAGNÓSTICO SEO
(yslow, pagespeed, webpagetest, http archive)
• Em geral elas analisam a performance do seu site, geram um relatório e dão uma
nota para ele, sem contar nas dicas preciosas que apresentam para você resolver
cada um dos problemas.
• ACOMPANHAMENTO DOS RESULTADOS
• O SITE NÃO MORRE DEPOIS DE FINALIZADO
• Comportamento pós-compra é fundalmental

33. 3. DIAGNÓSTICO
• TÉCNICAS BLACK HAT

34. 4. BÔNUS
• TESTE A/B
• DIVIDE O TRÁFEGO DE UMA DETERMINADA
PÁGINA EM DUAS VERSÕES E VERIFICA QUAL
DAS DUAS GERA MAIOR TAXA DE CONVERSÃO
• FEEDBACK REAL DO MERCADO E MENSURAÇÃO
COM PRECISÃO.
• DEVE SE TER UM NÚMERO SIGNIFICATIVO DE ACESSOS.

35. OBRIGADO
!“ Você pode encarar um erro como uma besteira a ser esquecida,
ou como um resultado que aponta uma nova direção. ”
STEVE JOBS