SEO Best Practices for Dyamic Pages in AEM | Community
Skip to main content
chavad
Level 2
November 4, 2024
Solved

SEO Best Practices for Dyamic Pages in AEM

  • November 4, 2024
  • 2 replies
  • 685 views

Hey All, 

We have many components that load dynamically rendering through react in front-end. These don't have markup in slightly as it is generated dynamically via react code based on the scenario. How can we make these pages SEO indexable? Does keeping dummy markup in HTL files help? Any other suggestions?

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by daniel-strmecki

Hi @chavad,

keeping dummy markup in HTL files will indeed help, but a better solution would be to deliver fully rendered content to SEO robots. This can be done using third-party pre-rendering services, such as Prerender.io, or building it yourself with Node.js.

 

In case you want to build it custom, you first need to detect bots with user-agent on the CDN level and redirect them to your Node.js application. Puppeteer is a popular library that can open a headless instance of Chrome, load the page, and wait for it to fully render before capturing the HTML. Then you can return fully rendered HTML to bots.

 

Good luck,

Daniel

2 replies

Level 3
November 4, 2024
daniel-strmecki
Community Advisor and Adobe Champion
daniel-strmeckiCommunity Advisor and Adobe ChampionAccepted solution
Community Advisor and Adobe Champion
November 4, 2024

Hi @chavad,

keeping dummy markup in HTL files will indeed help, but a better solution would be to deliver fully rendered content to SEO robots. This can be done using third-party pre-rendering services, such as Prerender.io, or building it yourself with Node.js.

 

In case you want to build it custom, you first need to detect bots with user-agent on the CDN level and redirect them to your Node.js application. Puppeteer is a popular library that can open a headless instance of Chrome, load the page, and wait for it to fully render before capturing the HTML. Then you can return fully rendered HTML to bots.

 

Good luck,

Daniel

Tethich
Community Advisor
Community Advisor
November 5, 2024

Two small thoughts here, if you allow me.

1. Useful package for achieving SSR using node.js is ReactDOMServer

2. We need to pay attention to React lazy loading, in case it is used. Too much of it can affect SEO.