Wenn Ihre WordPress-Website immer noch nur für den Desktop gedacht ist, verlieren Sie Besucher. Mehr als die Hälfte der Besucher surfen mit ihrem Handy. Wenn Ihre Website nicht mobilfreundlich ist, werden sie sie schnell wieder verlassen.
Ich habe das auf die harte Tour gelernt, als eine meiner älteren Websites auf dem Desktop gut aussah, auf dem Handy aber völlig versagte. Der Text war winzig, das Menü funktionierte nicht, und meine Absprungrate schoss in die Höhe. Nachdem ich das Problem behoben hatte, stiegen meine Besucherzahlen und Anmeldungen fast über Nacht.
In diesem Leitfaden zeige ich Ihnen genau, wie Sie eine reine Desktop-WordPress-Website mobilfreundlich gestalten können. Diese einfachen Schritte kann jeder befolgen, auch wenn Sie noch nie einen Code angefasst haben.
- 1. Prüfen Sie, ob Ihre Website bereits mobilfreundlich ist
- 2. Wählen Sie ein mobilfähiges WordPress-Theme
- 3. Vereinfachen Sie Ihr Navigationsmenü
- 4. Sicherstellen, dass wichtige Informationen leicht zu finden sind
- 5. Große und lesbare Schriftgrößen verwenden
- 6. Halten Sie Kontakt- und Optin-Formulare kurz
- 7. Machen Sie Ihre Landing Pages mobilfähig
- 8. Ändern Sie die Größe und Platzierung Ihrer CTA-Schaltfläche
- 9. Mobile Popups entfernen oder vereinfachen
- 10. Verwenden Sie mobilfreundliche WordPress-Plugins
- 11. Geschwindigkeit der Website als Priorität
- FAQs zur Mobilfreundlichkeit einer Website
1. Prüfen Sie, ob Ihre Website bereits mobilfreundlich ist
Bevor Sie etwas ändern, sollten Sie prüfen, ob Ihre Website bereits mobilfreundlich ist. Viele neuere WordPress-Themes sind standardmäßig responsive, sodass Sie vielleicht schon auf halbem Weg sind, ohne es zu merken.
Am schnellsten geht es mit dem kostenlosen Google Mobile-Friendly-Test. Fügen Sie Ihre URL ein, drücken Sie die Eingabetaste, und Sie erhalten in Sekundenschnelle die Ergebnisse.
Der Bericht zeigt Ihnen, ob Ihre Website die Anforderungen erfüllt, sowie einen Screenshot, wie sie auf einem Telefon aussieht. Er schlägt auch Korrekturen vor, wenn etwas nicht funktioniert.
Als ich diesen Test mit einer meiner älteren Websites durchführte, waren die Ergebnisse augenöffnend. Die Schriftarten waren zu klein, die Schaltflächen überlappten sich und die Menüs ließen sich nicht öffnen. Dieser Test gab mir eine klare To-Do-Liste, um die Probleme zu beheben.
Wenn Ihre Website die Prüfung nicht besteht, sollten Sie dies zu Ihrer obersten Priorität machen. Und selbst wenn sie es schafft, lesen Sie weiter. Sie werden immer noch Möglichkeiten finden, das mobile Erlebnis weiter zu verbessern.
2. Wählen Sie ein mobilfähiges WordPress-Theme
Wenn Ihr aktuelles Theme nicht mobilfreundlich ist, besteht die schnellste Lösung darin, zu einem responsiven WordPress-Theme zu wechseln . Ein responsives Theme passt sich automatisch an jede Bildschirmgröße an, sodass Besucher nicht zoomen oder seitwärts scrollen müssen.
Sie können kostenlose Optionen direkt in WordPress finden. Gehen Sie zu Erscheinungsbild " Themes " Neu hinzufügen und suchen Sie nach "Responsive". Sie sehen eine Reihe von Themes, die für Mobilgeräte geeignet sind und die Sie mit einem Klick installieren können.
Als ich dies zum ersten Mal auf einer meiner älteren Websites getestet habe, löste der Wechsel zu einem responsiven Theme sofort die Hälfte meiner Layout-Probleme. Es war die einfachste Verbesserung, die ich hätte machen können.
Wenn Sie lieber etwas Einzigartiges erstellen möchten, empfehle ich SeedProd. Es ist ein Drag-and-Drop-Theme-Builder, mit dem Sie Ihr eigenes responsives WordPress-Theme entwerfen können, ohne den Code zu berühren.
Sie können mit einer vorgefertigten Vorlage beginnen oder jeden Abschnitt Schritt für Schritt erstellen. In beiden Fällen sehen Sie Ihre Änderungen live im visuellen Editor, und alles, was Sie erstellen, ist vollständig mobilfähig.
Das bedeutet, dass Ihre Website großartig aussieht und auf Handys, Tablets und Desktops reibungslos funktioniert, ohne dass zusätzliche Anpassungen erforderlich sind.
3. Vereinfachen Sie Ihr Navigationsmenü
Die Bildschirme von Mobiltelefonen sind viel kleiner als die von Desktops, weshalb lange, komplizierte Menüs nicht gut funktionieren. Wenn Besucher zoomen oder seitwärts scrollen müssen, nur um einen Link zu finden, werden sie wahrscheinlich aufgeben.
Am besten ist es, wenn Sie Ihre Navigation einfach halten. Beschränken Sie Ihr Menü auf einige wenige Hauptpunkte, die auf einen Bildschirm passen. Dies erleichtert es den Nutzern, schnell zum gewünschten Ziel zu gelangen.
Als ich eines meiner eigenen Menüs auf drei Hauptlinks vereinfachte, war der Unterschied enorm. Die Nutzer verbrachten mehr Zeit auf der Website, weil sie tatsächlich finden konnten, was sie brauchten.
Wenn Sie nicht sicher sind, wie Sie Ihr Menü responsive gestalten können, lesen Sie diese Schritt-für-Schritt-Anleitung zur Erstellung eines für Mobilgeräte geeigneten WordPress-Menüs.
4. Sicherstellen, dass wichtige Informationen leicht zu finden sind
Wenn Menschen Ihre Website per Telefon besuchen, suchen sie in der Regel nach etwas Bestimmtem. Das kann eine schnelle Antwort sein, Ihre Kontaktdaten oder sogar eine Wegbeschreibung zu Ihrem Unternehmen.
Wenn diese Informationen verborgen sind, werden sie die Seite verlassen. Auf dem Handy fühlt sich jeder zusätzliche Tipp langsam und frustrierend an.
Denken Sie an die Details, die Ihre Besucher am meisten brauchen, und stellen Sie sicher, dass diese im Mittelpunkt stehen. Einige einfache Möglichkeiten, dies zu tun, sind:
- Hinzufügen eines kleinen FAQ-Bereichs mit schnellen Antworten
- Einbetten eines kurzen Erklärvideos
- Hervorhebung Ihrer wichtigsten Merkmale oder Dienstleistungen
Als ich meine Kontaktinformationen und FAQs auf einer Website, an der ich arbeitete, weiter oben platzierte, sank die Absprungrate sofort. Die Leute mussten nicht mehr nach Antworten suchen, sie sahen sie sofort.
Sie müssen nicht alles auf Ihre Homepage packen, aber stellen Sie sicher, dass das Wesentliche offensichtlich und auf dem Handy leicht zu erreichen ist.
5. Große und lesbare Schriftgrößen verwenden
Winziger Text auf einem Handy ist fast unmöglich zu lesen. Wenn die Besucher zoomen müssen, nur um Ihre Inhalte zu sehen, bleiben sie nicht lange dabei.
Eine gute Faustregel ist, dass der Text mindestens 14-16px groß sein sollte. Überschriften und Schaltflächen sollten sogar noch größer sein, damit sie leicht zu überfliegen und anzutippen sind.
Verwenden Sie saubere Standardschriften, die schnell laden. Ausgefallene benutzerdefinierte Schriftarten mögen auf dem Desktop schön aussehen, aber auf dem Handy können sie Ihre Website verlangsamen und das Lesen erschweren.
Als ich auf einem meiner Blogs die Schriftgröße erhöhte, war der Unterschied sofort spürbar: Die Absprungraten sanken, und die Leser blieben länger auf den Seiten, weil sie auf ihren Handys bequem lesen konnten.
Weitere Einzelheiten finden Sie in unserem Leitfaden zur Typografie im Webdesign.
6. Halten Sie Kontakt- und Optin-Formulare kurz
Lange Formulare sind einer der größten Abschreckungsfaktoren auf dem Handy. Das Eintippen vieler Details auf einem kleinen Bildschirm ist frustrierend, und die meisten Leute werden es nicht beenden.
Sehen Sie sich Ihre Formulare an und fragen Sie sich, ob jedes Feld wirklich benötigt wird. Wenn Sie zum Beispiel eine E-Mail-Liste aufbauen, brauchen Sie normalerweise nur einen Namen und eine E-Mail-Adresse.
Wenn Ihr Ziel der Verkauf ist, sollten Sie die Formulare für die Kaufabwicklung so kurz wie möglich halten - nur Rechnungs- und Versandinformationen. Die Abfrage zusätzlicher Details erhöht die Reibungsverluste und die Zahl der Kaufabbrüche.
Ich habe einmal das Anmeldeformular eines Kunden von sechs auf zwei Felder reduziert, und die Konversionsrate hat sich fast verdoppelt. Auf dem Handy ist kürzer immer besser.
7. Machen Sie Ihre Landing Pages mobilfähig
Landing Pages sind der Ort, an dem die meisten Konversionen stattfinden, aber wenn sie auf dem Handy nicht gut funktionieren, lassen Sie Geld auf dem Tisch liegen. Ich habe gesehen, wie Seiten, die auf dem Desktop perfekt aussahen, auf dem Handy komplett auseinanderfielen: abgeschnittene Schaltflächen, überlappender Text und Formulare, die nicht ausgefüllt werden konnten.
Die einfachste Lösung ist die Verwendung eines WordPress-Seitenerstellungsprogramms mit integrierten mobilen Steuerelementen. Auf diese Weise können Sie einmal entwerfen und wissen, dass es auf jedem Bildschirm gut aussieht.
SeedProd macht dies einfach. Es enthält eine Bibliothek mit responsiven Landing Page-Vorlagen, die Sie mit einem Klick importieren können. Von dort aus können Sie alles im Drag-and-Drop-Editor anpassen - kein Code erforderlich.
Am besten gefällt mir, dass Sie mit SeedProd sofort zwischen der Desktop- und der mobilen Ansicht umschalten können. Sie können Abstände, Schriftgrößen und die Platzierung von Schaltflächen speziell für kleinere Bildschirme anpassen, und das alles von derselben Seite aus.
Vor der Veröffentlichung können Sie eine Live-Vorschau der mobilen Version anzeigen und vor Ort Anpassungen vornehmen. So können Sie mit der Gewissheit starten, dass Ihre Seite sowohl auf dem Desktop als auch auf dem Handy konvertiert.
8. Ändern Sie die Größe und Platzierung Ihrer CTA-Schaltfläche
Ihre Call-to-Action-Schaltflächen (CTA) sind der wichtigste Teil Ihrer Seite, aber auf mobilen Geräten gehen sie oft verloren. Wenn Besucher sie nicht sehen oder leicht antippen können, verpassen Sie Konversionen.
Machen Sie Ihre Schaltflächen groß genug, um sie mit dem Daumen antippen zu können, und platzieren Sie sie dort, wo die Nutzer normalerweise scrollen - in der Regel in der Mitte oder unten auf dem Bildschirm. Vermeiden Sie es, zu viele CTAs auf einer Seite zu stapeln, da dies zu Verwirrung führt.
Eine Studie hat ergeben, dass die CTA-Schaltflächen auf über der Hälfte der Websites mehr als 3 Sekunden benötigen, um gefunden zu werden. Wenn Ihr Button auf Anhieb erkennbar ist, haben Sie bereits einen Vorteil.
Ich habe einmal eine Anmeldeschaltfläche auf einer Landing Page weiter oben platziert und damit die Conversions auf dem Handy verdoppelt. Manchmal macht eine einfache Änderung der Platzierung den größten Unterschied.
9. Mobile Popups entfernen oder vereinfachen
Popups können auf dem Desktop gut funktionieren, aber auf dem Handy schaden sie oft mehr als sie nützen. Kleine Bildschirme machen es schwer, sie zu schließen, und wenn ein Nutzer auf die falsche Stelle tippt, wird er möglicherweise versehentlich auf eine andere Seite weitergeleitet.
Die beste Lösung ist, Popups leicht und unaufdringlich zu halten. Versuchen Sie statt eines bildschirmfüllenden Popups eine schwebende Hallo-Leiste oder ein kleines Slide-In, das nicht die gesamte Ansicht versperrt.
Auf einer Website, mit der ich gearbeitet habe, hat das Ersetzen eines großen Eingangspopups durch eine kleine untere Leiste zu weniger Beschwerden geführt und die Konversionsrate sogar erhöht. Die Nutzer konnten weiter surfen, ohne sich unterbrochen zu fühlen.
Wenn Sie weitere Ideen suchen, finden Sie hier einen Leitfaden zu den besten Praktiken für mobile Popups von OptinMonster, der Strategien enthält, die funktionieren, ohne mobile Besucher zu frustrieren.
10. Verwenden Sie mobilfreundliche WordPress-Plugins
Nicht jedes WordPress-Plugin ist für mobile Geräte konzipiert. Die Auswahl der richtigen Plugins kann einen großen Unterschied machen, wenn es darum geht, wie gut Ihre Website auf einem Telefon funktioniert.
Suchen Sie nach Plugins, die leichtgewichtig, reaktionsfähig und auf kleinen Bildschirmen getestet sind. Einige gute Optionen sind:
- Mobilfreundliche Formular-Plugins
- Responsive Werbegeschenk- oder Wettbewerbs-Plugins
- Plugins für Social Media Feeds, die die Größe für mobile Geräte anpassen
- WordPress-Caching-Plugins für schnelleres Laden
- Responsive Menü-Plugins
Auf einer meiner eigenen Websites konnte ich durch den Wechsel zu einem leichteren Formular-Plugin die mobile Ladezeit halbieren. Die Erfahrung fühlte sich reibungsloser an, und die Konversionen stiegen sofort.
Weitere Empfehlungen finden Sie in dieser Zusammenstellung der besten WordPress-Plugins für mobile Geräte.
11. Geschwindigkeit der Website als Priorität
Eine langsame Website ist auf dem Handy ein entscheidender Faktor. Untersuchungen zeigen, dass selbst eine Verzögerung von 3 Sekunden mehr als die Hälfte der Besucher zum Verlassen der Seite veranlassen kann. Auf kleinen Bildschirmen, wo die Menschen sofortige Ergebnisse erwarten, ist die Geschwindigkeit sogar noch wichtiger.
Der einfachste Weg, Ihre Website schnell zu halten, ist ein sauberes Design und die Vermeidung von unnötigem Durcheinander. Jedes zusätzliche Skript, Bild oder Plugin erhöht die Ladezeit.
Einige bewährte Methoden zur Steigerung der Geschwindigkeit Ihrer Website sind:
- Größe ändern und große Bilder komprimieren
- Verwendung eines Content Delivery Network (CDN)
- Langsames Laden für Bilder und Videos aktivieren
- WordPress, Themes und Plugins auf dem neuesten Stand halten
- CSS- und JavaScript-Dateien verkleinern
- Schwere Hintergrundprozesse reduzieren
Als ich auf einer meiner Websites Bilder optimierte und ein CDN hinzufügte, sanken die mobilen Ladezeiten um die Hälfte. Die Absprungrate sank sofort, und die Nutzer blieben länger auf jeder Seite.
Ausführlichere Tipps finden Sie in diesem ultimativen Leitfaden zu Geschwindigkeit und Leistung von WordPress.
FAQs zur Mobilfreundlichkeit einer Website
Ich hoffe, dieser Beitrag hat Ihnen geholfen zu lernen, wie Sie eine reine Desktop-Website mobilfreundlich gestalten können. Vielleicht gefällt Ihnen auch dieser Artikel über die besten SEO-Plugins für WordPress.
Wenn Sie schon einmal hier sind, vergessen Sie nicht, uns auf Facebook, Twitter und YouTube zu folgen, um weitere hilfreiche Tipps und Anleitungen zu erhalten.
