Se ha denunciado esta presentación.
Utilizamos tu perfil de LinkedIn y tus datos de actividad para personalizar los anuncios y mostrarte publicidad más relevante. Puedes cambiar tus preferencias de publicidad en cualquier momento.

Max Prin - TechSEO Boost 2017 - SEO Best Practices For JavaScript-Based Websites

231 visualizaciones

Publicado el

Max Prin - TechSEO Boost 2017 - SEO Best Practices For JavaScript-Based Websites

Publicado en: Tecnología
  • Sé el primero en comentar

Max Prin - TechSEO Boost 2017 - SEO Best Practices For JavaScript-Based Websites

  1. 1. Max Prin | @maxxeight #TechSEOBoost SEO Best Practices For JavaScript-Based Websites How to make sure search engines can “understand” your website
  2. 2. Max Prin | @maxxeight #TechSEOBoost
  3. 3. Max Prin | @maxxeight #TechSEOBoost How (Advanced) Search Engines Work Render “Understanding web pages better”
  4. 4. Max Prin | @maxxeight #TechSEOBoost Rendering On Google Search Googlebot uses a web rendering service (WRS) that is based on Chrome 41 (M41). However: • Some features and APIs, such as IndexedDB or Service Workers, are disabled. • The Search team is working on updating the WRS so it’s always based on the latest available Chrome version.
  5. 5. Max Prin | @maxxeight #TechSEOBoost Web Development Technologies
  6. 6. Max Prin | @maxxeight #TechSEOBoost No page title No content Etc.
  7. 7. Max Prin | @maxxeight #TechSEOBoost It’s in the DOM!
  8. 8. Max Prin | @maxxeight #TechSEOBoost HOWEVER…
  9. 9. Max Prin | @maxxeight #TechSEOBoost HOWEVER… • Unique URL (SPA) • Unique HTML document (with duplicated <head> section) • Blocked resources • Links structure • Rendering delays • User interactions • JavaScript errors • Etc.
  10. 10. Max Prin | @maxxeight #TechSEOBoost CRAWLING
  11. 11. Max Prin | @maxxeight #TechSEOBoost URL Structure Fragment Identifier: example.com/#url Hashbang: example.com/#!url (pretty URL) • Google and Bing will request: example.com/?_escaped_fragment_=url (ugly URL) • The escaped_fragment URL should return an HTML snapshot
  12. 12. Max Prin | @maxxeight #TechSEOBoost AJAX-Crawling Scheme • Change URL structure: example.com/#url example.com/#!url • Google and Bing would request: example.com/?_escaped_fragment_=url • Server would return an HTML snapshot • Google and Bing index example.com/#!url with content from example.com/?_escaped_fragment_=url • Google has deprecated this recommendation in October 2015 • Won’t be supported by ~Q2 2018
  13. 13. Max Prin | @maxxeight #TechSEOBoost URL Structure Fragment Identifier: example.com/#url Hashbang: example.com/#!url (pretty URL) • Google and Bing will request: example.com/?_escaped_fragment_=url (ugly URL) • The escaped_fragment URL should return an HTML snapshot Clean URL: example.com/url • Leveraging the pushState function of the History API
  14. 14. Max Prin | @maxxeight #TechSEOBoost Internal Linking onclick + window.location ≠ <a href=”link.html”>
  15. 15. Max Prin | @maxxeight #TechSEOBoost RENDERING
  16. 16. Max Prin | @maxxeight #TechSEOBoost Blocked Resources (robots.txt)
  17. 17. Max Prin | @maxxeight #TechSEOBoost Content Loading
  18. 18. Max Prin | @maxxeight #TechSEOBoost Content Loading
  19. 19. Max Prin | @maxxeight #TechSEOBoost HTML Snapshots (“pre-rendering”) AJAX-crawling scheme User-agent (bot) detection Hybrid rendering / Isomorphic JavaScript
  20. 20. Max Prin | @maxxeight #TechSEOBoost INDEXING
  21. 21. Max Prin | @maxxeight #TechSEOBoost Main content gets rendered here Same title, description, canonical tag, etc. for every URL Duplicated Meta Info Across URLs
  22. 22. Max Prin | @maxxeight #TechSEOBoost TOOLS
  23. 23. Max Prin | @maxxeight #TechSEOBoost Google Search Console – Fetch & Render
  24. 24. Max Prin | @maxxeight #TechSEOBoost TechnicalSEO.com – Fetch & Render
  25. 25. Max Prin | @maxxeight #TechSEOBoost SEO Crawlers
  26. 26. Max Prin | @maxxeight #TechSEOBoost Chrome Dev Tools: Console - Lighthouse
  27. 27. Max Prin | @maxxeight #TechSEOBoost THANK YOU! @maxxeight

×