Skip to content

docs(plotly): optimize page for Plotly Python SEO terms#6702

Closed
Alek99 wants to merge 2 commits into
mainfrom
claude/plotly-seo-ranking-h6vuuy
Closed

docs(plotly): optimize page for Plotly Python SEO terms#6702
Alek99 wants to merge 2 commits into
mainfrom
claude/plotly-seo-ranking-h6vuuy

Conversation

@Alek99

@Alek99 Alek99 commented Jul 2, 2026

Copy link
Copy Markdown
Member

All Submissions:

  • Have you followed the guidelines stated in CONTRIBUTING.md file?
  • Have you checked to ensure there aren't any other open Pull Requests for the desired changed?

Type of change

  • This change requires a documentation update

Description

The Plotly docs page (docs/library/graphing/other-charts/plotly/) currently ranks for essentially nothing β€” Ahrefs shows a single keyword ("reflex charts", volume 10). This reframes it as the canonical "interactive Plotly charts in Python" example hub to capture winnable long-tail terms, rather than chasing the branded head term "plotly python" (whose SERP is locked up by plotly.com's own docs + GitHub).

On-page SEO changes to docs/library/graphing/other-charts/plotly.md:

  • Added a frontmatter description β€” the page previously had none and fell back to generic boilerplate for its meta description.
  • Rewrote the H1 to Plotly in Python: Interactive Charts with Reflex, so the auto-generated <title> (built in docpage.py) carries "Python" and intent terms instead of the bare Plotly Β· Other Charts Β· Reflex Docs.
  • Added a keyword-rich intro paragraph covering Plotly / Python / interactive / web app.
  • Renamed sections to match chart-type queries (Line Chart, 3D Surface Plot) and added Scatter Plot and Histogram example sections targeting low-difficulty terms (KD 1–3).

Target keywords (from Ahrefs): python interactive charts (KD 14, the term Reflex can realistically win), plus the chart-type long tail β€” plotly line chart (KD 1), plotly scatter plot python (KD 2), plotly 3d surface plot (KD 3), plotly histogram python.

Notes for reviewers

  • The two new demo blocks (Scatter Plot, Histogram) use canonical Plotly Express APIs (px.data.iris(), px.data.tips(), px.scatter, px.histogram) mirroring the existing gapminder examples. I was unable to execute them in the CI-less authoring environment, so please confirm they render with a local docs run before merge.
  • Docs-only change: no framework code, components, or .pyi stubs affected.

πŸ€– Generated with Claude Code

https://claude.ai/code/session_01PbVJc3WvEpK4QRXPxiVc2M


Generated by Claude Code

Reframe the Plotly doc as the canonical "interactive Plotly charts in
Python" example hub to capture winnable long-tail terms instead of the
branded "plotly python" head term (locked up by plotly.com).

- Add a frontmatter meta description (page previously had none).
- Rewrite the H1 to include "Plotly in Python" and "Interactive Charts"
  so the generated <title> carries intent terms.
- Add a keyword-rich intro paragraph.
- Rename sections to match chart-type queries (Line Chart, 3D Surface
  Plot) and add Scatter Plot and Histogram example sections targeting
  low-difficulty terms (KD 1-3).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01PbVJc3WvEpK4QRXPxiVc2M
@greptile-apps

greptile-apps Bot commented Jul 2, 2026

Copy link
Copy Markdown
Contributor

Greptile Summary

This PR is a docs-only SEO optimization of the Plotly charting page. It adds a frontmatter description, rewrites the H1 and intro paragraph with keyword-rich language targeting long-tail Plotly/Python search terms, renames two existing sections, and adds Scatter Plot and Histogram demo blocks using canonical plotly.express APIs.

  • The new scatter_plot and histogram demo code blocks define df and fig at module scope (outside the component function), consistent with the pattern used by every other static example on the page.
  • Section renames (Basic Example β†’ Line Chart, 3D graphing example β†’ 3D Surface Plot) and the new intro paragraph are straightforward copy changes with no code impact.
  • The PR author notes these two new demo blocks were not locally executed before submission; reviewers should confirm rendering with a local docs run.

Confidence Score: 5/5

Safe to merge after a local docs render verification of the two new demo blocks.

The change touches a single Markdown file with no framework code, component definitions, or .pyi stubs. The two new demo code blocks use well-established plotly.express built-in datasets (px.data.iris(), px.data.tips()) and follow the exact same module-scope variable pattern already used by every other static example on the page. The only open item β€” confirmed by the author β€” is that the new blocks were not executed locally before submission, so a quick local docs run to verify rendering is the one remaining step before merge.

No files require special attention; the author recommends a local docs run to verify the two new demo blocks render correctly.

Important Files Changed

Filename Overview
docs/library/graphing/other-charts/plotly.md Docs-only SEO rewrite: adds frontmatter description, rewrites H1, expands intro, renames sections, and adds Scatter Plot and Histogram demo blocks using standard plotly.express APIs at module scope.

Reviews (2): Last reviewed commit: "docs(plotly): hoist demo df/fig to modul..." | Re-trigger Greptile

Comment thread docs/library/graphing/other-charts/plotly.md
Comment thread docs/library/graphing/other-charts/plotly.md
@Alek99 Alek99 requested a review from carlosabadia July 2, 2026 20:53
Address Greptile review: build df/fig at module scope in the new
Scatter Plot and Histogram demos so data is constructed once at page
load, matching the pattern used by every other example on the page.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01PbVJc3WvEpK4QRXPxiVc2M
@codspeed-hq

codspeed-hq Bot commented Jul 2, 2026

Copy link
Copy Markdown

Merging this PR will not alter performance

βœ… 26 untouched benchmarks
⏩ 8 skipped benchmarks1


Comparing claude/plotly-seo-ranking-h6vuuy (fa9fd0d) with main (4c63f00)

Open in CodSpeed

Footnotes

  1. 8 benchmarks were skipped, so the baseline results were used instead. If they were deleted from the codebase, click here and archive them to remove them from the performance reports. ↩

@Alek99 Alek99 marked this pull request as ready for review July 2, 2026 20:55
@Alek99 Alek99 requested a review from a team as a code owner July 2, 2026 20:55
Alek99 pushed a commit that referenced this pull request Jul 2, 2026
#6702 (an earlier Plotly-only SEO PR) overlaps this PR on plotly.md and is a
subset of it, except for a stronger, keyword-rich H1 and a richer intro.
Adopt those here so this PR fully supersedes #6702:

- H1: "Plotly" -> "Plotly in Python: Interactive Charts with Reflex"
- Intro rewritten to lead with the Plotly link, name the figure types, and
  note the no-JavaScript / live-state angle.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Ez43BK9AhhMPMdRcFmMEPR

Alek99 commented Jul 2, 2026

Copy link
Copy Markdown
Member Author

Closing in favor of #6703, which supersedes this PR. #6703 is the broader graphing-docs SEO pass and now includes everything unique from here β€” I folded in this PR's stronger H1 (Plotly in Python: Interactive Charts with Reflex) and richer intro, on top of the full Plotly Express example gallery (bar, scatter, pie, heatmap, histogram, box plot) and the meta-description infrastructure that actually wires a page-specific <meta description> through (which this PR's description: frontmatter needs to take effect).

Nothing is lost by closing here. πŸ™


Generated by Claude Code

@Alek99 Alek99 closed this Jul 2, 2026
carlosabadia pushed a commit that referenced this pull request Jul 3, 2026
* docs: improve SEO for graphing chart pages

The graphing chart docs (Recharts-based) target high-value, low-difficulty
terms β€” "recharts" (8.4K US/mo, KD 5), "recharts bar/line/area/pie chart"
(KD ~0), where the pages already ranked page 1 but with weak on-page signals.

Two structural gaps hurt every chart page:

- Library docs render via `multi_docs`, which never passed a `description`,
  so every chart (and every other component doc) inherited the generic
  site-wide meta description. `handle_library_doc` now derives a page-specific
  meta description from the doc's frontmatter/body via `extract_doc_description`
  and threads it through `multi_docs` -> `docpage`.
- Titles came from the title-cased filename, rendering "Barchart" instead of
  "Bar Chart". Docs now honor an explicit frontmatter `title:` for a clean,
  keyword-rich page title (and sidebar label).

Each chart page gains a `title:` and a keyword-rich `meta_description:`
(Recharts + Python + chart type), and the intro prose mentions Reflex,
Recharts, and pure Python naturally. The Plotly and Pyplot pages get the same
treatment (pyplot targets "pyplot", 1.5K/mo).

Adds `meta_description`/`description` to the docgen frontmatter known-keys so
they aren't misparsed as component-preview lambdas, with regression tests.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Ez43BK9AhhMPMdRcFmMEPR

* docs: target general graphing terms and high-value synonyms in chart docs

Broaden the chart docs beyond "recharts X chart" to the general graphing
terms people actually search, and fix term mismatches surfaced by keyword
data:

- Scatter page now leads with "scatter plot" (31K/mo) alongside "scatter
  chart" β€” the page was titled for the less-searched phrasing.
- Pie page calls out "donut chart" (1.9K/mo, KD 3) in the intro.
- Radar page calls out its "spider chart" synonym (radar chart's parent
  topic in Ahrefs).
- Plotly meta description now names the winnable Plotly long-tail
  (Plotly Express, heatmaps, histograms) rather than the KD 47-57 head.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Ez43BK9AhhMPMdRcFmMEPR

* docs: add Plotly Express chart examples targeting winnable Plotly terms

The Plotly page ranked for essentially nothing (only "reflex charts", vol 10)
despite a cluster of low-difficulty Plotly Express terms β€” plotly express
(450, KD 12), plotly heatmap (250, KD 2), plotly scatter plot (200, KD 8),
plotly bar chart (150, KD 4), plotly pie chart (90, KD 2). The page only
demonstrated a line chart, a 3D surface, and state usage, so it had no on-page
content matching those queries.

Add a "Plotly Express Chart Types" section with runnable bar, scatter, pie,
and heatmap examples (offline px.data datasets), giving the page keyword-aligned
headings and code for the terms above.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Ez43BK9AhhMPMdRcFmMEPR

* docs: add Plotly histogram and box plot examples

Research surfaced two more winnable, Plotly-native terms with no matching
on-page content: histogram python (1.1K/mo, KD 11, traffic potential 11K)
and box plot python (KD 22). Add px.histogram and px.box examples to the
Plotly Express section.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Ez43BK9AhhMPMdRcFmMEPR

* docs: cross-link chart pages to fix near-zero internal linking

Per-page SEO audit found 6 of 10 chart docs had no internal links and the
rest had only one, so the sibling pages passed no anchor-text signal or link
authority to each other. Add a keyword-anchored "Related Charts" section
(3 related chart types each) to every chart page that lacked cross-links.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Ez43BK9AhhMPMdRcFmMEPR

* docs: expand thin chart pages (composed, error bar, radial bar)

The per-page SEO audit flagged three pages as too thin to rank well
(94/122/175 words of prose). Deepen each with explanation and, where useful,
a second worked example:

- Composed Chart: add "When to Use" guidance and a dual-axis bar+line example
  (y_axis_id), plus a Related Charts section.
- Error Bar: explain symmetric vs asymmetric [low, high] errors and the
  direction prop, and add an error-bars-on-a-line-chart example.
- Radial Bar Chart: de-duplicate the definition and add a "When to Use"
  section covering inner/outer radius, start/end angle, min_angle, background.

All added demo blocks use valid Recharts APIs (Line accepts ErrorBar; Bar/Line
support y_axis_id) and parse cleanly.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Ez43BK9AhhMPMdRcFmMEPR

* docs: fix chart sidebar labels to use frontmatter titles

The sidebar labelled chart pages from the filename key via get_display_name,
so single-word filenames rendered as "Areachart", "Composedchart", etc. β€”
the frontmatter title fix only reached the page <title>, not the nav, because
the sidebar reads clist[0] (also used to build the URL).

Record each doc's frontmatter title in a filename-keyed map and have the
sidebar prefer it for the label while still deriving the link from the
filename. Sidebar now shows "Area Chart", "Composed Chart", etc., with URLs
unchanged.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Ez43BK9AhhMPMdRcFmMEPR

* docs: target high-traffic chart variant keywords (stacked, gauge, combo, react)

Keyword research surfaced high-volume, low-difficulty terms that map to
existing Recharts features but had no on-page content:

- Bar chart: add a Stacked Bar Chart example (stack_id) targeting "stacked
  bar chart" (5.4K/mo, KD 0) plus "segmented"/"100 stacked"; note grouped/
  clustered on the multiple-bars section and horizontal on the vertical-layout
  section ("grouped bar chart" 1.1K, "clustered" 1.3K, "horizontal" 1.2K).
- Radial bar: frame the half-circle example as a gauge chart ("gauge chart"
  2.8K/mo, KD 6).
- Area: rename the stacking section to "Stacked Area Chart" ("stacked area
  chart" 1K, KD 5).
- Composed: note the "combo chart" synonym (600/mo).
- Line: note "multi-line chart".
- All chart pages: describe Recharts as "a React charting library" so the
  pages also match react bar/line/pie chart intent (Reflex compiles to React).

Bar and radial-bar meta descriptions updated with the new terms. All demo
blocks parse and frontmatter is valid YAML.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Ez43BK9AhhMPMdRcFmMEPR

* docs: add Treemap page and bubble chart example

Two more high-traffic, on-Recharts opportunities with no existing content:

- Bubble chart (5.5K/mo, KD 14): a scatter chart with a z_axis controlling
  point size. Add a "Bubble Chart" example to the scatter page and mention it
  in the meta description.
- Treemap (rx.recharts.treemap ships in Reflex but had no doc page): new
  treemap.md targeting "treemap chart" (1K/mo, KD 28) / "python treemap",
  with a simple example and an aspect_ratio example.

Verified rx.recharts.z_axis (data_key + range) and ScatterChart's valid
children include ZAxis; Treemap exposes data/data_key/name_key/aspect_ratio.
All demo blocks parse and frontmatter is valid YAML.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Ez43BK9AhhMPMdRcFmMEPR

* docs: add SEO-optimized graphing overview page at /graphing/general/

The /library/graphing/general/ URL had no backing content β€” the sidebar's
"Overview" link pointed at an unbacked route. Add a real overview page there,
targeting category terms (python data visualization, python charts, python
dashboard, recharts) and acting as an internal-linking hub to every chart
type, the general customization components, and the Plotly/Pyplot pages.

Library section index.md files are now excluded from handle_library_doc (they
were being mis-registered as components, which would add a stray sidebar item
with a broken link) and render as normal docs instead, matching how the
enterprise section index pages already work. A manual title gives the page a
keyword-rich <title>.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Ez43BK9AhhMPMdRcFmMEPR

* fix: resolve CI failures on graphing/charts SEO

- Duplicate route: the section root /library/graphing/general/ is already
  served by the create_previews gallery page, so the new index.md collided
  (test_unique_routes). Remove index.md and its routing bypass; instead give
  the existing preview pages real meta descriptions by passing `description`
  into their docpage, clean up their <title>, and make the charts/general/
  other-charts descriptions keyword-rich (python charts, data visualization,
  recharts, plotly, matplotlib).
- changelog: add a news fragment for the reflex-docgen parser fix.

Also addresses two review comments (same as #6704): low-level docpages no
longer emit a duplicate meta description, and multi_docs reuses the source
already read in handle_library_doc instead of re-reading the file.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Ez43BK9AhhMPMdRcFmMEPR

* fix: satisfy pyright in docgen frontmatter test

fm.metadata is typed Mapping[str, object]; coerce the value to str before
calling .startswith so pyright (pre-commit) passes.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Ez43BK9AhhMPMdRcFmMEPR

* test: rename misleading docgen description test

The test extracts meta_description from the frontmatter block, not the body;
rename from _from_body to _from_frontmatter to match (review nit).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Ez43BK9AhhMPMdRcFmMEPR

* docs: fold PR #6702's Plotly H1 and intro into the charts SEO PR

#6702 (an earlier Plotly-only SEO PR) overlaps this PR on plotly.md and is a
subset of it, except for a stronger, keyword-rich H1 and a richer intro.
Adopt those here so this PR fully supersedes #6702:

- H1: "Plotly" -> "Plotly in Python: Interactive Charts with Reflex"
- Intro rewritten to lead with the Plotly link, name the figure types, and
  note the no-JavaScript / live-state angle.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Ez43BK9AhhMPMdRcFmMEPR

---------

Co-authored-by: Claude <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants