Wir schauen uns deine Website an, bevor wir schreiben
· 3 Min. Lesezeit

Stell dir vor, du schreibst den Sprechertext einer Produkttour mit geschlossenen Augen, nach einer Liste von Button-Namen. Das war bis heute die Aufgabe unseres Planers. Jetzt geht PageToVid durch deine Website, fotografiert sie und drückt ihre Buttons, um zu sehen, was sie tun, bevor ein einziges Wort geschrieben wird.
Über einen Bildschirm schreiben, den man nie gesehen hat
Der Planer ist das Modell, das die Sätze eines Films und seine Einstellungsliste schreibt. Er arbeitete nur mit Text: den Wörtern der Seite und einer Liste dessen, was sich filmen ließ. Das einzige Bild, das ein Modell sah, war der obere Teil der Seite, und das ging an den Analysten, nicht an den Autor.
Also plante der Planer Klicks auf Buttons, die niemand gedrückt hatte, und beschrieb, was sie seiner Vorstellung nach öffnen würden. Ein Satz wie „Das öffnet deine maßgeschneiderten Buchungsoptionen“ konnte über einer stehenden Einstellung der Startseite laufen.
Wir verglichen bereits jeden Satz nach dem Dreh mit seiner Aufnahme und schrieben die unpassenden um. Doch eine nachträgliche Reparatur bleibt an die Länge eines Satzes gebunden, der für etwas anderes geschrieben wurde. Die Lösung musste vor dem Drehbuch kommen.
Der Rundgang: fotografieren, drücken, noch einmal hinsehen
Der Rundgang ist ein neuer Schritt der Sonde, des Teils von PageToVid, der eine Website liest, bevor irgendetwas geplant wird. Nach dem üblichen Lesen geht er durch die Website wie ein aufmerksamer Erstbesucher:
- er fotografiert bis zu 12 Motive dort, wo sie auf der Seite stehen, zuerst die in deinem Briefing genannten, wobei die Hauptseite mindestens die Hälfte behält;
- er drückt bis zu 6 der klickbaren, jedes einmal, auf einer Arbeitskopie der Seite;
- nach jedem Drücken liest er Adresse und Text erneut und macht ein zweites Foto.
Jedes Drücken bekommt ein Urteil: Es hat eine Seite geöffnet, die Seite mit einem Dialog oder Panel verändert, nichts getan, eine Anmeldetür erreicht oder die Website verlassen. Ein Cookie-Hinweis, der bei der ersten Interaktion erscheint, wird nicht für das gehalten, was der Button geöffnet hat.
Die Buttons, die wir nie drücken
Die Buttons eines anderen zu drücken, verlangt Regeln vor Funktionen. Der Rundgang drückt nie:
- ein Element zum Anmelden, Registrieren, Kaufen, Senden oder Herunterladen;
- einen Anruf- oder Messenger-Button;
- irgendetwas, das die Website verlässt;
- eine Dateiauswahl oder ein Formularfeld.
Diese Elemente können trotzdem in einem Film vorkommen, höchstens als Spotlight. Der ganze Rundgang dauert höchstens 45 Sekunden. Eine Website, die nicht mitspielt, liefert weniger Bilder, nie einen gescheiterten Film. Und ein einziger Schalter stellt den Rundgang ab und die bisherigen Anweisungen des Planers exakt wieder her, so vergleichen wir beide Wege auf derselben Website.
Ein Drehbuch, nach den Bildern geschrieben
Der Planer bekommt jetzt jedes Foto mit Bildunterschrift, das Nachher-Bild jedes Drückens, das etwas geöffnet hat, und eine Regel: Ein Satz sagt, was seine Einstellung zeigt. Ein Klick wird nur auf ein Drücken geplant, bei dem der Rundgang gesehen hat, dass sich etwas öffnet, und der Satz beschreibt das Nachher-Bild.
Dann hält der Code den Plan daran fest. Ein Klick auf einen Button, der nichts getan hat, auf eine Tür oder auf ein Element, das der Rundgang verweigert hat, wird zum Spotlight, und die Szene nach einem Klick, der eine Seite geöffnet hat, macht auf dieser Seite weiter, als Tour.
Ein weiterer Schritt sorgt dafür, dass keine gute Tour liegen bleibt. Nennt eine Szene einen Button mit mindestens zwei Wörtern seiner Beschriftung, und hat der Rundgang gesehen, dass dieser Button etwas öffnet, wird die Szene zu diesem Klick, höchstens zwei pro Film. Ein zweiter Button mit derselben Beschriftung auf derselben Seite teilt das Urteil des ersten.
Was sich auf echten Websites verändert hat
Wir haben vor dem Start drei Websites gemessen. Das Hochformat-Tutorial eines Fahrradladens bekam zwei echte Touren: von der Startseite zu den Ersatzteilen und zur Werkstattbuchung. Die Demo eines Software-Dashboards klickte drei Panels an, jedes beim Öffnen gesehen, und führte durch sie. Unsere eigene Landingpage tippte eine Webadresse ein, klickte „Alle Beispiele ansehen“ und endete mit einem Spotlight auf dem Absende-Button, den sie nicht drücken darf.
Der Testlauf hat auch geschärft, wie wir die Motive einer Seite auflisten: Ein Button, dessen Text mit einem Icon beginnt, wird jetzt nach seinen Wörtern gelesen und lässt sich filmen wie jeder andere. Als Nächstes stehen Single-Page-Apps auf unserer Liste, deren Tabs als ein einziger Navigationsblock kommen, damit der Rundgang auch sie öffnen kann.
Jeder neue Film, den du unter /new startest, beginnt jetzt mit dem Rundgang. Erst hinsehen, dann schreiben.
Sieh es auf deiner eigenen Website
Füge eine Seite ein und bekomme das vertonte Video, um das es in diesem Blog geht. Das erste ist kostenlos.
Weiterlesen


