User opens your “ChatGPT custom GPT setup” tutorial. Step 3 says “click the ‘Configure’ tab.” The screenshot shows a 2024 ChatGPT UI with a “Configure” tab. The user’s screen shows the 2026 redesign with no “Configure” tab — it’s been moved to a sidebar and renamed “GPT settings.” User gets confused, bounces, posts a complaint on Reddit. The tutorial is technically wrong because the UI changed and your screenshots didn’t.
Screenshots rot. Every product UI redesign breaks every tutorial that referenced the old version. Most teams don’t have a systematic refresh process, so screenshots gradually drift from “helpful” to “actively misleading.” The fix: detect, batch-update by platform, and add a version-stamp + quarterly audit so rot becomes visible.
Common causes
Ordered by hit rate, highest first.
1. Platform redesigned but site-wide screenshots were never re-audited
ChatGPT shipped a redesign in March. You have 40 articles referencing ChatGPT UI. Nobody scheduled an audit. 40 tutorials silently became wrong on March 16.
How to spot it: Pick a recently-redesigned platform; sample 5 articles referencing its UI; check if screenshots match current. If 3+ show old UI, no audit happened.
2. Screenshots aren’t centrally managed
Each article has its screenshots inline (or in assets/article-slug/). No central index. When the UI changes, there’s no list of “all screenshots that need updating.”
How to spot it: Try to list every screenshot of a specific platform across your site. If the answer requires manual grep through 500 files, screenshots aren’t centrally managed.
3. No filename version-stamping
Screenshots are named screenshot1.png or chatgpt.png. Without a version stamp, you can’t tell from the filename whether it’s current or 18 months old.
How to spot it: ls public/screenshots/ — if filenames lack dates or version markers, every screenshot is undated.
4. Alt text is generic (“ChatGPT screenshot”) not descriptive
Alt text like “ChatGPT screenshot” doesn’t help users understand what they’re looking at. For users on slow connections or accessibility tools, the screenshot is useless. For staleness, the alt isn’t even close to specific enough to help an audit.
How to spot it: Grep alt="screenshot or alt=".*ChatGPT$" — any matches are too-generic alt text.
5. Tutorial text doesn’t reference the screenshot specifically
Text says “click submit” and somewhere below is a screenshot showing the submit button. If submit is moved to a sidebar, text and screenshot diverge — and there’s no anchor connecting them.
How to spot it: Read article tutorials. If you can’t trivially match “what step is the screenshot illustrating,” the text-image alignment is loose.
6. No mechanism flags screenshots as stale
There’s no PR check, lint, or quarterly process. Staleness only surfaces when a reader complains.
How to spot it: When was the last time a screenshot was updated proactively (not in response to a complaint)? If “I don’t remember,” there’s no process.
Shortest path to fix
Ordered by ROI. Step 1 + 2 catch + queue; Steps 3-6 prevent recurrence.
Step 1: Inventory all screenshots by platform
# Find every article referencing screenshots
grep -rln "![[]" src/content/articles/ | head -20
# For each, categorize by platform mentioned
# Build a list: chatgpt-articles, claude-articles, midjourney-articles, etc.For each platform, list the articles. When that platform redesigns, you know exactly which articles to update.
Step 2: Prioritize by article traffic, then by platform redesign recency
Highest priority:
- Article has high impressions
- Platform redesigned in last 6 months
Lower priority:
- Low traffic article
- Platform stable for 2+ yearsYou can’t update everything; update what matters most.
Step 3: Add version-stamped filenames
Rename screenshots with date stamps:
Before: chatgpt-ui.png
After: chatgpt-ui-2026-05.png
Or with version:
chatgpt-ui-v2-redesign.pngNow ls shows you what’s old at a glance. When you refresh, you create a new file (-2026-11.png) and update the article reference — old file stays around as a snapshot record.
Step 4: Improve alt text to be specific
<!-- Bad -->
<img src="..." alt="ChatGPT screenshot">
<!-- Good -->
<img src="..." alt="ChatGPT Custom GPT Configure tab, showing the Instructions field and the Files attachment area (2026-05 UI)">Specific alt text serves users on slow connections, accessibility tools, AND your own future audits.
Step 5: Build a quarterly audit checklist
# screenshot-audit-Q2-2026.md
## ChatGPT articles (15)
- [ ] chatgpt-custom-gpt-setup — last screenshot: 2024-08, redesign 2026-03, **update**
- [ ] chatgpt-memory-feature — last: 2026-04, current, OK
- [ ] ...
## Claude articles (12)
- [ ] ...Schedule quarterly. Time-box: 1 article per 10 minutes for re-screenshotting.
Step 6: Add a date / version comment in MDX
import ChatGPTUI from "./assets/chatgpt-ui-2026-05.png";
{/* Screenshot captured: 2026-05, ChatGPT UI v3 */}
<img src={ChatGPTUI} alt="ChatGPT Custom GPT Configure tab (2026-05)" />Now a CI script can find screenshots older than 9 months and surface them as “needs review”:
# scripts/audit-screenshot-age.mjs
# Parse MDX files, find capture-date comments, list screenshots >9 months oldPrevention
- Version-stamp screenshot filenames so age is visible at a glance
- Maintain a per-platform article list so redesigns trigger immediate audit-and-update
- Quarterly screenshot audit cadence; budget time for it
- Capture-date comments in MDX + CI script to flag screenshots >9 months old
- Specific alt text on every screenshot — useful for users, accessibility, AND audits
- When a platform redesigns, batch-update affected articles within 2 weeks; don’t wait for complaints