SEO audit fixes: docs meta/titles/H1/alt + shared redirect & structured-data (#6686)

* SEO: dedupe sitewide redirect links and fix JSON-LD in shared site package

Footer/navbar link to /blog/ and /docs/ (was /blog, /docs which 301) and FORUM_URL -> GitHub Discussions, clearing ~1400 'links to redirect' rows sitewide. pricing_jsonld drops the price-less Enterprise offer and blog_index_jsonld drops the invalid ListItem datePublished (Google rich-results / schema.org errors).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* SEO: emit complete per-page meta for docs pages

Docs pages now emit description + full Open Graph + Twitter card + canonical (previously only a title), with page-specific OG values and a /docs-prefixed trailing-slash canonical that also drives the sitemap loc. Titles lengthened and de-duplicated; descriptions auto-extracted from each page's first paragraph. Fixes Twitter-card-missing (~770), OG-incomplete (~691), meta-description-missing (~770), duplicate-without-canonical (~765), title-too-short (~549), and non-canonical/3XX-in-sitemap.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* SEO: add missing H1s, image alt text, and fix broken docs links

Add a top-level H1 to 10 docs pages that had none; add descriptive alt text to ~97 rx.image() calls across docs and to integrations-docs screenshots; repoint the dead build.reflex.dev/tokens link to /docs/hosting/tokens.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* Apply pre-commit ruff formatting to docs code blocks

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* SEO: address review — broaden numbered-list skip + bound title fallback

extract_doc_description now skips ordered-list items 1.-9. (was 1.-3.) so later numbered items aren't pulled into descriptions; the bare-title fallback is now length-checked, dropping to the unsuffixed title when even that would exceed ~60 chars.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* SEO: emit a single og:image (fix favicon + preview duplicate)

Reflex's compiler always renders one og:image from add_page's image kwarg (defaulting to favicon.ico). Pass the real preview image to add_page and strip og:image from the create_meta_tags meta list, so each page has exactly one og:image (the preview) plus one twitter:image, instead of favicon + preview. Applies to the docs renderer (reflex_docs.py) and docs landing page.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* SEO: stop frontmatter leaking into docs meta descriptions; add image alt

extract_doc_description now prefers a frontmatter description field and otherwise strips the whole --- block before scanning, so lines like 'title: Aligned Grids' or 'tags: DevTools' no longer become the meta description. Also add alt text to docs-landing and shared gallery/markdown images.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* SEO: eliminate remaining multiple-H1 and redirect-link sources

Multiple H1: demote demo rx.heading() to as_=h2 across 57 docs (164 calls), demote section-level markdown '# ' headings to '##' in 18 docs, and render the component 'API Reference' heading as h2 — each docs page now has a single H1. Redirect links: make all top-level internal links in the shared footer/navbar/sidebar trailing-slash (/docs/, /blog/, /pricing/, ...) so they no longer hit 301s. Alt text: add descriptive alt to ui.avatar.image logos/avatars in docs-landing, integration gallery, and shared gallery.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* optimize documentation rendering and add missing trailing slash

* fix canonical leading slash on some pages

---------

Co-authored-by: Alek <alek@reflex.dev>
Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
Co-authored-by: carlosabadia <cutillascarlos@gmail.com>

Author: 3 people

docs/advanced_onboarding/code_structure.md

@@ -9,7 +9,7 @@ The main app module is responsible for importing all other modules that make up
 
 **All other modules containing pages, state, and models MUST be imported by the main app module or package** for Reflex to include them in the compiled output.
 
-# Breaking the App into Smaller Pieces
+## Breaking the App into Smaller Pieces
 
 As applications scale, effective organization is crucial. This is achieved by breaking the application down into smaller, manageable modules and organizing them into logical packages that avoid circular dependencies.
 

docs/advanced_onboarding/how-reflex-works.md

@@ -55,7 +55,10 @@ The diagram below provides a detailed overview of how a Reflex app works. We'll
 
 ```python eval
 rx.el.a(
-    rx.image(src="https://web.reflex-assets.dev/other/architecture.webp"),
+    rx.image(
+        src="https://web.reflex-assets.dev/other/architecture.webp",
+        alt="Reflex app architecture diagram",
+    ),
     href="https://web.reflex-assets.dev/other/architecture.webp",
     target="_blank",
 )

docs/ai_builder/app_lifecycle/copy_app.md

@@ -12,6 +12,7 @@ def render_image():
     return rx.el.div(
         rx.image(
             src="https://web.reflex-assets.dev/ai_builder/app_lifecycle/copy_light.avif",
+            alt="Copying an app in Reflex AI Builder",
             class_name="rounded-md h-auto",
             border=f"0.81px solid {rx.color('slate', 5)}",
         ),

docs/ai_builder/app_lifecycle/deploy_app.md

@@ -18,6 +18,7 @@ def render_image():
     return rx.el.div(
         rx.image(
             src="https://web.reflex-assets.dev/ai_builder/app_lifecycle/deploy_light.avif",
+            alt="Deploying an app in Reflex AI Builder",
             class_name="rounded-md h-auto",
             border=f"0.81px solid {rx.color('slate', 5)}",
         ),

docs/ai_builder/app_lifecycle/download_app.md

@@ -13,6 +13,7 @@ def render_image():
     return rx.el.div(
         rx.image(
             src="https://web.reflex-assets.dev/ai_builder/app_lifecycle/download_light.avif",
+            alt="Downloading an app in Reflex AI Builder",
             class_name="rounded-md h-auto",
             border=f"0.81px solid {rx.color('slate', 5)}",
         ),

docs/ai_builder/app_lifecycle/fork_app.md

@@ -10,6 +10,7 @@ import reflex as rx
 rx.el.div(
     rx.image(
         src="https://web.reflex-assets.dev/ai_builder/overview/fork_template_light.avif",
+        alt="Forking an app in Reflex AI Builder",
         class_name="rounded-md h-auto",
         border=f"0.81px solid {rx.color('slate', 5)}",
     ),

docs/ai_builder/app_lifecycle/general.md

@@ -11,6 +11,7 @@ def render_image():
     return rx.el.div(
         rx.image(
             src="https://web.reflex-assets.dev/ai_builder/app_lifecycle/general_light.avif",
+            alt="General app settings in Reflex AI Builder",
             class_name="rounded-md h-auto",
             border=f"0.81px solid {rx.color('slate', 5)}",
         ),

docs/ai_builder/app_lifecycle/share_app.md

@@ -11,6 +11,7 @@ def render_image():
     return rx.el.div(
         rx.image(
             src="https://web.reflex-assets.dev/ai_builder/app_lifecycle/share_light.avif",
+            alt="Sharing an app in Reflex AI Builder",
             class_name="rounded-md h-auto",
             border=f"0.81px solid {rx.color('slate', 5)}",
         ),

docs/ai_builder/features/automated_testing.md

@@ -16,6 +16,7 @@ rx.el.div(
             "https://web.reflex-assets.dev/ai_builder/features/test_light.webp",
             "https://web.reflex-assets.dev/ai_builder/features/test_dark.webp",
         ),
+        alt="Automated testing in Reflex AI Builder",
         class_name="rounded-md h-auto",
         border=f"0.81px solid {rx.color('slate', 5)}",
     ),

docs/ai_builder/features/connect_to_github.md

@@ -16,6 +16,7 @@ The Github integration is important to make sure that you don't lose your progre
 rx.el.div(
     rx.image(
         src="https://web.reflex-assets.dev/ai_builder/connecting_to_github.avif",
+        alt="Connecting a Reflex AI Builder app to GitHub",
         class_name="rounded-md h-auto",
         border=f"0.81px solid {rx.color('slate', 5)}",
     ),
@@ -36,6 +37,7 @@ The commit history is a great way to see the changes that you have made to your
 rx.el.div(
     rx.image(
         src="https://web.reflex-assets.dev/ai_builder/github_commit_history.avif",
+        alt="GitHub commit history for a Reflex AI Builder app",
         class_name="rounded-md h-auto",
         border=f"0.81px solid {rx.color('slate', 5)}",
     ),