EshaRana17/website-review

Was macht website-review?

Ein praktischer Bewertungsdienst für kleine Unternehmenswebsites und Landingpages. Er erstellt evidenzbasierte Ergebnisse, Bewertungen und priorisierte Korrekturen, die ein nicht-spezialisierter Inhaber noch diese Woche umsetzen kann.

Wählen Sie den Arbeitsablauf

Lesen Sie die Anfrage und wählen Sie einen oder mehrere Arbeitsabläufe aus. Wenn der Benutzer einfach sagt „Überprüfe meine Seite“, führen Sie Arbeitsablauf 1 aus und bieten Sie 3 und 4 als Folgeoptionen an.

Benutzer fragt nach	Arbeitsablauf	Referenz laden
„Warum konvertiert das nicht?“, Review, CRO, Homepage-Feedback	1. Conversion-Review	references/conversion.md
Überschrift, Text, CTA, Aufzählungspunkte umschreiben	2. Text-Neufassung	references/copywriting.md
Barrierefreiheit, a11y, WCAG, Screenreader, Kontrast	3. Barrierefreiheitsprüfung	references/accessibility.md
Langsame Seite, Seitenladegeschwindigkeit, Lighthouse, Core Web Vitals, Header	4. Performance und Technik	references/performance.md
Neue Seite, Sitemap, „Welche Seiten brauche ich?“	5. Seitenplan	references/site-plan.md

Laden Sie nur die Referenzdatei(en), die der gewählte Arbeitsablauf benötigt.

Eingaben und was sie ermöglichen

Arbeiten Sie mit dem, was der Benutzer bereitstellt, und sagen Sie klar, was nicht geprüft werden konnte.

• URL: Wenn ein Fetch- oder Browser-Tool verfügbar ist, lesen Sie die Seite. Wenn nicht, fragen Sie nach einem Screenshot, kopiertem Text oder gespeichertem HTML. Geben Sie niemals vor, eine Seite besucht zu haben.
• Screenshot: Gut für Hierarchie, Inhalte „above the fold“, visuellen Kontrast (nur Schätzung), CTA-Platzierung. Kann keinen Alt-Text, keine Labels, Überschriften oder Geschwindigkeit überprüfen.
• Kopierter Text: Gut für Botschaft und Text. Kann kein Layout oder visuelle Aspekte beurteilen.
• HTML-Datei: Gut für Struktur und Barrierefreiheits-Markup. Führen Sie scripts/page_audit.py darauf aus (siehe unten). Kann keine reale Geschwindigkeit messen.
• Lighthouse- oder PageSpeed-Bericht (kopiert oder exportiert): Verwenden Sie ihn als Quelle der Wahrheit für Leistungszahlen.

Sammeln Sie vor Beginn (oder leiten Sie ab und geben Sie Annahmen bekannt): für wen die Seite ist, die einzige primäre Aktion, die die Seite auslösen soll, und die Traffic-Quelle (Anzeigen, Suche, Soziales, Empfehlung). Wenn etwas fehlt, stellen Sie eine kurze Frage oder nennen Sie die Annahme und fahren Sie fort.

Grundregeln

1. Evidenz zuerst. Jedes Ergebnis zitiert, was beobachtet wurde (zitieren Sie den Text, nennen Sie das Element, geben Sie den gemessenen Wert). Keine allgemeinen Ratschläge ohne Bezug zur tatsächlichen Seite.
2. Keine erfundenen Fakten. Erfinden Sie niemals Testimonials, Bewertungen, Kundenzahlen, Statistiken, Auszeichnungen, Logos oder Garantien. Fehlt der Nachweis, verwenden Sie einen klar gekennzeichneten Platzhalter wie [echtes Kunden-Zitat hier einfügen] und sagen Sie, was gesammelt werden muss.
3. Markenklang bewahren. Die Neufassung entspricht dem vorhandenen Ton, Leseniveau und Wortschatz, es sei denn, der Benutzer wünscht eine neue Stimme.
4. Nach Wirkung und Aufwand priorisieren. Inhaber haben wenig Zeit. Korrekturen einstufen, keine Checklisten ausgeben.
5. Gemessenes von Geschätztem trennen. Markieren Sie Kontrastverhältnisse, die aus einem Screenshot geschätzt wurden, oder Geschwindigkeitsprobleme, die aus dem Markup abgeleitet wurden, als Schätzungen.
6. Standards präzise angeben. Verwenden Sie die Fakten in den Referenzdateien (WCAG 2.2, Core Web Vitals Schwellenwerte). Wenn der Benutzer einen neueren Standard zitiert, folgen Sie diesem und sagen Sie, auf welcher Version der Rat basiert.
7. Einfache Sprache. Erklären Sie Fachbegriffe bei der ersten Verwendung in wenigen Worten.

Arbeitsablauf 1: Landingpage Conversion-Review

Details, Bewertungsmatrix und Prüfungen: references/conversion.md.

Schritte:

1. 5-Sekunden-Test. Beantworten Sie nur anhand des ersten Bildschirms (above the fold auf Mobilgeräten und Desktops, falls beide verfügbar): Was ist es? Für wen ist es? Warum sollte ich mich interessieren (Ergebnis oder Unterscheidungsmerkmal)? Was mache ich als Nächstes? Bewerten Sie jede Frage mit Bestanden / Teilweise / Nicht bestanden und zitieren Sie den Text, der die Antwort gibt.
2. Bewerten Sie die acht Dimensionen (0 bis 5 jeweils) anhand der Matrix in der Referenz: Klarheit des Wertversprechens, visuelle Hierarchie, CTA-Stärke und -Platzierung, soziale Beweise, Umgang mit Einwänden, Reibung bei Formular und Checkout, Übereinstimmung der Botschaft mit der Traffic-Quelle, Vertrauens- und Glaubwürdigkeitssignale.
3. Listen Sie Probleme auf mit Beleg, Auswirkung (Hoch / Mittel / Niedrig) und Aufwand (Schnell / Mittel / Hoch).
4. Rangliste der Top-10-Korrekturen zuerst nach Auswirkung, dann nach Aufwand (Quick Wins höher).
5. Schlagen Sie Tests vor für die Top 2 oder 3 Korrekturen, wenn die Seite genügend Traffic hat (siehe Traffic-Hinweis in der Referenz); andernfalls empfehlen Sie, sie einfach umzusetzen.

Ausgabevorlage:

## Conversion-Review: [Seitenname]

**Angenommene Zielgruppe:** ... | **Primäre Aktion:** ... | **Traffic-Quelle:** ...

### 5-Sekunden-Test
| Frage | Ergebnis | Beleg |
|---|---|---|
| Was ist es? | Bestanden/Teilweise/Nicht bestanden | „zitierte Überschrift“ |
| Für wen ist es? | ... | ... |
| Warum wichtig? | ... | ... |
| Was als nächstes? | ... | ... |

### Bewertungstabelle (insgesamt X / 40)
| Dimension | Punktzahl (0-5) | Einzeiliger Grund |
|---|---|---|

### Top-10-Korrekturen (nach Auswirkung sortiert)
1. **[Korrektur]** – Auswirkung: Hoch | Aufwand: Schnell
   Warum: ... Beleg: ... Wie: ...

### Was bereits funktioniert
- ...

### Nicht geprüft
- ... (und welche Eingabe dies ermöglichen würde)

Arbeitsablauf 2: Text-Neufassung

Details, Formeln und Methode zur Stimmangleichung: references/copywriting.md.

Schritte:

1. Erfassen Sie die Stimme. Notieren Sie Ton (z. B. warm, direkt, technisch, verspielt), Satzlänge, Person (wir/Sie/ich), Wörter, die die Marke verwendet und vermeidet. Geben Sie dieses Stimmprofil in zwei oder drei Zeilen vor der Neufassung an.
2. Finden Sie die Kernbotschaft. Kunde, Problem, Ergebnis, Unterscheidungsmerkmal, verfügbarer Nachweis. Wenn das Unterscheidungsmerkmal unklar ist, fragen Sie nach oder bieten Sie zwei Formulierungen an.
3. Schreiben Sie Überschriftoptionen (5 sind ein guter Standard), jede mit einem anderen Winkel (Ergebnis, Problem, Zielgruppenansprache, Unterscheidungsmerkmal, Spezifität). Geben Sie für jede eine einzeilige Begründung und empfehlen Sie eine.
4. Schreiben Sie eine Unterüberschrift, die das Wie, Wer oder den Nachweis hinzufügt, den die Überschrift ausgelassen hat.
5. Schreiben Sie CTA-Varianten (3 bis 5): handlungsorientiert, spezifisch darüber, was als nächstes passiert, optional mit einer risikomindernden Zeile darunter (z. B. „Keine Karte erforderlich“), nur wenn dies für dieses Unternehmen zutrifft.
6. Schreiben Sie Funktionsaufzählungen als Vorteile um: Funktion, dann was sie für den Kunden bedeutet. Halten Sie Behauptungen aufrecht, hinter denen der Benutzer stehen kann.
7. Markieren Sie Behauptungen, die einen Nachweis benötigen, und listen Sie die zu sammelnden Belege auf, anstatt sie zu erfinden.

Ausgabe: Stimmprofil, Überschriftentabelle (Option, Winkel, Begründung), empfohlene Wahl, Unterüberschrift, CTA-Liste, Vorher/Nachher-Aufzählungen, Liste der benötigten Nachweise.

Erfinden Sie niemals gefälschte Testimonials, Bewertungsanzahlen, Kundenlogos, „wie gesehen in“-Zeilen oder numerische Ergebnisse, die der Benutzer nicht geliefert hat.

Arbeitsablauf 3: Barrierefreiheitsprüfung (WCAG 2.2 AA Grundlagen)

Details, Kriterienliste und Korrekturcode-Ausschnitte: references/accessibility.md.

WCAG 2.2 ist seit Oktober 2023 eine W3C-Empfehlung (neueste Ausgabe vom 12. Dezember 2024). Es hat 4.1.1 Parsing entfernt und neun Erfolgskriterien hinzugefügt, von denen sechs auf Stufe A oder AA sind. Diese Prüfung deckt die Grundlagen ab, an denen die meisten kleinen Seiten scheitern; sie ist keine vollständige Konformitätsprüfung – sagen Sie dies in der Ausgabe.

Schritte:

1. Wenn HTML verfügbar ist, führen Sie scripts/page_audit.py aus und verwenden Sie dessen Ausgabe als Beleg.
2. Prüfen Sie die Grundlagen in dieser Reihenfolge: Textkontrast, Nicht-Text-Kontrast, Alternativtext, Überschriften und Orientierungspunkte, Formularbezeichnungen und -fehler, Tastaturzugriff und sichtbarer Fokus, Fokus nicht verdeckt, Zielgröße, Bewegung und Animation, Sprache und Seitentitel, Link- und Schaltflächennamen.
3. Geben Sie für jeden Fehler an: Kriteriennummer und -name, Stufe, Ort des Auftretens, wen es betrifft und einen kopierbaren Korrekturcode-Ausschnitt.
4. Empfehlen Sie einen manuellen Testdurchlauf: tastaturgesteuerter Durchgang, 200 % Zoom und 320 CSS px Breite Fluss, sowie einen Screenreader (NVDA, VoiceOver oder TalkBack).

Ausgabe: Zusammenfassung (Blockierer / Ernsthaft / Geringfügig Zählungen), Ergebnistabelle, Korrektur-Ausschnitte, Checkliste für manuelle Tests, Liste „Nicht geprüft“.

Arbeitsablauf 4: Performance und technische Grundlagen

Details, Schwellenwerte und Messanleitung: references/performance.md.

Core Web Vitals sind LCP (Laden), INP (Reaktionsfähigkeit, ersetzte FID im März 2024) und CLS (visuelle Stabilität). Gute Schwellenwerte beim 75. Perzentil der Seitenaufrufe: LCP 2,5 s oder weniger, INP 200 ms oder weniger, CLS 0,1 oder weniger.

Schritte:

1. Fragen Sie, ob der Benutzer ein PageSpeed Insights- oder Lighthouse-Ergebnis hat. Felddaten (echte Benutzer, aus dem Chrome UX Report) haben Vorrang vor Labordaten; sagen Sie, welche Sie haben.
2. Ohne Messungen leiten Sie wahrscheinliche Probleme aus dem Markup oder Screenshots ab und kennzeichnen Sie als Hypothesen, die überprüft werden müssen.
3. Prüfen Sie: LCP-Element und wie es lädt, Bildformate und -größen, Schriftartenladen, rendernblockierendes CSS und JS, Drittanbieter-Skripte, Quellen von Layoutverschiebungen, mobiler Viewport und Touch-Ziele, Caching und Komprimierung, HTTPS und Sicherheitsheader.
4. Ausgabe einer priorisierten Checkliste: P1 (jetzt beheben), P2 (diesen Monat), P3 (nice to have), jeweils mit „wie messen“, das den genauen Lighthouse-Audit oder das PageSpeed-Feld nennt.

Arbeitsablauf 5: Website-von-Grund-auf-Plan

Details, Seitenbaupläne und Textentwürfe: references/site-plan.md.

Schritte:

1. Briefing. Sammeln Sie: Geschäftsart, Standort oder Servicegebiet, Hauptkunde, Top-3-Dienstleistungen oder -Produkte, primäre Conversion (Anruf, Buchung, Angebot, Kauf, Anmeldung), verfügbarer Nachweis, Markenstimme, Budget für Inhalte. Fragen Sie nach Lücken in einer gruppierten Frage oder fahren Sie mit formulierten Annahmen fort.
2. Sitemap. Beginnen Sie minimal (typischerweise 5 bis 8 Seiten). Begründen Sie jede Seite mit einer Kundenfrage, die sie beantwortet, oder einer Suche, für die sie ranken kann.
3. Seite-für-Seite-Plan. Für jede Seite: Zweck, primärer CTA, Abschnitte in Reihenfolge, Textentwurf (Überschriftenrichtung plus Schlüsselpunkte), zu platzierender Nachweis, interne Links.
4. Launch-Checkliste. Technische, Barrierefreiheits-, Analyse- und rechtliche Grundlagen.
5. Inhalts-To-do-Liste für den Inhaber (Fotos, Zitate, zu sammelnde Zahlen).

Ausgabe: Briefing-Zusammenfassung, Sitemap-Baum, Seitenpläne, Launch-Checkliste, Inhalts-To-do.

Hilfsskript: page_audit.py

scripts/page_audit.py ist ein Python-3-Skript, das nur die Standardbibliothek verwendet. Es liest eine lokale HTML-Datei und greift niemals auf das Netzwerk zu. Verwenden Sie es immer dann, wenn der Benutzer HTML bereitstellt (gespeicherte Seite, Export oder Quelltext).

python scripts/page_audit.py pfad/zu/seite.html            # lesbarer Bericht
python scripts/page_audit.py pfad/zu/seite.html --json     # maschinenlesbar

Es meldet: fehlendes lang, Viewport-Meta, Titel und Meta-Beschreibung; Bilder ohne alt oder ohne width/height; Formularfelder ohne barrierefreie Bezeichnung; Probleme mit der Überschriftenreihenfolge (übersprungene Ebenen, fehlendes oder mehrere h1); Anzahl externer Skripte und ihrer Hosts; CTA-ähnliche Schaltflächen und Links.

Der Exit-Code ist 0, wenn keine Probleme gefunden werden, 1, wenn Probleme gefunden werden, 2 bei Verwendungs- oder Dateifehlern. Behandeln Sie seine Ergebnisse nur als Markup-Belege: Es kann kein CSS, keinen Kontrast, kein JavaScript-gerendertes Rendern oder reale Performance sehen. Eine Beispieldatei zum Testen finden Sie unter assets/sample.html.

Wenn der Benutzer nur eine URL angibt, laden Sie keine Seiten mit dem Skript herunter. Bitten Sie ihn, die Seite zu speichern (Browser „Seite speichern unter“, nur HTML) oder den Quelltext einzufügen.

Arbeitsabläufe kombinieren

Für ein „vollständiges Review“ führen Sie zuerst 1, dann 3 und 4 in Kurzform (nur die wichtigsten Ergebnisse) aus und schließen Sie mit einer einzigen, zusammengeführten Prioritätenliste von maximal 10 Punkten ab, damit der Inhaber einen Plan und nicht drei hat.

Qualitätscheckliste vor dem Antworten

• Jede Bewertung und jedes Ergebnis hat einen Beleg von der Seite.
• Keine erfundenen Nachweise, Zahlen oder Zitate.
• Korrekturen sind eingestuft und haben jeweils eine Auswirkung und einen Aufwand.
• Standards werden mit Nummer und Version zitiert, sofern relevant.
• Der Abschnitt „Nicht geprüft“ ist ehrlich bzgl. der Eingabelimits.
• Neufassungen entsprechen dem genannten Stimmprofil.