An einem verregneten Morgen Mitte November stand ich in einer kleinen Bäckerei in der Nähe vom Sendlinger Tor und wartete auf meinen Cappuccino. Vor mir in der Schlange tippte eine Frau konzentriert auf ihrem Smartphone. Sie war offensichtlich auf der Landingpage für meinen damaligen Kongress gelandet — ich erkannte das Header-Bild sofort. Doch statt sich anzumelden, sah ich, wie sie zwei- oder dreimal frustriert auf den Anmelde-Button hämmerte, der sich am unteren Rand des Bildschirms unter ein Cookie-Banner geschoben hatte. Sie gab auf, steckte das Handy weg und rückte in der Schlange vor.
In diesem Moment wurde mir schmerzhaft klar: Mein wunderschönes Desktop-Design, an dem ich wochenlang auf meinem 27-Zoll iMac gefeilt hatte, war ein echter Conversion-Killer für jeden, der gerade in der U6 zwischen Marienplatz und Münchner Freiheit saß. Ich hatte das Projekt wie eine klassische Website geplant, dabei findet das echte Leben — und damit die Lead-Generierung für einen Online-Kongress im DACH-Raum — zu 70 bis 80 % auf dem Smartphone statt, besonders wenn der Traffic über Social Media kommt.
Das Speaker-Grid: Der Albtraum auf kleinen Bildschirmen
Eines der größten Probleme bei Online-Kongressen ist die Darstellung der Experten. Auf dem Desktop sieht eine Reihe mit vier Speakern nebeneinander fantastisch aus. Mobil wird daraus oft ein endloser vertikaler Friedhof aus Bildern, der den Nutzer zum Scrollen zwingt, bis der Daumen glüht. Bei meinen ersten Versuchen mit verschiedenen Tools war das Speaker-Grid der Punkt, an dem die mobile Ansicht komplett auseinanderfiel. Bilder ragten über den Rand hinaus oder die Namen waren so klein, dass sie niemand mehr lesen konnte.
Ich habe gelernt, dass ein Standard-Seitenverhältnis für Speaker-Porträts von 1:1 der sicherste Weg ist. Es sorgt dafür, dass die Bilder auch in einer zweispaltigen mobilen Ansicht konsistent bleiben, ohne dass Köpfe unvorteilhaft abgeschnitten werden. Als ich später mit mylandingpage arbeitete, achtete ich penibel darauf, wie das System diese Gitter automatisch umbricht. Ein guter Kongress-Planer denkt nicht in Zeilen, sondern in Stapeln. Wenn du 12 oder mehr Speaker hast, müssen diese auf dem Smartphone so kompakt wie möglich präsentiert werden, ohne dass die Seite überladen wirkt.
Die 44-Pixel-Regel und das Nasen-Debakel
Erinnerst du dich an die Frau in der Bäckerei? Ihr Problem war das, was Designer die Touch-Target-Size nennen. Ich hatte eine Heatmap-Analyse für einen meiner Kongresse im frühen Februar laufen und sah etwas Absurdes: Ich hatte über 200 Klicks auf der Nase eines prominenten Speakers, aber kaum welche auf dem darunter liegenden Anmelde-Button. Warum? Weil der Button mobil so winzig skaliert wurde, dass die Leute schlicht daneben tippten. Es war dieses sinkende Gefühl im Magen, wenn man realisiert, dass man hunderte Leads verliert, nur weil die Technik den Nutzer behindert.
Heute halte ich mich strikt an die Apple Human Interface Guidelines: Jedes interaktive Element — egal ob Button oder Formularfeld — muss eine Mindestgröße von 44x44 Pixeln haben. Das klingt technisch, ist aber überlebenswichtig. Wenn ich heute im Co-Working Space sitze und Kollegen bei der Planung ihrer Events beobachte, höre ich oft das hektische Tippen auf ihren eigenen Test-Smartphones. Dieses Geräusch ist die beste Qualitätskontrolle. Wenn du mehrfach tippen musst, um ein Feld zu aktivieren, ist deine Conversion Rate bereits im Keller.
Ein weiterer kritischer Punkt ist die Geschwindigkeit. Google gibt uns mit den Core Web Vitals klare Richtwerte vor. Der Largest Contentful Paint (LCP) — also der Zeitpunkt, an dem das Hauptbild deiner Seite geladen ist — sollte unter 2,5 Sekunden liegen. Auf dem Desktop mit Glasfaser kein Problem, aber in der Münchner U-Bahn mit schwankendem LTE-Empfang eine echte Hürde. Reduziere deine Bilder auf das Nötigste und nutze moderne Formate wie WebP, sonst springen die Teilnehmer ab, bevor sie überhaupt wissen, worum es bei deinem Kongress geht.
Warum die Reduktion auf einen Call-to-Action mobil gefährlich sein kann
Oft hört man den Rat: "Mobil muss alles ganz kurz sein, nur ein Button und fertig." Meine Erfahrung aus vier Kongressen zeigt das Gegenteil. Die strikte Reduktion auf einen einzigen Call-to-Action (CTA) schadet der Conversion oft sogar. Warum? Weil mobile Nutzer bei Online-Kongressen häufig skeptischer sind. Sie scrollen schnell durch Social Media, klicken auf einen Link und landen auf deiner Seite. Sie brauchen Vertrauen, bevor sie ihre E-Mail-Adresse hergeben — besonders wegen des rechtlich notwendigen Double Opt-In (DOI) Prozesses in Deutschland.
Ich habe festgestellt, dass zusätzliche, tiefergehende Informationsblöcke unterhalb des ersten Sichtbereichs (Above the Fold) die Anmeldung deutlich steigern. Mobile Nutzer bauen Vertrauen durch Scrollen auf. Wenn sie weiter unten Details zum Ablauf, zum Veranstalter oder zu den konkreten Learnings finden, fühlen sie sich sicherer. Ein einziger Button ganz oben wirkt oft zu aggressiv, wenn der Kontext fehlt. Ich platziere das Anmeldeformular zwar prominent oben, wiederhole aber wichtige Vertrauenselemente weiter unten, gefolgt von einem zweiten CTA.
Vom iMac-Design zum Single-Column Layout
Der eigentliche Wendepunkt für mich war die Entscheidung, meine Seiten gar nicht mehr zuerst am Desktop zu gestalten. Ich skizziere das Layout jetzt direkt für das Smartphone. Ein Single-Column Layout ist dabei dein bester Freund. Alles, was am Desktop nebeneinander steht (Text links, Bild rechts), muss mobil in einer logischen Reihenfolge untereinander fließen. Dabei ist die Hierarchie entscheidend: Titel, Datum, der Nutzen des Kongresses und dann sofort das erste Formular.
Während ich mich früher stundenlang über die Platzierung von Sidebar-Elementen geärgert habe, weiß ich heute, dass diese mobil ohnehin nach ganz unten rutschen, wo sie niemand sieht. Wenn du deinen Online Kongress DSGVO konform veranstalten willst, musst du auch darauf achten, dass die Checkboxen für die Datenschutzerklärung auf dem Handy nicht so eng beieinander liegen, dass man versehentlich den falschen Link klickt. Nichts frustriert Nutzer mehr als eine Fehlermeldung, weil sie ein winziges Häkchen nicht getroffen haben.
An einem sonnigen Morgen im Mai, kurz vor meinem letzten Launch, saß ich wieder in derselben Bäckerei. Diesmal beobachtete ich niemanden, sondern testete meine eigene Seite auf drei verschiedenen Smartphones. Es lief flüssig, die Speaker-Bilder waren sauber gestapelt und der Button war so groß, dass man ihn selbst im Gehen problemlos treffen konnte. Es war das erste Mal, dass der Launch-Tag nicht mit Panik-Mails wegen technischer Hürden begann, sondern mit einer stetig wachsenden Liste. Dass ich mir über die Jahre eine solide Online Kongress Warteliste aufgebaut hatte, half natürlich auch, aber die mobile Performance war der finale Hebel, um diese Kontakte auch wirklich in Teilnehmer zu verwandeln.
Mobile Optimierung ist kein technisches "Nice-to-have". Es ist die Basis dafür, dass deine Botschaft überhaupt ankommt. Wenn du das nächste Mal an deiner Landingpage arbeitest, lass den großen Monitor aus und nimm dein Handy in die Hand. Wenn du dich dort nicht innerhalb von zehn Sekunden mit einem breiten Daumen anmelden kannst, ist die Seite noch nicht fertig.