Deliver search-friendly JavaScript-powered websites (Google I/O '18)

What people said

Recommends Liji K J · 2018-08 · Webmasters Stack Exchange · on “Does AngularJS make it more likely that URLs will be "Discovered - currently not indexed " in Google Search Console?”

For angular apps SEO is quite different. Check Deliver search-friendly JavaScript-powered websites (Google I/O '18) [this video] Google can't render JavaScript. Use fetch and render option in search console which might shows white blank pages for Angular applications. Also check with Google mobile friendliness test.

Recommends Shahzeb Qureshi · 2019-04 · Webmasters Stack Exchange · on “AngularJS based SPA page indexing”

Make sure that your SPA is being rendered by Google properly. Usually when google crawls the root page it follows the links as it finds them. To test whether your page is being rendered properly by Google, download Chromium Version 41. Follow this article on searchengineland.com Priorities for diagnosing JavaScript-powered websites [LINK] [LINK] Check for possible errors in Chromium 41 which usually comes down to adding polyfills to support older versions of browsers Make sure that your Title, Meta and Canonical tags are being rendered from the server side (recommended for Google). Please refer to this video Deliver search-friendly JavaScript-powered websites (Google I/O '18) [this video] . It is

Recommends guansunayta · 2019-05 · Stack Overflow · on “Dynamic Rendering vs Hybrid Rendering”

Both of them are methods to improving SEO by complementing the lack of handling heavy JavaScript of search engine bots. 1. Dynamic Rendering This is a workaround method to improving SEO. It just delivery static html content to crawler(robot) and stay everything the same for the users. Dynamic rendering is to detect crawlers (by checking the user agent) and give them a static html content without any JavaScript which is fully-rendered by headless browser like puppeteer [LINK] . You may need to host a rendering server like Rendertron [LINK] to deal with the rendering process described above. Advantage It didn't rely on changing your current front-end architecture. You don't need to change your

Recommends pierostz · 2019-11 · Webmasters Stack Exchange · on “What are the SEO implications of an established website shifting from server-side rendering to client side?”

What is a crucial at the upgrade you are making is to make sure that your structure remains the same and when not possible use 301 redirects from your current pages to the new ones. Doing that should not affect your page's rankings. Avoid 404s at all cost. That being said, the difference of the two-wave crawling and indexing is the speed. If your site's content must be indexed ASAP and shown as quick as possible to the SERPs (ex. like news sites), then I wouldn't choose client side framework. If this is not the case then you are good to go. I suggest watching this for more understanding on your topic. Deliver search-friendly JavaScript-powered websites [this video]

Cites Shayan Davoodi · 2018-05 · Webmasters Stack Exchange · on “Delivering a different version of website to Google robots (SSR)”

Here's what Pierre Benneton [LINK] from SEOchat found to answer my question from Deliver search-friendly JavaScript-powered websites (Google I/O '18) [this video] . In this video at 21:07, John Mueller said that what we did to serve SSR content to search engine robots is something right to do. It is called "Dynamic Rendering".

Cites Alfrex92 · 2018-07 · Stack Overflow · on “Dynamic Rendering vs Hybrid Rendering”

I watched Google's conference on SEO [this video] and they talk about Dynamic and Hybrid Rendering. But, I could not understand the difference, what is? Thank you for your time.

Cites Alfrex92 · 2018-07 · Stack Overflow · on “Difference between Next JS and Puppeteer JS”

I watched Google's conference on SEO [this video] and they suggested to use Dynamic Rendering for JS built applications (React, Vue, etc). One of the tools to achieve this is with Puppeteer JS. I need to create an app that relies heavily on SEO so Server Side Rendering (SSR) is extremely important. I know that Next JS by default accomplishes SSR, but can I do the same with Puppeteer + Create React App? What is the difference between Next JS and Puppeteer in terms of SSR and Dynamic Rendering, and which one is better for SSR?

Cites Alfrex92 · 2018-10 · Stack Overflow · on “How add noscript tag below image in PHP?”

I am using lazy loading for my images and as Google pointed out [this video] it is crucial to add a noscript tag below each img. I want to add a noscript tag below every image in the Wordpress editor , something like: <figure> <img src="img.jpg"> <nocript><img src="img.jp"></noscript> <figcaption> Caption</figcaption> <figure> But I can't :( This is my function in PHP. add_filter('the_content', function ($content) { $dom = new DOMDocument(); $dom->loadHTML($post->post_content); foreach($dom->getElementsByTagName( 'img' ) as $img) { if ( $img->hasAttribute( 'src' )) { $src_attr = $img->getAttribute( 'src' ); $noscript = $dom->createElement( 'noscript' ); $noscript_node = $img->parentNode->insertBe

Cites Alfrex92 · 2018-10 · Stack Overflow · on “How add noscript tag below image in PHP?”

No, but with I don't want to do it with JS because Google might not read it. [this video] in this conference they explain that sometimes they can't read JS. That's why I am using PHP instead of JS.

Cites Shayan Davoodi · 2018-11 · Webmasters Stack Exchange · on “SPA website, would making an HTML-only version for SEO be worthy?”

I had such experience. Our website is also built with Vue.js and we created an SSR version which will only be shown to search engine robots. This is also recommended by Google that if you want your JS client-side rendered website to be indexed (rendered ) faster by crawlers, provide an SSR version to it. It's called dynamic indexing. You can find more info here [LINK] . You can also find information about dynamic indexing here [this video] .