Technik·Claude Code
TechnikClaude Code

Hochauflösenden Favicon setzen — Claude Code

Google zeigt Favicons neben Mobile-Suchergebnissen. Fehlender oder unscharfer Favicon wirkt amateurhaft neben Konkurrenten und senkt CTR.

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 a favicon

1. Add a favicon.ico file to /public/.
2. Also add <link rel="icon" href="/favicon.ico"> in <head>.

Warum das wichtig ist

Google-SERP auf Mobile zeigt Favicon neben jedem Ergebnis. Kein Favicon = generisches Globus-Icon, wirkt untrustworthy neben gebrandeten Konkurrenten.

Browser zeigen Favicon im Tab. Ohne sehen User ein leeres Blatt, und Bookmarks haben keinen visuellen Identifier — schwerer wiederzufinden.

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_outlineNur 16×16-Favicon shippen — unscharf auf Retina und in Google-SERP.
  • error_outlineFoto als Favicon — in kleinen Grössen nicht lesbar.
  • error_outlineApple-Touch-Icon (180×180) vergessen — iOS-Homescreen-Icon nutzt skalierte Version.

Wie du prüfst ob der Fix geklappt hat

  • check_circle`favicon.ico` am Root liefert 200.
  • check_circleGoogle-SERP (site:deinesite.com auf Mobile) zeigt deinen Favicon, nicht den Globus.
  • check_circleBookmarken und prüfen dass das Bookmark-Icon korrekt ist.

Häufige Fragen

ICO oder PNG?expand_more
Beides. Klassischen `favicon.ico` (16+32+48) am Root für Legacy, plus PNGs für moderne Browser und Apple Touch.
Wann zeigt Google Favicons?expand_more
Mobile-SERP seit 2019. Desktop in manchen Kontexten. So oder so: haben.

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

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

Open Graph + Twitter Card Tags setzen — Claude Code

Prompt um og:title, og:description, og:image und Twitter-Card-Meta zu setzen — damit Links auf Slack, LinkedIn, WhatsApp, X richtig aussehen.

Technik

Viewport-Meta-Tag setzen — Claude Code

Prompt um den mobile-friendly Viewport-Meta-Tag zu setzen — Pflicht für Googles Mobile-First-Indexing.

Technik

lang-Attribut auf <html> setzen — Claude Code

Prompt um lang="en" oder lang="de" auf <html> zu setzen — für Accessibility und SEO.

Mehr im Glossar erfahrenarrow_forward