SEO·Claude Code
SEOClaude Code

Beschreibenden Alt-Text zu jedem Bild — Claude Code

Fehlender Alt-Text bricht Accessibility für Screen Reader, zerstört Google-Images-Ranking, und AI-Antwortengines können deinen visuellen Content nicht zitieren.

rocket_launch

In Claude Code fixen

Anthropics offizieller Terminal-Coding-Agent

Claude Code kann zuerst den ganzen Codebase greppen, die Änderung planen, dann jede betroffene Datei editieren. Prompt unten in deinen Claude Code-Chat einfügen und der Fix rollt in einem Rutsch über das ganze Projekt aus.

Anderes Tool? Wähle deinen Stack:

LovableCursorBoltv0ReplitWindsurfClaude CodeBase44

Der Prompt für Claude Code

Diesen Text exakt so in deinen Claude Code-Chat kopieren und einfügen.

Run Claude Code in the project root and make these exact changes, scanning the whole codebase first:

Add alt text to images

1. Walk through every <img> tag and add a descriptive alt attribute.
2. For decorative images, use alt="" (empty but present).
3. Never write alt="image" or alt="picture" — describe the actual content.

Warum das wichtig ist

Alt-Text ist das Text-Äquivalent eines Bildes. Screen Reader lesen ihn vor, Google Images nutzt ihn für Ranking, AI-Tools wie ChatGPT und Claude beschreiben damit deinen Content beim Zitieren. Ohne scheiterst du an Accessibility-Audits (WCAG 2.1 Level A), verlierst Image-SERP-Traffic und wirst schwerer zitierbar.

AI-generierter Code ist notorisch schlecht bei Alt-Text — entweder kein alt-Attribut oder `alt="image"`. Beides zählt als Fail. Google nennt unbrauchbaren Alt-Text explizit in den Image-SEO-Docs als Penalty-Grund.

Alt-Text in Bulk mit einem AI-Prompt zu fixen ist ein 15-Minuten-Win: Accessibility-Score steigt, Image-SERP-Traffic wird freigeschaltet, GEO-Score verbessert sich gleichzeitig.

So nutzt du diesen Prompt in Claude Code

  1. 1. Dein Claude Code-Projekt öffnen.
  2. 2. Prompt oben mit Copy-Button kopieren.
  3. 3. In Claude Code-Chat einfügen und senden.
  4. 4. Diff reviewen, Änderungen akzeptieren, neu deployen.
  5. 5. Fix mit der Checkliste unten verifizieren.

Typische Fehler vermeiden

  • error_outline`alt="image"` oder `alt="photo"` — zählt für Ranking als kein Alt.
  • error_outlineKeyword-Stuffing: `alt="kaufe rote Schuhe günstig online"` — penalisiert.
  • error_outline`alt=""` auf dekorativen Bildern vergessen — Screen Reader lesen den Dateinamen, schlimmer als nichts.
  • error_outlineDateinamen als Alt automatisch übernehmen — `alt="IMG_2041.jpg"` ist nutzlos.
  • error_outlineAlt der die sichtbare Bildunterschrift wortwörtlich wiederholt.

Wie du prüfst ob der Fix geklappt hat

  • check_circleaxe-core oder Lighthouse Accessibility laufen lassen — "Images have alt text" muss bestehen.
  • check_circle`document.querySelectorAll("img:not([alt])").length` in Console muss 0 sein.
  • check_circleBilder im Browser abschalten (Chrome DevTools → Einstellungen → Bilder deaktivieren) — verstehst du die Seite trotzdem?
  • check_circleGoogle Search Console → Bilder-Report — indexierte Bilder sollten brauchbaren Kontext haben.

Häufige Fragen

Soll Alt jedes Pixel beschreiben oder Bedeutung transportieren?expand_more
Bedeutung transportieren. Chart = beschreibe was das Chart zeigt. Produkt = beschreibe das Produkt. Ein blinder Nutzer soll dieselbe Information bekommen wie ein sehender.
Darf Alt Keywords enthalten?expand_more
Ja, wenn das Keyword das Bild natürlich beschreibt. "Frau läuft am Strand bei Sonnenuntergang" ist besser als "Laufen Strand Sonnenuntergang Keyword".
Wie lang sollte Alt-Text sein?expand_more
Kurzer Satz oder Phrase. Unter ~125 Zeichen. Screen Reader lesen es als Einheit, lange Alts sind mühsam.

Alle 34 Prompts passend zu deiner Claude Code-Site?

Pantra scannt deine Site in 10 Sekunden, erkennt den Stack und generiert genau die Prompts die passen — nur die du brauchst.

Site scannen

Ähnliche Claude Code-Prompts

Bilder

Alt-Text für alle Bilder auf einmal — Claude Code

Prompt der jedes <img>-Tag durchläuft und beschreibende Alt-Attribute im Bulk setzt — schnelle Alternative zum einzelnen Fixen.

Bilder

Bilder zu WebP oder AVIF konvertieren — Claude Code

Prompt um JPEG/PNG zu WebP oder AVIF zu konvertieren — 30-50% kleiner bei gleicher Qualität. Hilft LCP und CLS.

Bilder

1200×630 Open-Graph-Bild setzen — Claude Code

Prompt um ein richtig dimensioniertes og:image zu erstellen und zu referenzieren — Link-Previews auf LinkedIn, Slack, WhatsApp, X sehen professionell aus.

SEO

Einen einzigartigen <title>-Tag pro Seite setzen — Claude Code

Copy-Paste-Prompt um auf jede Seite einen einzigartigen, keyword-relevanten <title>-Tag zu setzen — in Lovable, Cursor, Bolt, v0, Replit, Windsurf, Claude Code oder Base44.

Mehr im Glossar erfahrenarrow_forward