Your SlideShare is downloading. ×
0
POR LEONARDO FERREIRA @LEONARDOFERREIRA
LEONARDO FERREIRA
• Graduando em Design Gráfico - ESAMC
• WebDesigner e Programador Front-End (UI e UX)
• CEO FerreiraStud...
POR QUE
BUSCAR?BUSCAMOS MAIS DO QUE INFORMAÇÕES
90%
DOS USUÁRIOS
BUSCAM NO GOOGLE
85%
DOS USUÁRIOS
ENCONTRAM O QUE
PROCURAM
70%
CLICAM NOS
RESULTADOS DA PRIMEIRA PÁGINA
100BILHÕES DE
BUSCAS
SÃO FEITAS TODO MÊS
... AND NOW?
SEO(SEARCH ENGINE OPTIMIZATION)
86%
CLICAM EM
RESULTADOS DA
BUSCA ORGÂNICA (SEO)
14%
CLICAM EM
RESULTADOS DE
LINKS PATROCINADOS
• LINKS PATROCINADOS
• EFETUA-SE O PAGAMENTO E
SE TEM UM RESULTADO MAIS
IMEDIATO.
• SEO
• OS CUSTOS SÃO RELATIVAMENTE
BAIX...
SEO
LINKS
PATROCINADOS INVESTIMENTO
SEO ON-PAGE
(ASPECTOS INTERNOS)
SEO ON-PAGE (ASPECTOS INTERNOS)
• URL AMIGÁVEL
• Evite utilizar “URLS” muito
longas e mal posicionadas.
• Quanto mais curt...
FEMININO
MASCULINO
INFANTIL
• ARQUITETURA DA
INFORMAÇÃO
• Pense sempre no usuário e em
sua experiência
• Entenda o que ele...
• DESCRIPTION
• Use a “meta tag” description
• Construa uma description atraente
• Seja verdadeiro e Criativo
• Utilize pa...
• DEFINIÇÃO DE TÍTULOS
• Ficam entre tags como title,
H1 e H2
• Defina títulos criativos,
chamativos e claros
SEO ON-PAGE ...
• MÚLTIPLAS URLS NA MESMA
PÁGINA
• Várias URLs que indiquem o mesmo
conteúdo
• Páginas diferentes são consideradas
conteúd...
• OTIMIZAÇÃO DE IMAGENS - UTILIZAÇÃO DE SPRITES
• Essa técnica consiste em agrupar
diversas imagens em uma só.
EXEMPLO
.ic...
• OTIMIZAÇÃO DE IMAGENS - UTILIZAÇÃO DE SPRITES
• Reduz absurdamente o número
de requisições HTTP e evita
atrasos nos recu...
• OTIMIZAÇÃO DE IMAGENS - DATA-URI (BASES 64)
• É uma maneira de adicionar conteúdo inline de uma URI que você
normalmente...
• OTIMIZAÇÃO DE IMAGENS - DATA-URI (BASES 64)
• IE8 para cima suportam codificação base64.
• Esse método e CSS Sprites pre...
• FERRAMENTAS DE OTIMIZAÇÃO DE IMAGENS
SOFTWARES
• RIOT - http://luci.criosweb.ro/riot/download/
• JPEG MINI - http://www....
• PLUGINS ATUALIZADOS
• jQuery – Um dos plugins mais utilizados
(constantemente atualizado)
• Esteja sempre atento as novi...
SEO OFF-PAGE
(ASPECTOS EXTERNOS)
• LINK BUILDING
• Captar links externos para o web-site
• Quanto mais links se recebe em uma página, melhor seu
posicionam...
• INTEGRAR O SITE EM REDES SOCIAIS
• INVISTA EM DIVULGAÇÃO
• FACILITAR O COMPARTILHAMENTO E ACESSO
• OS BUSCADORES TEM LEV...
1. INDEXABILIDADE
• DOMÍNIOS
• INVESTIR EM DORMÍNIOS PERTINENTES, INVESTIR EM PALAVRAS CHAVES
COMBINATIVAS COM A EMPRESA E...
2. ESTRUTURA E CÓDIGO
• UTILIZAR CÓDIGO EXTERNO (ESTILOS NO TOPO E
SCRIPT NO RODAPÉ )
<LINK> E <SCRIPT>
• COMPRIMIR O CSS
...
2. ESTRUTURA E CÓDIGO
• PREFIRA LINK AO INVÉS DE
@IMPORT
• Há duas maneiras de incluir uma folha
de estilo externa na sua ...
2. ESTRUTURA E CÓDIGO
• CARREGAMENTO ASSÍNCRONICO
• É IMPORTANTE PRINCIPALMENTE QUANDO
CARREGAMOS O CÓDIGO DE TERCEIROS PA...
3. DIAGNÓSTICO
• FERRAMENTAS DE DIAGNÓSTICO SEO
(yslow, pagespeed, webpagetest, http archive)
• Em geral elas analisam a p...
3. DIAGNÓSTICO
• TÉCNICAS BLACK HAT
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...
OBRIGADO
!“ Você pode encarar um erro como uma besteira a ser esquecida,
ou como um resultado que aponta uma nova direção....
Upcoming SlideShare
Loading in...5
×

SEO – A PEÇA CHAVE DO QUEBRA-CABEÇA

405

Published on

PALESTRA SOBRE SEO

Search Engine Optimization. Em português é conhecido como Otimização de Sites, MOB e Otimização para Buscas. O SEO nada mais é do que a otimização de uma página (ou até do site inteiro) para ser melhor compreendido pelas ferramentas de busca. A conseqüência da utilização das técnicas de SEO é o melhor posicionamento de um site em uma página de resultados de uma busca. Por exemplo, ao pesquisar no Google por “Marketing de Busca”, o primeiro resultado é este site. O SEO é uma prática sem garantias, ou seja, nenhuma empresa ou pessoa pode garantir que seu site fique em primeiro em uma busca, pois o único capaz disto seria o próprio site de busca como o Google ou o Yahoo.

Os fatores que influenciam o posicionamento das páginas são guardado a sete chaves pelos site de busca. Porém, ao longo do tempo, foi possível identificar as melhores práticas que se resumem em empregar o bom senso na criação e estruturação de um site. O SEO também depende da palavra-chave que é o termo que você usa em um busca. Dependendo de quais palavras você utiliza, serão retornadas páginas diferentes em posições diferentes.

O SEO pode ser dividido em duas partes. Fatores internos e fatores externos. Os internos são relacionados ao site. Alguns exemplos são urls claras, utilização dos padrões web, títulos de página racionais e a correta utilização das tags html que é linguagem utilizada para construir páginas web. Já a parte externa analisa como os outros sites se relacionam com o site. Os exemplos são quantidade de links apontando para o site, quais sites apontam o site e o conteúdo do link apontado. Dependendo destes fatores, as páginas são pontuadas pelos sites de busca para que ele possa determinar a relevância da pagina e quais as palavras-chave relacionadas a ela. O Google utiliza um sistema de pontuação de 0 a 10 que é o PageRank.

Existe também o lado negro do SEO conhecido como Black Hat Seo. Nele, são utilizadas técnicas que tentam enganar os algoritmos das ferramentas de busca para melhorar o posicionamento da página como uso de texto invisível ou de exibir conteúdo diferente para pessoas e sites de busca. Quando descobertos, os sites de busca podem punir os sites que utilizam estas práticas diminuindo a importância do site ou chegando a excluí-lo da sua busca.

Não se deve confundir o SEO com links patrocinados, pois no segundo você pode pagar para ter a garantia de ficar na frente de outros resultados, podendo ficar até em primeiro se estiver disposto a pagar o preço.

SAIBA SOBRE - LINKS PATROCINADOS E SEO

PALESTRANTE
Leonardo Ferreira

TWITTER
http://www.twitter.com/leonardoferr_

FACEBOOK
http://www.facebook.com/ferreirastudios

SKYPE
ferreira.studios

Published in: Technology

Transcript of "SEO – A PEÇA CHAVE DO QUEBRA-CABEÇA"

  1. 1. POR LEONARDO FERREIRA @LEONARDOFERREIRA
  2. 2. LEONARDO FERREIRA • Graduando em Design Gráfico - ESAMC • WebDesigner e Programador Front-End (UI e UX) • CEO FerreiraStudios e BlogdosOito • Youtube Creator
  3. 3. POR QUE BUSCAR?BUSCAMOS MAIS DO QUE INFORMAÇÕES
  4. 4. 90% DOS USUÁRIOS BUSCAM NO GOOGLE
  5. 5. 85% DOS USUÁRIOS ENCONTRAM O QUE PROCURAM
  6. 6. 70% CLICAM NOS RESULTADOS DA PRIMEIRA PÁGINA
  7. 7. 100BILHÕES DE BUSCAS SÃO FEITAS TODO MÊS
  8. 8. ... AND NOW?
  9. 9. SEO(SEARCH ENGINE OPTIMIZATION)
  10. 10. 86% CLICAM EM RESULTADOS DA BUSCA ORGÂNICA (SEO) 14% CLICAM EM RESULTADOS DE LINKS PATROCINADOS
  11. 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. 12. SEO LINKS PATROCINADOS INVESTIMENTO
  13. 13. SEO ON-PAGE (ASPECTOS INTERNOS)
  14. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. 25. SEO OFF-PAGE (ASPECTOS EXTERNOS)
  26. 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. 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. 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. 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. 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. 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. 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. 33. 3. DIAGNÓSTICO • TÉCNICAS BLACK HAT
  34. 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. 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
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×