Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
#pubcon@badams
JavaScript & SEO
Presented by:
Barry Adams
Polemic Digital
#pubcon@badams
Barry Adams
 Doing SEO since 1998
 Founder of Polemic Digital
 Co-Chief at State of Digital
#pubcon@badams
JavaScript
#pubcon@badams
Two Types of JS*
• JavaScript that enhances HTML and CSS;
– Adds functionality, improves user experience
– ...
#pubcon@badams
How Search Engines Work
#pubcon@badams
Web Search Engines
Three distinct processes:
1. Crawler 2. Indexer 3. Query Engine
Technical SEO
#pubcon@badams
#pubcon@badams
JavaScript & Crawling
#pubcon@badams
Web Crawler (Googlebot)
• Spiders the web;
– URLs from previous crawls and XML sitemaps
• Extracts hyperlin...
#pubcon@badams
Elements of a Web Crawler
• Crawl ‘Politeness’
– How fast can we crawl a site?
• URL Importance
– How often...
#pubcon@badams
Crawler: HTML Parser
#pubcon@badams
URLs are Sacred
• Search Engines don’t crawl, index, rank pages or
content…
• They crawl, index, and rank U...
#pubcon@badams
JavaScript & Crawling
• Googlebot does not render webpages
– The indexer (Caffeine) does
• JavaScript is no...
#pubcon@badams
JavaScript & Crawling
No Hyperlinks!
#pubcon@badams
Crawl Inefficiency
#pubcon@badams
#pubcon@badams
JavaScript & Indexing
#pubcon@badams
Indexer (Caffeine)
• Analyses content
• Analyses links
• Analyses webpage layout
• Can be influenced with r...
#pubcon@badams
Elements of the Indexer
• Canonicalisation
– Determines the canonical URL
• Web Rendering Service
– Renders...
#pubcon@badams
Web Rendering Service
https://developers.google.com/search/docs/guides/rendering
#pubcon@badams
Web Rendering Service
• Rendering engine: Chrome 41
• Stateless (no cookies)
• Does not perform any actions
#pubcon@badams
PageRanker
• Calculates each canonical page’s PageRank;
– Links, links, links
– Internal and external links...
#pubcon@badams
JavaScript & Indexing
• Google will index content embedded in JavaScript
– Only if no action required!
• Li...
#pubcon@badams
#pubcon@badams
Fetch & Render
#pubcon@badams
Fetch
#pubcon@badams
Fetch & Render
#pubcon@badams
Fetch & Render
• Fetch = Googlebot (crawler)
• Fetch & Render = Caffeine (indexer)
#pubcon@badams
#pubcon@badams
https://goralewicz.com/blog/javascript-seo-experiment/
#pubcon@badams
https://moz.com/blog/search-engines-ready-for-javascript-crawling
#pubcon@badams
Log File Analysis & JavaScript
#pubcon@badams
Log File Analysis & JavaScript
• Find pages that are rarely/never crawled
– Improve internal linking with p...
#pubcon@badams
Summarised: JavaScript & SEO
#pubcon@badams
Summarised: JavaScript & SEO
• Googlebot (crawler) doesn’t crawl JavaScript
• Caffeine (indexer) executes a...
#pubcon@badams
Summarised: JavaScript & SEO
• JavaScript should *enhance* HTML & CSS
– Never replace it
• Links embedded i...
#pubcon@badams
Thank You
Follow me on Twitter:
@badams
Email me your questions:
barry@polemicdigital.com
Upcoming SlideShare
Loading in …5
×

JavaScript & SEO, The Real Problems - #Pubcon

15,466 views

Published on

Slides from my talk at Pubcon Las Vegas in November 2017, where I spoke about the issues with JavaScript platforms and SEO.

Published in: Internet

JavaScript & SEO, The Real Problems - #Pubcon

  1. 1. #pubcon@badams JavaScript & SEO Presented by: Barry Adams Polemic Digital
  2. 2. #pubcon@badams Barry Adams  Doing SEO since 1998  Founder of Polemic Digital  Co-Chief at State of Digital
  3. 3. #pubcon@badams JavaScript
  4. 4. #pubcon@badams Two Types of JS* • JavaScript that enhances HTML and CSS; – Adds functionality, improves user experience – Little to no impact on SEO • JavaScript that replaces HTML and CSS; – Turns webpages in to web apps – Destructive for SEO *According to me
  5. 5. #pubcon@badams How Search Engines Work
  6. 6. #pubcon@badams Web Search Engines Three distinct processes: 1. Crawler 2. Indexer 3. Query Engine Technical SEO
  7. 7. #pubcon@badams
  8. 8. #pubcon@badams JavaScript & Crawling
  9. 9. #pubcon@badams Web Crawler (Googlebot) • Spiders the web; – URLs from previous crawls and XML sitemaps • Extracts hyperlinks and adds to crawl queue • Retrieves new and changed content • Access can be restricted with robots.txt
  10. 10. #pubcon@badams Elements of a Web Crawler • Crawl ‘Politeness’ – How fast can we crawl a site? • URL Importance – How often do we need to recrawl a URL? • HTML Parser – Can we find links in the crawled URL?
  11. 11. #pubcon@badams Crawler: HTML Parser
  12. 12. #pubcon@badams URLs are Sacred • Search Engines don’t crawl, index, rank pages or content… • They crawl, index, and rank URLs. • One piece of content = one URL – Many JS platforms ignore this foundational aspect of the web
  13. 13. #pubcon@badams JavaScript & Crawling • Googlebot does not render webpages – The indexer (Caffeine) does • JavaScript is not executed by the Googlebot crawler – Any links embedded in JavaScript are not found by the crawler
  14. 14. #pubcon@badams JavaScript & Crawling No Hyperlinks!
  15. 15. #pubcon@badams Crawl Inefficiency
  16. 16. #pubcon@badams
  17. 17. #pubcon@badams JavaScript & Indexing
  18. 18. #pubcon@badams Indexer (Caffeine) • Analyses content • Analyses links • Analyses webpage layout • Can be influenced with robots meta tags
  19. 19. #pubcon@badams Elements of the Indexer • Canonicalisation – Determines the canonical URL • Web Rendering Service – Renders webpages as a browser would (Chrome 41) • PageRanker – Calculates a URL’s PageRank
  20. 20. #pubcon@badams Web Rendering Service https://developers.google.com/search/docs/guides/rendering
  21. 21. #pubcon@badams Web Rendering Service • Rendering engine: Chrome 41 • Stateless (no cookies) • Does not perform any actions
  22. 22. #pubcon@badams PageRanker • Calculates each canonical page’s PageRank; – Links, links, links – Internal and external links both count – PageRank Damping factor • Feeds back to the crawler; – High PR = high crawl priority
  23. 23. #pubcon@badams JavaScript & Indexing • Google will index content embedded in JavaScript – Only if no action required! • Links embedded in JS can be extracted – Processed within Caffeine – Added to the Crawler’s queue
  24. 24. #pubcon@badams
  25. 25. #pubcon@badams Fetch & Render
  26. 26. #pubcon@badams Fetch
  27. 27. #pubcon@badams Fetch & Render
  28. 28. #pubcon@badams Fetch & Render • Fetch = Googlebot (crawler) • Fetch & Render = Caffeine (indexer)
  29. 29. #pubcon@badams
  30. 30. #pubcon@badams https://goralewicz.com/blog/javascript-seo-experiment/
  31. 31. #pubcon@badams https://moz.com/blog/search-engines-ready-for-javascript-crawling
  32. 32. #pubcon@badams Log File Analysis & JavaScript
  33. 33. #pubcon@badams Log File Analysis & JavaScript • Find pages that are rarely/never crawled – Improve internal linking with plain <a href> links • Compare URLs crawled by Googlebot vs Bingbot – Bingbot doesn’t render JavaScript (much)
  34. 34. #pubcon@badams Summarised: JavaScript & SEO
  35. 35. #pubcon@badams Summarised: JavaScript & SEO • Googlebot (crawler) doesn’t crawl JavaScript • Caffeine (indexer) executes and indexes JavaScript Further reading: http://www.stateofdigital.com/javascript-seo-crawling-indexing/
  36. 36. #pubcon@badams Summarised: JavaScript & SEO • JavaScript should *enhance* HTML & CSS – Never replace it • Links embedded in JavaScript do pass PageRank – Crawl inefficiency = low crawl rate • Pages relying on JS don’t rank well – Compared to pages that don’t rely on JS
  37. 37. #pubcon@badams Thank You Follow me on Twitter: @badams Email me your questions: barry@polemicdigital.com

×