Häufige Fehler

Auf dieser Seite werden einige der häufigsten Fehler beschrieben, die Webmaster bei der Entwicklung von Websites für Mobilgeräte machen.

Blockierte JavaScript-, CSS- und Bilddateien

Ermögliche dem Googlebot zum optimalen Rendern und Indexieren jederzeit den Zugriff auf die von deiner Website verwendeten JavaScript-, CSS- und Bilddateien, damit der Googlebot deine Website wie ein durchschnittlicher Nutzer sieht. Wenn die "robots.txt"-Datei deiner Website das Crawlen dieser Assets verhindert, werden dadurch unsere Algorithmen beim Rendern und Indexieren deiner Inhalte unmittelbar beeinträchtigt. Dies kann suboptimale Rankings zur Folge haben.

  1. Verwenden Sie in der Search Console die Funktion Abruf wie durch Google, um zu prüfen, ob der Googlebot Ihre JavaScript-, CSS- und Bilddateien crawlen kann. Mithilfe dieser Funktion sehen Sie Ihre Inhalte, wie der Googlebot sie sieht und rendert. Außerdem haben Sie so die Möglichkeit, bestimmte Probleme mit der Indexierung auf Ihrer Website zu ermitteln und zu beheben.

  2. Prüfen und testen Sie die "robots.txt"-Datei in der Search Console.

  3. Testen Sie Ihre mobilen Seiten mit dem Test auf Optimierung für Mobilgeräte, um zu ermitteln, ob unsere Systeme Ihre Website als für mobile Nutzer kompatibel erkennen.

  4. Falls Sie separate URLs für Ihre mobilen Seiten verwenden, testen Sie die URLs sowohl für Mobilgeräte als auch für Computer, um zu gewährleisten, dass die Weiterleitung erkannt wird und gecrawlt werden kann.

Nicht abrufbare Inhalte

Manche Video- oder Inhaltstypen sind auf Mobilgeräten nicht abrufbar. Hierzu zählen beispielsweise lizenzbeschränkte Medien oder Formate, für die Flash Player oder andere Player benötigt werden, die auf diversen Mobilgeräten nicht unterstützt werden. Nicht abrufbare Websiteinhalte können für Nutzer sehr frustrierend sein.

Wenn Nutzer eine Seite mit Inhalten besuchen, die auf Mobilgeräten nicht unterstützt werden, wird ihnen eine Fehlermeldung wie die folgende angezeigt:

Video nicht abrufbar

Das Ergebnis ist eine schlechte Nutzererfahrung auf Mobilgeräten.

Wir empfehlen, keinen selbst entwickelten Videoplayer zu verwenden bzw. keine Inhalte in nicht unterstützten Formaten einzufügen, sondern Videos oder Animationen mithilfe von HTML5-Standard-Tags zu integrieren.

Für animierte Inhalte, die mit Flash Player oder anderen Multimediaplayern gerendert werden, solltest du HTML5-Animationen verwenden, die in allen Webbrowsern funktionieren. Mit Google Web Designer kannst du diese Animationen problemlos in HTML5 erstellen.

  • Nutze HTML5-Standards für Animationen, damit alle Nutzer deine Inhalte problemlos ansehen können.
  • Achte bei der Videoeinbettung darauf, dass die Videos auf allen Geräten abgespielt werden können.
  • Stellen Sie gegebenenfalls das Videotranskript zur Verfügung. Hierdurch können auch Personen auf Ihre Website zugreifen, die unterstützende Browsertechnologien nutzen oder Browser haben, die keine selbst entwickelten Videoformate wiedergeben können.

Weitere Informationen erhalten Sie in den Web Fundamentals von Google in unseren Best Practices zu Videos.

Fehlerhafte Weiterleitungen

Wenn du mit separaten mobilen URLs arbeitest, musst du mobile Nutzer für jede Desktop-URL zur entsprechenden mobilen URL weiterleiten. Es wäre nicht korrekt, sie zu anderen Seiten weiterzuleiten, beispielsweise immer zur Startseite.

Beispiele:

  • Der Server Ihrer Desktop-Website ist so konfiguriert, dass mobile Nutzer unabhängig von der ursprünglich angeforderten URL zur Startseite der mobilen Website weitergeleitet werden, selbst wenn die entsprechende Seite zur weiterleitenden Desktop-Seite auf der mobilen Website vorhanden ist.
  • Die URLs Ihrer Desktop-Website werden dynamisch mit URL-Parametern generiert, die der entsprechenden mobilen URL nicht einwandfrei zugeordnet werden können. So ist es z. B. frustrierend für einen Nutzer, wenn er auf der Desktop-Website eine Zugverbindung für ein bestimmtes Datum sucht und zur allgemeinen Fahrplansuchseite auf der mobilen Website weitergeleitet wird. Wir empfehlen, die Weiterleitung korrekt zu konfigurieren, wenn eine entsprechende mobile URL vorhanden ist, damit die Nutzer auf genau die Seite gelangen, die sie gesucht haben.

  • Manche Mobilgeräte werden weitergeleitet, andere nicht. Zum Beispiel leitet eine Website unter Umständen nur Android-Nutzer zur mobilen Website weiter, nicht aber iPhone- oder Windows Phone-Nutzer.

  • Verwenden Sie die Search Console. Wenn Sie ein bestätigter Nutzer sind, senden wir Ihnen eine Nachricht, wenn wir feststellen, dass Smartphone-Nutzer von einer Seite auf Ihrer Website zur Startseite weitergeleitet werden. Außerdem weisen wir Sie auf fehlerhafte Weiterleitungen hin, die wir im Bereich Smartphone-Crawling-Fehler der Search Console gefunden haben. Nutzen Sie die von uns in der Search Console bereitgestellten Beispiel-URLs als Ansatz, um das Debugging genau an dem Punkt durchzuführen, an dem das Problem in der Serverkonfiguration besteht.

  • Richten Sie Ihren Server so ein, dass Smartphone-Nutzer zur entsprechenden URL auf Ihrer mobilen Website weitergeleitet werden.

  • Falls für eine Seite auf Ihrer Website keine mobile Version vorhanden ist, verwenden Sie die Desktop-Seite und leiten Sie Nutzer nicht zur Startseite der für Smartphones optimierten Website weiter. In diesem Fall ist es besser, nichts zu tun, anstatt das Falsche zu tun.

  • Nutzen Sie responsives Webdesign, mit dem für Desktop- und Smartphone-Nutzer dieselben Inhalte bereitgestellt werden.

404-Fehler nur für mobile Seiten

Auf einigen Websites werden Desktop-Nutzern, die eine URL aufrufen, Inhalte bereitgestellt, während mobilen Nutzern eine Fehlerseite angezeigt wird.

404-Fehler nur für mobile Seiten

Wenn Sie feststellen, dass ein Nutzer eine Desktop-Seite über ein Mobilgerät aufruft, und wenn eine entsprechende mobile Seite mit einer anderen URL vorhanden ist, sollten Sie ihn zur Gewährleistung einer optimalen Nutzererfahrung zu dieser URL weiterleiten, anstatt eine 404- oder eine Soft 404-Seite zu schalten. Achten Sie auch darauf, dass die für Mobilgeräte optimierte Seite selbst keine Fehlerseite ist.

Funktionierende Weiterleitungen
  • Verwenden Sie die Search Console. Wenn Sie ein bestätigter Nutzer der entsprechenden Website sind, senden wir Ihnen im Nachrichten-Center eine Benachrichtigung.

  • Falls Sie eine Smartphonewebsite mit einer separaten URL haben, richten Sie Ihren Server so ein, dass er Smartphonenutzer zur entsprechenden URL auf der Smartphonewebsite weiterleitet.

  • Wenn Sie mit dynamischer Bereitstellung arbeiten, achten Sie darauf, dass die User-Agent-Erkennung richtig konfiguriert ist.

  • Falls es keine Smartphoneseite für eine bestimmte Seite gibt, verwenden Sie die Desktop-Seite. So sieht der Nutzer die gesuchten Inhalte anstatt einer Fehlermeldung.

  • Nutzen Sie, falls möglich, responsives Webdesign. Durch diese Konfiguration können Sie Nutzern geräteunabhängig dieselben Inhalte bereitstellen.

  • Prüfen Sie den Bericht zu Crawling-Fehlern in der Search Console. Auf dem Tab "Smartphone" sehen Sie eine Liste der erkannten URLs, die 404-Fehler nur für Smartphones zurückgeben.

Interstitials vermeiden

Auf vielen Websites werden Interstitials oder Overlays eingeblendet, die die Inhalte der vom Nutzer aufgerufenen Seite teilweise oder vollständig verdecken. Diese Interstitials, die häufig auf Mobilgeräten eingeblendet werden, um für die eigene App einer Website zu werben oder Registrierungsformulare für Mailinglisten oder Anzeigen zu präsentieren, beeinträchtigen die Nutzererfahrung. Im Extremfall ist das Interstitial so konzipiert, dass der Nutzer es nur schwer schließen kann, um den eigentlichen Inhalt der Seite zu sehen. Da der Platz auf dem Display von Mobilgeräten begrenzt ist, wirken sich Interstitials grundsätzlich negativ auf die Nutzererfahrung aus.

App-Download-Interstitials

Viele Webmaster werben bei Besuchern ihrer mobilen Website für die systemeigenen Apps ihres Unternehmens. Falls das nicht mit der nötigen Sorgfalt geschieht, kann dies zu Indexierungsproblemen führen und die Nutzung der Website durch den Besucher beeinträchtigen.

Interstitials vermeiden
Der Nutzer wird durch das Interstitial aufgehalten und kann nicht die gewünschten Aktionen durchführen.
App-Banner
Wenn Sie jedoch ein Banner verwenden, kann der Nutzer weiter die gewünschten Aktionen durchführen, während die App präsentiert wird.
  • Verwenden Sie in den Seiteninhalten ein einfaches Inline-Banner, um für Ihre App zu werben. Dieses Banner kann folgendermaßen implementiert werden:

    • Mit einem vom Browser unterstützten Banner wie Smart App-Banner für Safari oder einem systemeigenen App-Banner für Chrome
    • Mit einem HTML-Banner oder -Bild ähnlich einer klassischen kleinen Werbeanzeige, das mit dem richtigen App-Store zum Download verlinkt ist
  • Bei Android-Apps kann es sinnvoll sein, die App-Indexierung zu implementieren: Wenn indexierte Inhalte Ihrer App für eine bestimmte Suchanfrage relevant sind, blenden wir in den Suchergebnissen eine Installationsschaltfläche ein. So können Nutzer die App herunterladen und direkt zur entsprechenden Seite in Ihrer App wechseln.

Bei Websites, die Nutzern separate mobile URLs bereitstellen, ist es üblich, Links zu der für Desktops optimierten Version und ebenso Links von der Desktop-Seite zur mobilen Seite einzubetten. Häufig wird hier der Fehler gemacht, Links zu integrieren, die auf eine irrelevante Seite zeigen, also z. B. Links auf mobilen Seiten zu platzieren, die auf die Startseite der Desktop-Website verweisen.

  • Überprüfe deine Links und achte darauf, dass sie auf die korrekte Seite verweisen.

Mobile Seiten sind langsam

Es ist ausgesprochen wichtig, dass deine mobile Website schnell geladen wird. Lange Wartezeiten beim Aufrufen der Inhalte können für Nutzer sehr frustrierend sein.

Verwende Google PageSpeed Insights und prüfe, ob deine Seite Probleme aufweist, die zu einem langsamen Laden der Seite führen können. Beachte dazu vor allen den Unterabschnitt "Geschwindigkeit". Versuche, die mit "Behebung erforderlich" gekennzeichneten Probleme zu beheben.

Weitere Informationen findest du unter den folgenden Links:

Darstellungsbereich korrekt festlegen

Da die Besucher deiner Website eine Vielzahl von Geräten mit unterschiedlichen Bildschirmgrößen nutzen, solltest du den Darstellungsbereich deiner Seiten mithilfe des Darstellungsbereich-Meta-Tags konfigurieren. Anhand dieses Tags wird festgelegt, wie die Größe und Skalierung der Seite für das jeweilige Gerät aufseiten des Browsers anzupassen ist. Meist treten die folgenden beiden Probleme auf:

  • Verwendung eines Darstellungsbereichs mit fester Breite: Dadurch kann die Seite nicht optimal an die zahlreichen verschiedenen Gerätegrößen angepasst werden. Weitere Informationen
  • Angabe eines unrealistisch breiten Mindestdarstellungsbereichs: Nutzer kleinerer Geräte sind dadurch möglicherweise gezwungen, horizontal zu scrollen, um den Inhalt zu lesen. Dies ist dann der Fall, wenn bei Seiten absolute Werte in CSS-Deklarationen verwendet oder Bilder genutzt werden, die für eine bestimmte Browserbreite optimiert sind, zum Beispiel 980 Pixel. Wenn Sie diesen Fehler beheben möchten, müssen Sie dafür sorgen, dass die Seiten relative Breiten- und Positionswerte für CSS-Elemente verwenden und dass Bilder ebenfalls skaliert werden können. Weitere Informationen

Schriftgröße zu klein

Wählen Sie für die Schrift keine Größe, die zu klein ist. Ansonsten ist der Inhalt auf einem Mobilgerät nicht lesbar und Besucher mit Mobilgeräten sind gezwungen, zu zoomen. Nach Einrichtung eines Darstellungsbereichs für Ihre Webseiten legen Sie Ihre Schriftgrößen so fest, dass diese innerhalb des Darstellungsbereichs entsprechend skaliert werden. Weitere Informationen zu den Best Practices für die Schriftgröße finden Sie unter Lesbare Schriftgrößen verwenden.

Touch-Elemente zu dicht beieinander

Achten Sie darauf, dass Touch-Elemente wie Schaltflächen und Navigationslinks nicht so dicht nebeneinander angeordnet sind, dass ein mobiler Nutzer nicht problemlos auf das gewünschte Element tippen kann, ohne dabei auch das benachbarte Element zu berühren. Wenn Sie diesen Fehler beheben möchten, achten Sie darauf, dass für Besucher auf Mobilgeräten die Größe der Schaltflächen und Navigationslinks richtig gewählt ist und ausreichend Abstand zwischen den Elementen gegeben ist. Weitere Informationen finden Sie unter Optimale Größe von Links oder Schaltflächen auf Mobilgeräten einhalten.

Feedback geben zu...