$30 off During Our Annual Pro Sale. View Details »

Javascript SEO, Solved!

Aliya
August 30, 2023

Javascript SEO, Solved!

Most common Javascript SEO issues and how to solve them

Aliya

August 30, 2023
Tweet

Other Decks in Marketing & SEO

Transcript

  1. JavaScript SEO,
    Solved!
    Aliya Mirzakhmet
    Prerender
    Speakerdeck.com/aliyamirzakhmet
    @Aliya Mirzakhmet

    View Slide

  2. Technical SEO Manager
    at an Ecommerce
    fashion brand with
    >5 million URLs
    Say hi to Alex

    View Slide

  3. The problem is...

    View Slide

  4. Their website traffic dropped a
    lot after they redesigned it in
    React

    View Slide

  5. Feels familiar?

    View Slide

  6. Raise your hand if JS gives you a
    headache

    View Slide

  7. Product Lead at Prerender
    I help businesses build products
    that solve problems
    Probably the first Kazakh 󰏱
    person you have ever met :)
    I’m Aliya

    View Slide

  8. 50billion pages 1.8billion websites
    98% built on JavaScript
    https://radixweb.com/blog/top-JavaScript-usage-statistics
    https://siteefy.com/how-many-websites-are-there/#:~:text=The%20Total%20Number%20of%20Indexed%20Web%20Pages&text=As%20of%2021%20April%202023,on%20the%20world%20wide%20web.

    View Slide

  9. https://radixweb.com/blog/top-JavaScript-usage-statistics
    https://siteefy.com/how-many-websites-are-there/#:~:text=The%20Total%20Number%20of%20Indexed%20Web%20Pages&text=As%20of%2021%20April%202023,on%20the%20world%20wide%20web.
    ~40-60% not crawled
    > 30 billion pages not indexed

    View Slide

  10. Don’t let JavaScript Ruin it
    Bigger website – less % of crawled pages

    View Slide

  11. Website Traffic
    Visibility
    Indexing
    Crawling

    View Slide

  12. The truth is simple
    Even the best things
    in the world need a way
    to be discovered

    View Slide

  13. The truth is simple
    Even the best things
    in the world need a way
    to be discovered
    crawled

    View Slide

  14. But JavaScript SEO can be
    painful…

    View Slide

  15. Limited budget
    Immediate results
    Scalable
    Customized solution
    Fix it ASAP

    View Slide

  16. JavaScript SEO
    1. Common Issues
    2. Practical Tips
    3. Solutions
    4. Summary

    View Slide

  17. Issue #1: Outdated sitemaps
    ➔ Poor SEO ranking
    ➔ User Frustration
    ➔ Missed Opportunities

    View Slide

  18. Issue #2: Large and
    Unoptimized JS Files
    https://ftf.co/technical-seo-issues/
    https://searchengineland.com/8-major-google-ranking-signals-2017-278450

    View Slide

  19. Issue #3: Missing Content

    View Slide

  20. Issue #4: Crawling Budget
    ➔ Limited
    ➔ URLs are not crawlable
    ➔ Content is not crawlable

    View Slide

  21. Results taken from Onely’s study @ https://www.onely.com/blog/google-needs-9x-more-time-to-crawl-js-than-html/
    It takes
    Google 9x
    longer to
    crawl JS
    than HTML

    View Slide

  22. Here's how Google sees your site

    View Slide

  23. Google does not
    ➔ Interact with your content
    ➔ Scroll
    ➔ See the content which is rendered only
    in a browser vs on a server

    View Slide

  24. How to fix it?

    View Slide

  25. Mission is
    possible :)

    View Slide

  26. 1. Google loves sitemaps
    Always keep your sitemaps
    updated

    View Slide

  27. 2. Optimize your JS files as
    much as you can

    View Slide

  28. 3. Use ‘HREF’ for internal
    links
    1 Anchor

    View Slide

  29. 4. Analyze Crawl Efficiency

    View Slide

  30. 5. Optimize Crawl Efficiency
    Render your pages in advance

    View Slide

  31. When bots crawl your pages, feed
    the HTML version of your pages,
    saving you plenty of crawl budget

    View Slide

  32. Solutions
    1. Server-Side Rendering
    2. Static Rendering
    3. Dynamic Rendering

    View Slide

  33. Server-Side Rendering
    ➔ Recommended by
    Google
    ➔ Great for JS
    Framework
    ➔ Fast
    ➔ Scalable based on
    your server
    capabilities
    ➔ High cost for
    Infrastructure
    ➔ Longer development
    time
    ➔ Technical knowledge
    required
    ➔ Needs maintenance

    View Slide

  34. Static Rendering
    ➔ Great for Small
    SPAs
    ➔ Easy to crawl
    ➔ Limited & Costly
    ➔ Technical knowledge
    required
    ➔ Needs maintenance

    View Slide

  35. Dynamic Rendering
    ➔ Ideal for Ecommerce,
    Enterprise sites and
    SPAs
    ➔ Easy to set up
    ➔ Fast & Scalable
    ➔ Near-zero
    development time and
    costs
    ➔ You don’t own your
    own rendering servers
    “not ideal for
    government”
    ➔ Customized features
    require additional
    development time

    View Slide

  36. Summary
    1. Keep your sitemaps always updated
    2. Optimize your JS files as much as you can
    3. Use ‘HREF’ for internal links
    4. Analyze Crawl Efficiency
    5. Render your pages

    View Slide

  37. SSR Static Rendering Dynamic Rendering
    Best for Tech companies like
    Google, Amazon
    Small SPAs
    Ecommerce,
    Enterprise sites and SPAs
    Ease of
    Implementation
    High technical knowledge
    required
    High technical knowledge
    required
    Plug-and-play
    Time to Value 1 year + 1 year + Days
    Upfront Cost
    $200k+
    (+ 100s of monthly dev
    hours)
    Based on the time needed
    to develop the static
    versions
    Near-zero development
    time and costs
    Scalability Based on your server
    capabilities
    Limited – Creating HTML
    versions for pages require
    they don’t change too
    often
    Unlimited – plus, it can
    generate pre-rendered
    versions of dynamic URLs
    on the fly

    View Slide

  38. ● $200K
    ● 5 developers
    ● Maintenance support
    Alex does not have

    View Slide

  39. Dynamic rendering could be a
    best middle ground solution

    View Slide

  40. Up to 400x improved crawling
    budget

    View Slide

  41. Which means…
    Website Traffic
    Visibility
    Indexing

    View Slide

  42. Dynamic Rendering Can
    Fix That
    JS weakened their SEO

    View Slide

  43. This is what we do at
    Prerender

    View Slide

  44. Want to know more?

    View Slide

  45. Come find us at stand 12
    near the entrance
    #brightonSEO

    View Slide

  46. Thank you!
    [email protected]
    Speakerdeck.com/aliyamirzakhmet
    @Aliya Mirzakhmet or
    #brightonSEO

    View Slide