So leiten Sie mobile Benutzer auf Ihrer Website um
Haben Sie jemals versucht, die URL einzugeben m.facebook.com auf Ihrem Desktop? Probieren Sie es aus, und Sie werden sehen, dass die Website auf dem großen Bildschirm seltsam aussieht.
Versuchen Sie auf ähnliche Weise, eine zufällige lokale Website auf Ihrem Handy zu öffnen. Möglicherweise stoßen Sie auf einige Websites, die nicht für Mobilgeräte optimiert sind, und daher werden Sie auf den ersten Blick abgewiesen. Solche Websites neigen dazu, ihr mobiles Publikum an ihre Konkurrenten zu verlieren.
Responsive Webdesign
Heutzutage können Sie auf allen guten CMS-Plattformen Websites mit Responsive Design erstellen, das sich je nach Bildschirmgröße anpasst.
Es ist wichtig zu überprüfen, wie Ihre Website auf verschiedenen Geräten angezeigt wird – dies kann den Unterschied zwischen dem Engagement Ihrer Besucher auf Ihrer Website und dem Verlust Ihrer Besucher bedeuten, um nie wieder zurückzukehren.
Es ist wichtig, auch zu erwähnen, dass seit der Umstellung von Google auf Mobile First Indexing die mobile Version Ihrer Website für Google zählt, was bedeutet, dass es unwahrscheinlich ist, dass sie bei der Suche eine gute Leistung erbringt, wenn die Besucher eine schlechte Benutzererfahrung haben.
Mobile Websites
Obwohl es immer seltener wird, bevorzugen einige Unternehmen immer noch eine separate Website für mobile Benutzer. Dies bringt viele potenzielle Probleme mit sich, die leicht vermieden werden können.
Überprüfen Sie, ob Ihre Website mobilfreundlich ist
Sie können überprüfen, ob Ihre Website für Mobilgeräte korrekt eingerichtet wurde, indem Sie einen kostenlosen WooRank-Test durchführen.
Wenn Sie die separate mobile Website-Route gehen, gibt es zwei wichtige Dinge, die beachtet werden müssen, um ein großartiges mobiles Surferlebnis für Ihre mobilen Benutzer zu gewährleisten:
- Erstellen Sie eine mobile Website, die eine großartige Benutzererfahrung bietet
- Leiten Sie Ihre Website für mobile Benutzer weiter
Wenn Sie eine mobile Website mit Tools für responsives Webdesign erstellt haben, müssen Sie sich natürlich keine Gedanken über die Umleitung Ihrer mobilen Besucher machen.
Umleiten Ihrer mobilen Website
Wenn Sie eine separate mobile Website erstellen, diese jedoch nicht so konfigurieren, dass sie auf die richtige Weise an Ihre mobilen Benutzer umgeleitet wird, wird die gesamte Zeit und Mühe für die Erstellung einer mobilen Website verschwendet.
Daher werden wir heute die verschiedenen Möglichkeiten diskutieren, wie Sie mobile Benutzer auf Ihre mobile Website umleiten können. Weiterleitungen sind nur anwendbar, wenn Sie eine separate mobile Website haben.
Wie leite ich zu einer mobilen Website um?
Nachdem Sie nun erfahren haben, wie Sie Ihre mobilen Benutzer auf Ihre mobile Website umleiten, erklären wir Ihnen, wie die Umleitung funktioniert.
Es gibt den Desktop-Browser für Benutzer von Desktops und mobile Browser für Benutzer von Mobilgeräten. Beide Browsertypen senden Daten in Form eines User-Agents an den Webserver, auf dem sich Ihre Website befindet. Dieser ‚User-Agent‘ enthält Informationen, die dem Webserver mitteilen, auf welchem Gerätetyp der Browser geöffnet wird. Diese Informationen umfassen den Namen des Browsers, die Version und andere Informationen über Ihr Betriebssystem.
Versuchen Sie beispielsweise, die folgende URL auf Ihrem Smartphone einzugeben– detectmobilebrowser.com . Die Informationen, die Sie dort sehen, ähneln in etwa den Informationen, die von allen Mobilgeräten, von denen aus auf Ihre Website zugegriffen wird, an Ihren Webserver gesendet werden.
Neben der User-Agent-Erkennungsmethode gibt es noch einen weiteren Faktor, der bei der Erkennung mobiler Benutzer hilft. Dieser Faktor ist die Bildschirmauflösung. Bei modernen Geräten sind die Bildschirmauflösungen jedoch für noch kleinere Smartphone-Bildschirme höher. Daher ist der User-Agent-Faktor die häufigste Methode zur Identifizierung mobiler Benutzer.
Kommen wir nun zur Sache und sprechen über die verschiedenen Methoden, mit denen Sie eine Weiterleitung für Ihre mobilen Benutzer auf Ihre Website anwenden können.
- Die Plugin-Methode
- Die Javascript-Methode
- Die PHP-Methode
- die .htaccess-Methode
- Die neue CSS @media-Methode
Die Plugin-Methode
Wenn Sie eine CMS-Plattform (Content Management System) wie WordPress oder Joomla verwenden, haben Sie Glück. Sie verfügen über vorgefertigte Plugins, mit denen mobile Benutzer auf Ihre mobile Website umgeleitet werden können.
Einige dieser CMS-spezifischen Plugins für mobile Weiterleitungen lauten wie folgt:
Für WordPress -Einfache mobile URL-Weiterleitung, WordPress Mobile Pack
Für Joomla – Einfache mobile Erkennung
Für Magento – URL–Weiterleitungen
Für Drupal – Einfache mobile Weiterleitung, Mobile JS-Weiterleitung
Wenn Ihre Website in einem anderen CMS erstellt wurde, suchen Sie bei Google nach einem Plugin, das bei mobilen Weiterleitungen für dieses bestimmte CMS hilft.
Die JavaScript-Methode
Mit einem JavaScript-Code können Sie Ihre mobilen Besucher auf Ihre mobile Website umleiten. Dieser JS-Code kann entweder die Bildschirmgröße oder den Benutzeragenten erkennen.
Der JS-Code, der die Bildschirmgröße verwendet, finden Sie im folgenden Artikel: So leiten Sie Ihre Website auf die mobile Version um.
Der JS-Code, der den User-Agent verwendet – dieser Code in der folgenden artice: Redirect mobile devices.
Sie können diese beiden Codes auf Ihre Site anwenden. Beide Methoden haben jedoch Nachteile.
In der Bildschirmgrößenmethode definieren Sie die Bildschirmauflösung, aber heutzutage haben wir kleinere Handheld-Gerätebildschirme mit höherer Auflösung. Dies kann zu einer falschen Erkennung mobiler Benutzer führen.
Bei der User-Agent-Methode ist es schwierig, jeden neuen und kommenden User-Agent zu verfolgen und zum JS-Code hinzuzufügen. Es gibt viele User-Agents und dies ändert sich ständig mit der Entwicklung von Technologien. Schauen Sie sich zum Beispiel diese umfangreiche Liste von User-Agents an.
Und der größte Nachteil von allen ist für Benutzer, die kein JavaScript auf ihren Handys installiert haben. Obwohl die meisten Telefone mit JavaScript ausgestattet sind, deaktivieren einige es. Einige alte Blackberry-Modelle unterstützen JavaScript nicht. Um diese Hindernisse zu überwinden, können Sie die serverseitige Umleitung für Websites verwenden, die in PHP oder ASP codiert sind.
Die PHP-Methode
Wenn Ihre Website in PHP codiert ist, können Sie diese Methode verwenden, um Ihre mobilen Benutzer umzuleiten. Der Vorteil dieser Methode besteht darin, dass Sie nicht auf Browser beschränkt sind, die mit JavaScript ausgeführt werden. Sie müssen jedoch mehrere Benutzeragenten auflisten.
Damit dieses Skript funktioniert, müssen Ihre Seitenerweiterungen vorhanden sein .php und Ihr Hosting-Konto müssen PHP unterstützen. Fügen Sie den folgenden Code zum Abschnitt
Ihrer Website hinzu.
<?php $iphone = strpos($_SERVER,"iPhone"); $android = strpos($_SERVER,"Android"); $palmpre = strpos($_SERVER,"webOS"); $berry = strpos($_SERVER,"BlackBerry"); $ipod = strpos($_SERVER,"iPod"); if ($iphone || $android || $palmpre || $ipod || $berry == true) { echo "](https://s3.amazonaws.com/woocms.woorank.com/2020/05/poor-mobile-optimization.png"; } ?>
Diesen Code finden Sie im folgenden Artikel: Simple PHP Mobile Website Redirect Code.
Ersetzen Sie http://m.site.com durch die URL Ihrer mobilen Website.
das .htaccess-Methode
Eine andere alternative Methode zum Umleiten des mobilen Benutzers auf Ihre mobile Website, basierend auf dem vom Browser unterstützten MIME-Typ, ist die .htaccess-Methode. Wenn der Browsertyp beispielsweise den MIME-Typ unterstützt, der WML (Wireless Markup Language) enthält, stammt der Browser von einem mobilen Gerät.
Sie können den in diesem Artikel mit dem Titel Redirect to a Mobile Site empfohlenen Code mit platzieren .htaccess.
Aber bevor Sie diesen Code einfügen, stellen Sie sicher, dass Sie Ihre vorhandenen sichern .htaccess-Datei. Installieren der .htaccess-Code falsch kann Probleme auf Ihrer Website verursachen. Wenn Sie nicht sicher sind, wie Sie es selbst machen sollen, wenden Sie sich an einen Webentwickler.
Ersetzen Sie http://m.example.com durch die URL Ihrer mobilen Website.
Die neue CSS @media-Methode
CSS verfügt über eine integrierte Methode zur Erkennung mobiler Browser. Anschließend werden CSS-Stile basierend auf der Größe des Browserfensters angezeigt. Dafür benötigen Sie keine separate mobile Website. Sie benötigen zwei Stylesheets innerhalb einer Webseite, das erste für den Medientyp „Bildschirm“ (für Desktop-Monitore) und das andere für den Medientyp „Handheld“ (für Smartphones).
Um diese Methode zu implementieren, müssen Sie die folgenden Codes in das
-Tag Ihres HTML-Dokuments einfügen.
<br /> /* Smartphones (portrait and landscape) ----------- */<br /> @media only screen<br /> and (min-device-width : 320px)<br /> and (max-device-width : 480px)<br /> /* Styles */<br />
Diesen Code und viele weitere Variationen finden Sie auf dieser Seite mit dem Titel Media Queries for Standard Devices.
Die Verwendung dieser Methode hat viele Nachteile. Es erfordert das Hinzufügen eines großen Satzes von CSS-Code zur Site. Es gibt immer noch einige Geräte, die keine Handheld-Medientypen unterstützen und die Seiten stattdessen mit den Bildschirmeinstellungen rendern.
Daher gibt es viele Möglichkeiten, mobile Benutzer auf Ihre mobile Website umzuleiten, wie oben aufgeführt. Sie können mehrere Skripte im Kopfbereich Ihrer Website platzieren, z. B. das Skript, das die Bildschirmgröße sowie die Benutzeragenten erkennt.
Aber Ihre Arbeit ist erst erledigt, wenn Ihre mobilen Weiterleitungen auch für Suchmaschinen-Bots gut funktionieren. Insbesondere bei Google müssen einige Konfigurationen vorgenommen werden, damit zwischen der Desktop-URL und der mobilen URL unterschieden werden kann.
Weitere Informationen finden Sie im Google Webmastercentral-Blog zu Änderungen im Ranking von Smartphone-Suchergebnissen und Informationen zu von Google unterstützten Umleitungstechniken.
Sie müssen Ihrer mobilen Website eine kanonische URL hinzufügen, damit Google die Beziehung zwischen Ihrer mobilen URL und der Desktop-URL versteht.
Damit Googlebot den Standort der mobilen Seiten Ihrer Website ermitteln kann, empfiehlt Google, dass Websites Folgendes tun müssen:
Fügen Sie auf der Desktop-Seite ein rel=“alternate“ -Tag hinzu, das auf die entsprechende mobile URL verweist.
Fügen Sie auf der mobilen Seite ein rel=“canonical“ -Tag hinzu, das auf die entsprechende Desktop-URL verweist.
Auf diese Weise können die Crawler von Google die Beziehung zwischen den beiden URLs – Desktop und Mobile – verstehen.
Sobald Sie die richtigen Weiterleitungen für Ihre mobilen Benutzer auf Ihrer Website platziert haben, ist es an der Zeit zu testen, ob die Weiterleitungen für verschiedene Geräte gut funktionieren. Das manuelle Testen auf einem verfügbaren Smartphone-Gerät ist eine Möglichkeit, dies zu tun. Sie können diese mobilen Emulatoren aber auch verwenden, um das korrekte Rendern Ihrer mobilen Website auf verschiedenen mobilen Geräten zu testen.
Denken Sie daran, dass die korrekte Verwendung mobiler Weiterleitungen ein entscheidender Schritt ist, um sicherzustellen, dass Ihre mobile Website suchmaschinenfreundlich ist. Wenn Ihre Website für Ihre mobilen Benutzer nicht gut umgeleitet wird, verlieren Sie möglicherweise auch viele wertvolle Unternehmen. Daher müssen Sie sowohl für SEO als auch für positive Änderungen der Conversion-Raten sofort Maßnahmen ergreifen, um Ihre Website für Ihre mobilen Benutzer mit einer der oben genannten Methoden umzuleiten.
Dieser Blogbeitrag wurde am 15. Januar 2020 aktualisiert