This document discusses JavaScript SEO and provides best practices. It begins by noting many websites are not ready to handle the responsibilities that come with powerful JavaScript frameworks. It then discusses issues like partial indexing for sites relying heavily on client-side JavaScript rendering. The document provides tips on troubleshooting JavaScript indexing issues using the Google Search Console. It also emphasizes the importance of server-side rendering and principles like progressive enhancement. Overall, the key message is that while challenges remain, there is hope for properly optimized client-side rendered JavaScript sites to rank well in Google with continued improvements to crawler and rendering capabilities.
3. With the great power of JavaScript
frameworks, comes great responsibility.
4. It seems that most
webmasters aren’t
ready to handle it
yet.
5. 97.6%* of JavaScript powered websites have
no clue about JavaScript SEO
*not based on any calculations.
6. Let’s go back in time to 2016
The giant panda is no longer
endangered
North Korea says it tested a
nuclear warhead
Britain votes to leave
the European Union
BREXIT
7. Let’s go back in time to 2016
Donald Trump winspanda is no longer
ndangered
Hulu is losing 56% of their
visibility
8.
9. Statement
I am sick and tired of Hulu as an example but it’s hard
to find another website this bad. If you work @ Hulu,
please contact me, I’ll help you guys out for free!
137. Prerendering/Dynamic Rendering issues
1. Computing power – A LOT of servers
2. Prone to issues (often load related)
3. Downtime = ranking loss
4. More complex and difficult from an SEO perspective (crawls, 2 sets
of code, etc.)
5. Requires a lot of SEO knowledge
6. Requires a great dev team to make it run smoothly
162. And this effectively means that if
your site is using a heavy amount of
client-side JavaScript for rendering,
you could be tripped up at times
when your content is being indexed
due to the nature of this two phase
indexing process.
…it’s possible some details might be
missed.
Tom Greenaway
163. 2 waves
WAVE 1 WAVE 2
• JS dependent
content only
• HTML content
• Canonicals
• Meta data
• HTTP Codes
184. To Do:
1. Diff Check is your new best friend
2. Experiment and make sure to monitor
your server logs
3. Compare your setup with Chrome 41
4. Make sure that your content is indexed
in Google
5. Under the right URL
188. …but proved to be the most
difficult question you can
ask your developer.
…it contained only 1
question…
…We’ve created what will be
remembered as the world’s
most confusing JavaScript
survey ever.
202. Right now Google isn’t perfect with
client rendered Single Page Apps.
This means they will crawl and index
all JavaScript pages even better and faster.
According to Ilya Grigorik, this should happen
sometime in 2018 (most likely).
Google is working on a new WRS engine –
most likely headless Chrome 59.
Sometimes – yes we are. Usually - not really.
Usually this is when real problems begin.
Next steps may sound like a funny part of this presentation but they are based on conversations with C-level people from VERY large brands…
g.co/MobileFriendly
Hulu.com vs. Netflix.com
I think this is particularly interesting and worth exploring, especially in terms of audience enjoyment. I suspect most people would think that these two giants have it all figured out and this graph reveals something far more complicated. PLUS: CHAOS!
Source Code (before JavaScript): Disqus; The #1 way to build your audience
Rendered website: Disqus - The #1 way to build an audience on your website
Example urls that don’t render in Google bot
https://angular.io/guide/language-service
https://angular.io/guide/security
https://angular.io/guide/architecture
https://angular.io/api/animations/group
https://angular.io/guide/quickstart
Example urls that do render in Google bot
https://angular.io
https://angular.io/events
https://angular.io/api
https://angular.io/resources
https://angular.io/about?group=Angular
Example urls that don’t render in Google bot
https://angular.io/guide/language-service
https://angular.io/guide/security
https://angular.io/guide/architecture
https://angular.io/api/animations/group
https://angular.io/guide/quickstart
Example urls that do render in Google bot
https://angular.io
https://angular.io/events
https://angular.io/api
https://angular.io/resources
https://angular.io/about?group=Angular
Example urls that don’t render in Google bot
https://angular.io/guide/language-service
https://angular.io/guide/security
https://angular.io/guide/architecture
https://angular.io/api/animations/group
https://angular.io/guide/quickstart
Example urls that do render in Google bot
https://angular.io
https://angular.io/events
https://angular.io/api
https://angular.io/resources
https://angular.io/about?group=Angular
The only thing that pages that do vs do not work have in common is the number of path segments in the url. Single path segment seems to work, multiple don't work. I don't know if this is just a coincidence or not.
Just to be clear: all of these urls were indexable in the past, so something in aio or in google bot must have changed to cause this regression.
Author: https://github.com/IgorMinar
Example urls that don’t render in Google bot
https://angular.io/guide/language-service
https://angular.io/guide/security
https://angular.io/guide/architecture
https://angular.io/api/animations/group
https://angular.io/guide/quickstart
Example urls that do render in Google bot
https://angular.io
https://angular.io/events
https://angular.io/api
https://angular.io/resources
https://angular.io/about?group=Angular
Read more @ ele.ph/flights
Zoom na 7 wynikow + elephate na 2gim miejscu
It’s going to get geeky!
JavaScript bytes vs. JPG bytes
~200 KB of JavaScript = 4 seconds to process
~200 KB of JPG – 0.065 second to process
Have your own cryptocurrency and JS framework!
This joke needs work but has a lot of potential (I hope)
Backbone
Ember
Aurelia
Elm
Inferno
Polymer
Preact
ReasonML
Svelte
Add logos of each
JavaScript = tens of different frameworks x different configurations of those frameworks x Transpiling x inline vs. external etc.
Top #1 for everything in India
Bra, Watches, Shoe, online shopping, chinos, dresses, jeans, kids wear, footwear and hundreds of thousands of other keywords (!)
Top #1 for everything in India
Bra, Watches, Shoe, online shopping, chinos, dresses, jeans, kids wear, footwear and hundreds of thousands of other keywords (!)
tego slajdu nie usuwaj - wygląda tak samo jak poprzedni, ale to jest druga część video
g.co/MobileFriendly
Wave 1 Wave 2
HTML content JS dependent content only
Canonicals
Meta data
HTTP Codes
Hulu.com/casual
Let me prove it.
…. We’ve created what will be remembered as the world most confusing JavaScript survey ever.
Right now Google isn’t perfect with client rendered Single Page Apps.
BUT
Google is working on a new WRS engine – most likely headless Chrome 59.
This means they will crawl and index all JavaScript pages even better and faster.
According to Ilya Grigorik, this should happen sometime in 2018 (most likely).
Right now Google isn’t perfect with client rendered Single Page Apps.
BUT
Google is working on a new WRS engine – most likely headless Chrome 59.
This means they will crawl and index all JavaScript pages even better and faster.
According to Ilya Grigorik, this should happen sometime in 2018 (most likely).
Right now Google isn’t perfect with client rendered Single Page Apps.
BUT
Google is working on a new WRS engine – most likely headless Chrome 59.
This means they will crawl and index all JavaScript pages even better and faster.
According to Ilya Grigorik, this should happen sometime in 2018 (most likely).
If you want to join me and see the next steps and adventure, follow me @ Twitter:
@bart_Goralewicz
or simply say hi at Bartosz@Goralewicz.com