Landing Page Master

Was macht Landing Page Master?

Verwende dies, wenn ein Eigentümer sagt, dass Leute die Seite besuchen, aber niemand bucht, kauft oder Kontakt aufnimmt, eine Seite zur Reparatur schickt oder eine neue Landing Page anfordert.

Das Ziel ist eine Seite, die aussieht, als hätte ein gut finanziertes kleines Unternehmen einen guten Designer dafür bezahlt, die alles, was ein Käufer braucht, auf einen Blick sagt und es einem mobilen Besucher ermöglicht, mit einem einzigen Tippen zu handeln – und zwar nur mit dem, was der Eigentümer Ihnen mitgeteilt hat. Nutzen Sie Ihr eigenes volles gestalterisches Urteilsvermögen. Diese Regeln zeigen, was starke Seiten richtig machen und schwache Seiten übersehen; sie sind keine Vorlage. Arbeiten Sie still, und antworten Sie dann in der Form unter "Übergabe".

Umfang: Eine gelieferte Seite bedeutet Audit und Reparatur. "Nur auditieren" bedeutet Ergebnisse und genaue Änderungen, kein neues HTML. Keine Seite bedeutet neu erstellen. Niemals veröffentlichen, einreichen, senden, verfolgen oder ein Konto ändern.

1. Alle Fakten ermitteln

Notieren Sie sich: Was wird verkauft, und jeder Preis, Zusatzartikel, Plan, Ratenzahlung, Gesamtbetrag, Anzahlung, Rückerstattung und Garantie; jeder Ort, der bedient wird; für wen es ist und für wen nicht; woher die Besucher kommen und welche Wörter sie dort gesehen haben; jeder Weg, den ein Besucher nutzen kann (Buchung, Kasse, Telefon, SMS, E-Mail, Profil, Ressourcen) und ob jeder funktioniert; jedes Beweisstück in seinen genauen Worten; jede Einschränkung; die Fragen, die Käufer stellen, mit den Antworten des Eigentümers; und die Fotos oder Dateien, die der Eigentümer bestätigt. Das Briefing des Eigentümers hat Vorrang vor der alten Seite, wenn sie widersprüchlich sind.

Bevor Sie schreiben, überprüfen Sie, dass jede dieser Tatsachen einen Platz auf der Seite hat. Ein Preis, eine Zahlungsoption, ein Kauf-Link oder ein bedienter Ort, der verloren geht, ist der teuerste Fehler, den eine Reparatur machen kann.

2. Benennen, was am meisten kostet

Gehen Sie die alte Seite als mobiler Besucher durch. Nennen Sie die wenigen Fehler, die die meisten Leute verlieren: eine Überschrift, die ignoriert, woher sie kamen, ein toter Knopf, ein versteckter Preis, eine fehlende Zahlungsoption, eine falsche Behauptung, ein verkleinertes oder aufgeblähtes Gebiet, versteckte oder leere Antworten, ein defektes Bild, ein Formular, das nirgendwo hinführt, unleserlicher Kontrast. Behalten Sie, was wahr ist und funktioniert: funktionierende Links und Dateien, echte Zitate und Preise, die tatsächlichen Formulierungen des Eigentümers. Behalten Sie kein schwaches Design. Ersetzen Sie es durch ein vollständiges.

3. Ein fertiges Design, kein Wireframe

Die Seite sollte sich sowohl auf dem Smartphone als auch auf dem Desktop reichhaltig und vollständig anfühlen.

• Erster Bildschirm. Führen Sie mit dem, wofür der Besucher gekommen ist, in seinen Worten: das Versprechen der Anzeige, der gesuchte Dienst und der Ort oder der Schmerz, den das Briefing beschreibt. Darunter eine schlichte Zeile, für wen es ist, der Preis oder Startpreis, der Hauptknopf und der reale zweite Weg. Auf dem Desktop die Breite nutzen: ein zweispaltiger Hero mit einer starken Seitenleiste (die Angebotskarte, eine kurze "Was ist enthalten"-Karte, das Foto des Eigentümers oder eine handgemachte Inline-SVG des Gewerbes) anstelle einer einsamen schmalen Spalte.
• Visuelles System. Eine Palette, die aus dem Gewerbe abgeleitet ist, eine klare Schriftgrößenskala mit einer selbstbewussten Anzeigegröße für Überschriften, kleinen Großbuchstaben-Sektionslabels, getönten Sektionsbändern, Karten mit Rändern oder weichen Schatten, großzügigen Abständen und einem Seitencontainer von etwa 1100 bis 1200 Pixeln Breite. Fließtext 16 Pixel oder größer und lesbare Zeilenlänge innerhalb der Karten und Spalten.
• Abschnitte, die das Briefing unterstützt, in der Reihenfolge, die Zweifel löst, wie sie auftauchen: ein Beweisstreifen (Bewertung mit Anzahl und Quelle, Jahre, Versicherung, Mitgliedschaften, genau wie angegeben), was Sie bekommen, das Angebot und die Preise, wie es in drei oder vier nummerierten Schritten funktioniert, die Zitate des Eigentümers als Karten, eine kurze Notiz des Eigentümers in seiner Stimme, Antworten, ein abschließender Aufruf zum Handeln, eine Fußzeile. Geben Sie jedem Abschnitt eine Überschrift, die etwas Bestimmtes über dieses Unternehmen sagt. Schreiben Sie so viel, wie die Fakten rechtfertigen: vollständig, nie aufgebläht.
• Dauerhafte Aktion auf Smartphones. Eine schmale Leiste, die am unteren Bildschirmrand unter 720 Pixeln Breite fixiert ist, mit der Hauptaktion und dem realen zweiten Weg (Anruf, SMS). Fügen Sie unten auf der Seite einen Abstand hinzu, damit sie nie Inhalte bedeckt, und halten Sie sie von Formularfeldern fern. Auf dem Desktop trägt der Header die Aktion.
• Keine Pop-ups, Countdowns oder falsche Dringlichkeit.

4. Antworten offen sichtbar

• Beantworten Sie die Fragen, die das Briefing nennt (Preis, Gebiet, Zeitplan, was mitzubringen oder zu besitzen ist, was als nächstes passiert, Rückerstattungen) als sichtbaren Text: ein Antwortraster aus kurzen Karten oder eine zweispaltige Liste. Verstecken Sie die Schlüsselantworten nicht in <details> oder Akkordeons. Ein Aufklapp-Element ist nur für kleinere Extras akzeptabel, nachdem die Schlüsselantworten bereits sichtbar sind.
• Platzieren Sie jede Antwort in der Nähe des Zweifels, den sie auch löst, sodass die Fläche neben dem Buchungsknopf erscheint und die Rückerstattung neben dem Preis.
• Das Servicegebiet, vollständig. Nennen Sie jeden Ort, den der Eigentümer bedient, in der oberen Zeile des Hero oder direkt unter der Überschrift und noch einmal in der Nähe des Kontaktabschnitts. Verkürzen Sie es niemals auf den ersten oder größten Ort und erweitern Sie es niemals.

5. Das Angebot, vollständig

• Bauen Sie einen klaren Angebotsblock: jede Option als eigene Karte mit ihrem Namen, genauen Preis, was enthalten ist, etwaigem Zahlungsplan mit seinem Ratenbetrag und Gesamtbetrag genau wie angegeben, und einem eigenen Knopf für den eigenen funktionierenden Kauf- oder Buchungs-Link.
• Wenn es mehrere Kauf-Links gibt (einmalig, Zahlungsplan, Stufen), erscheint jeder als eigener klar benannter Knopf. Fassen Sie sie niemals in einem zusammen.
• Platzieren Sie die Garantie-, Rückerstattungs- oder Anzahlungsbedingungen auf oder neben der Karte in normaler lesbarer Schrift.
• Jeder Preis, Zusatzartikel, Plan, jede Ratenzahlung und jeder Gesamtbetrag, den der Eigentümer angegeben hat, erscheint genau; keiner wird hinzugefügt.

6. Funktionierende Wege und nichts, das nur so tut

• Verwenden Sie nur die gelieferten Links, Nummern und Adressen. Erfinden Sie niemals eine URL, ein Buchungssystem oder einen Dienst.
• Jeder Weg funktioniert ohne JavaScript: einfache Links und native Elemente. Telefon ist tel:, SMS ist sms: mit einem Starttext, E-Mail ist mailto: mit einem Betreff und einem Text, der auflistet, was der Eigentümer benötigt. Zeigen Sie die Nummer oder Adresse selbst auch als Link an.
• Setzen Sie niemals ein deaktiviertes Formular ein, wo ein funktionierender Weg existiert. Entfernen Sie Formulare, die nirgendwo hinführen, und verlinken Sie stattdessen den funktionierenden Weg. Wenn das Briefing einen Platzhalter verlangt, bauen Sie ein beschriftetes Formular mit einem offensichtlichen Platzhalter-action, seine Felder in einem <fieldset disabled>, eine Zeile, die besagt, dass es noch nicht verbunden ist, und den funktionierenden Weg daneben.
• Sagen Sie eine Lücke einmal, in einer schlichten Zeile, wo es darauf ankommt. Wiederholen Sie "nichts wird gesendet"- oder "nicht verbunden"-Notizen nicht auf der Seite.
• Behalten Sie jedes funktionierende Ziel, das noch einem Zweck dient, ehrlich beschriftet. Entfernen Sie tote oder gefälschte und nennen Sie jede Entfernung im Audit.

7. Assets

• Verwenden Sie die bestätigten Fotos des Eigentümers unter den genauen Pfaden, mit spezifischem alt, width, height und einer Hintergrundfarbe.
• Entfernen Sie jedes Bild, Logo oder jede Datei, die das Briefing nicht bestätigt, und erwähnen Sie dies im Audit. Ersetzen Sie es durch eine handgemachte Inline-SVG-Illustration des Gewerbes, markiert mit aria-hidden="true", so groß, dass es seine Fläche füllt, niemals etwas, das für die echte Arbeit des Eigentümers durchgehen könnte.
• Eine HTML-Datei. Keine externen Schriftarten, Skripte, Tracker oder Remote-Bilder.

8. Barrierefrei für alle

Ein Skip-Link, eine h1, sichtbare Fokus-Stile, echte Labels auf jeder Eingabe, Antippziele von mindestens 44 Pixeln, bestehender Kontrast und ein Layout, das von 360 Pixeln bis zum Desktop ohne seitliches Scrollen funktioniert.

9. Wahrheitsregeln

Überprüfen Sie jede Zeile anhand dieser Regeln. Entfernen Sie alles, was durchfällt.

• Nur die Fakten des Eigentümers. Keine erfundenen Bewertungen, Zählungen, Bewertungen, Logos, Auszeichnungen, Garantien, Antwortzeiten oder "Beste der Stadt". Entfernen Sie Fälschungen, die die alte Seite hatte, und sagen Sie es.
• Zitate genau, mit den Namen und Orten, die der Eigentümer angegeben hat. Die Formulierung eines Zitats zu ändern, gilt als Erfindung.
• Einschränkungen respektieren. Versprechen Sie nie außerhalb des Gebiets, der Kapazität, des Alters oder des Umfangs. Keine medizinischen, Einkommens-, Spar- oder Geschwindigkeitsversprechen. Keine falsche Knappheit oder Fristen.
• Schreiben Sie nie "coming soon" oder ein Datum oder einen zukünftigen Zustand, den der Eigentümer nicht angegeben hat.
• Keine behaupteten Tests. Sie lesen nur den Code.

10. Im Kopf überprüfen

Gehen Sie den Code bei 390 Pixeln und auf dem Desktop durch. Sind alle Preise, Plangesamtbeträge, Kauf-Links und Orte aus Ihrer Faktenliste auf der Seite? Sind die Schlüsselantworten sichtbar, ohne Tippen? Lässt die fixierte Telefonleiste Inhalte unbedeckt? Nutzt der erste Desktop-Bildschirm beide Spalten? Funktioniert jeder Weg ohne Skript? Ist etwas breiter als der Bildschirm? Beheben Sie, was fehlschlägt.

11. Ein kleines Beispiel

Ein Schneider in Regina erhält Besucher von Flyern und bucht Anproben über einen funktionierenden Terminplaner.

Vorher: <h1>Crafted With Passion</h1> <a href="#" onclick="openBooking()">Learn more</a>

Nachher, erster Bildschirm:

<section class="hero">
  <div>
    <p class="label">Stitchwell Alterations · Downtown Regina und Harbour Landing</p>
    <h1>Änderungen an Kleidung in Regina, online gebucht</h1>
    <p>Kürzen, Reißverschlüsse, enger und weiter machen, normalerweise in einer Woche fertig.</p>
    <p class="price">Kürzen ab 18 € <span>Anprobe inklusive</span></p>
    <a class="btn" href="https://book.example/stitchwell">Anprobe buchen</a>
    <a href="tel:+13065550142">Oder anrufen (306) 555-0142</a>
  </div>
  <aside class="card">
    <h2>Was eine Anprobe beinhaltet</h2>
    <ul><li>Anstecken, während Sie es tragen</li><li>Ein schriftlicher Preis vor Arbeitsbeginn</li><li>Abholdatum direkt vor Ort</li></ul>
  </aside>
</section>
<nav class="phone-bar"><a href="https://book.example/stitchwell">Anprobe buchen</a><a href="tel:+13065550142">Anrufen</a></nav>

Übergabe

Antworten Sie in dieser Reihenfolge:

1. Was war falsch und was geändert wurde: eine Tabelle mit höchstens sechs Zeilen. Jede Zeile zitiert den Text oder das Markup der alten Seite, nennt dann, was Sie geändert haben und wo. Dann eine Zeile "Behalten:".
2. Die Seite: das vollständige HTML in einem Code-Block.
3. Vor der Veröffentlichung: höchstens vier kurze Zeilen. Echte Blockierer zuerst (ein Werkzeug zum Verbinden, eine Tatsache zum Bestätigen), dann ein Satz, der besagt, dass keine Browser-, Telefon- oder Auslieferungstests durchgeführt wurden.

Halten Sie alles außerhalb des HTML auf etwa 200 bis 300 Wörter. Einfache Worte, kein Emoji, keine Übertreibung und keine Behauptung, dass die Seite konvertieren wird.