Click here to load reader

SEO para Front-End

  • View
    15.591

  • Download
    1

Embed Size (px)

Text of SEO para Front-End

  • 1. SEO para Front-EndDicas para construir sites melhoresPor Fbio Ricotta, Co-Fundador da MestreSEOFront In Sampa - Novembro de 2012

2. Fbio RicottaCo-Fundador da MestreSEOContatoTwitter: @fabioricottaEmail: [email protected]: www.mestreseo.com.br 3. Elias e Fbio, em Boston, Abril de 2012 4. slideshare.net/fabioricottaVoc pode baixar esta e todas as outras palestras... 5. O MercadoO cenrio do profissional de Front End 6. Antes de comearGostaria de mostrar comoest o nosso mercado... 7. http://digitaisdomarketing.com.br/o-analista-de-redes-sociais 8. Engraado no ?Parece piada... 9. Mas e no mercado defron-end? 10. Nos dias de hojeQuando as empresasbuscam por front-ends... 11. Elas especificam a vaga deuma forma curiosa... 12. Praticamente todasAs empresas querem umfront-end comconhecimentos em SEO! 13. Que talAprender um pouco deSEO? Vamos l? 14. Entendendo Princpios Como o Google funciona 15. http://www.youtube.com/watch?v=BNHR6IQJGZs 16. http://www.youtube.com/watch?v=BNHR6IQJGZs 17. http://www.youtube.com/watch?v=BNHR6IQJGZs 18. http://www.youtube.com/watch?v=BNHR6IQJGZs 19. http://www.youtube.com/watch?v=BNHR6IQJGZs 20. Frmula Secreta = 200 fatores (PageRank e outros). 21. O Brasil fala Googls 22. No BrasilDe cada 100 buscas, oGoogle o mediador de 86 23. http://www.serasaexperian.com.br/release/noticias/2012/noticia_00883.htm 24. Market Share Buscas no Brasil14%GoogleOutros86% 25. O interessanteAs buscas so compostasnormalmente de 1 a 4termos 26. Explicando o SEOO que esta sopa de letrinhas? 27. Links Patrocinados 28. Resultados Orgnicos 29. na rea de resultadosorgnicos quetrabalhamos... 30. Pois, em mdia, osresultados orgnicosrecebem cerca de 70%dos cliques. 31. 30% dos cliques70% dos cliques 32. Resumindo um pouco ahistria... 33. MeuCliente* 34. * 35. * 36. Estando melhorposicionado, eu consigomais visitantes. 37. 10 Dicas de SEOpara Front-End 38. 1. Webmaster Tools 39. O Google Webmaster Toolsplataforma do Google paraajudar os webmasters 40. https://www.google.com/webmasters/tools/ 41. Fica a dicaA Microsoft (Bing) tambmpossui uma plataformapara ajudar os webmasters 42. http://www.bing.com/toolbox/webmaster 43. Elas te doAvisos sobre como vocpode melhorar o seu site... 44. E aindaMostram quando vocpossui algum problemasrio. 45. 2. Ttulos 46. Guarde como um mantraCada pgina deve possuirum nico 47. Saiba queO a informaoque o Google vai exibir napgina de resultados 48. 3. Imagens 49. importante voc saber queO Google adora imagens! 50. http://support.google.com/webmasters/bin/answer.py?hl=pt-BR&answer=114016 51. Coloque sempreNomes detalhados einformativos,como servico-hospedagem-cloud.jpge fuja de DSC00281.jpg 52. Fornea sempreUm atributo ALTinformativo,como 53. E sempreFornea contexto para asua imagem, no adeixando-a sozinha napgina. 54. 4. URLs 55. Para o Google as URLs indicamO que vamos encontrarnaquela pgina 56. Por exemplo,O que voc entende poruma URL como:www.meusite.com/?p=1234 57. simples.Nada. 58. Agora,O que voc entende poruma URL como:www.meusite.com/servicos/servidor-cloud 59. simples.Que aquela pgina deservios e falar deservidores cloud. 60. Na nossa reaChamamos isto de URLsamigveis. 61. O GooglePrivilegia URLs que contmpalavras sobre o assuntoque elas tratam. 62. 5. Tempo deCarregamento 63. http://googlewebmastercentral.blogspot.com.br/2010/04/using-site-speed-in-web-search-ranking.html 64. A essncia As pessoas desejamacessar sites maisrpidos 65. EntoO Google adotou istocomo fator derankeamento! 66. LogoVoc pode otimizar otempo de carregamentopor etapas... 67. Comece por aqui...Nas imagens do seu site,atravs de compresso... 68. Para facilitarUse ferramentas comojpegtran, Jpegoptim, OptiPNGou PNGOUT. 69. Nos arquivosJavascript e CSS atravsde verses reduzidas,sem comentrios eespaos... 70. Para facilitarUse ferramentas comoClosure Compiler, JSMin,CSSmin ou YUI Compressor. 71. No servidorHabilite a compressogzip... 72. O que ele faz fornecer uma versocompactada dos seusarquivos. 73. Onde as otimizaesSo indicadas pelaferramenta PageSpeed 74. https://developers.google.com/speed/pagespeed/insights 75. Ou aindaPela ferramentaWebPageTest 76. http://www.webpagetest.org/result/121015_HH_EFY/ 77. 6. Rich Snippets 78. Em 2009O Google fez um anncioque mudaria muitoswebsites 79. http://googlewebmastercentral.blogspot.com.br/2009/05/introducing-rich-snippets.html 80. Mas desde 2009O Google melhorou emuito o suporte smarcaes 81. http://www.google.com/webmasters/tools/richsnippets 82. E vale lembrarQue existem diretrizes paraas rich snippets 83. http://support.google.com/webmasters/bin/answer.py?hl=en&answer=2722261 84. 7. Rel Author 85. Voc j se perguntouComo fao para aparecermeu rosto no Google? 86. Voc pode conseguirAumento de 30% devisitas apenas por exibirsua foto 87. Voc deve pensarE como posso usar nomeu site? 88. simples, olha s... 89. http://support.google.com/webmasters/bin/answer.py?hl=en&answer=1408986 90. Voc front-endJ pode criar isto emdois passos simples 91. Primeiro passoCada pgina do site devepossuir um linkGoogle 92. Segundo passoO autor, em seu perfil doGoogle+, deve adicionarum link para o site. 93. Em seguidaBasta validar utilizando aferramenta de RichSnippets 94. http://www.google.com/webmasters/tools/richsnippets 95. 8. Sitemap.XML 96. Em 2008Os grandes mecanismosde busca adotaram umpadro... 97. http://www.sitemaps.org/ 98. Este padro uma forma de informaraos mecanismos de buscaas pginas existentes emum site. 99. E o padroTem mais ou menos estacara: 100. 9. AJAX 101. Um dosGrandes problemas doGoogle ler AJAX. 102. Isto acontencePois o Googlebot umnavegador comJavascript desabilitado 103. https://developers.google.com/webmasters/ajax-crawling/ 104. De forma sequencial... 105. O GooglebotEncontra uma URL comoesta:www.example.com/page? query#!mystake 106. AssimO Google capaz de ler ocontedo que seriacarregado em AJAX. 107. 10. Flash 108. Assim como no AJAXO Google tem sriosproblemas em ler Flash. 109. http://www.pierpaulista.com.br/ 110. Olhando por cimaParece tudo bem, correto?Hummmmm.... 111. Fica a dicaSempre veja a versosomente texto. 112. Em branco... desta forma que o Googleenxerga o site em Flash. 113. E olhandoO cdigo fonte, notamos... 114. QueNunca este cdigo ser omesmo que um contedono HTML. 115. Consideraes Finais 116. Frmula mgicaPara ter sucesso, bastaimplementar... 117. Por fim...No existe mgica.Existem empresas que jimplementam... 118. Falta apenas voc. 119. Muito Obrigado!Dvidas?ContatoTwitter: @fabioricottaEmail: [email protected]: www.mestreseo.com.br