Hinweis: Während unsere beliebtesten Anleitungen ins Deutsche übersetzt wurden, sind einige Anleitungen nur auf Englisch verfügbar.

Tipps, um Ihre Website für Mobilgeräte zu optimieren

Alle Squarespace-Websites sind so konzipiert, dass sie von Anfang an großartig auf Mobilgeräten aussehen. Allerdings können Ergänzungen, die Sie vornehmen – wie z. B. große Mediendateien, viele Inhalt auf einer Seite und enge Zeichenabstände – Probleme beim Laden der Website und der mobilen Anzeige verursachen. Diese Anleitung enthält unsere Best Practices, um sicherzustellen, dass Ihre Website für Mobilgeräte optimiert ist.

Die Kompatibilität Ihrer Website mit Mobilgeräten testen

Um zu sehen, wie Ihre Website auf Mobilgeräten angezeigt wird, rufen Sie sie auf einem Mobilgerät auf oder verwenden Sie Geräteansicht, um eine Vorschau davon zu erhalten, wie sie auf kleineren Bildschirmen aussieht. Sie können außerdem mehr darüber erfahren, wie verschiedene Merkmale auf Mobilgeräten angezeigt werden, indem Sie zu Wie wird meine Website auf Mobilgeräten angezeigt? gehen.

Verwenden Sie den Test auf Optimierung für Mobilgeräte von Google, um eine schnelle Beurteilung der Kompatibilität Ihrer Website mit Mobilgeräten zu erhalten. Wenn der Test ergibt, dass Ihre Website nicht für Mobilgeräte optimiert ist, oder wenn Sie Probleme beim Testen Ihrer Website auf einem Mobilgerät haben, befolgen Sie die Tipps in dieser Anleitung.

Hinweis: Der Test auf Optimierung für Mobilgeräte von Google ist ein Drittanbieter-Tool und fällt nicht in den Zuständigkeitsbereich unseres Supports.

Jedes Mobilgerät geht unterschiedlich mit Websites um

Beispielsweise können neuere Telefone besser mit großen Websites umgehen, und die Ladezeiten in einem WLAN-Netzwerk sind in der Regel kürzer (im Vergleich zu einer Mobilfunkverbindung).

Bei einigen mobilen Browsern wird möglicherweise eine Fehlermeldung angezeigt, wenn die Seitengröße zu groß ist. Befolge diese Tipps, um deine Seiten zu verkleinern.

Halten Sie Ihre Seiten unter 5 MB

Wenn ein Besucher eine Seite lädt, lädt sein Gerät den gesamten Inhalt herunter. Mobilgeräte verwenden einfache Hardware und sind für den Internetzugang auf Mobilfunknetze angewiesen, weshalb das Anfordern großer Datenmengen sie überfordern kann. Um Probleme zu vermeiden, minimieren Sie die Menge an Inhalten auf jeder Seite.

Da die Ladezeiten vom Gerät und der Verbindung abhängig sind, gibt es keine genaue Grenze. Es kann jedoch sein, dass Seiten mit mehr als 5 MB Inhalt über Mobilfunkverbindungen nur langsam geladen werden. Es gilt also: je kleiner, desto besser.

Um die Seitengröße zu überprüfen oder Tipps zum Verkleinern der Seitengröße zu erhalten, gehe zu Seitengröße für schnelleres Laden reduzieren.

Setzen Sie den Zeichenabstand auf 0 px oder höher

Wenn der Zeichenabstand einer Schriftart auf weniger als 0 px eingestellt ist, können sich die Buchstaben auf einem Mobilgerät überlappen.

Klicke im Menü „Schriftarten“ unter Globale Textstile auf das Schriftformat, das du formatieren möchtest. Stelle sicher, dass der Buchstabenabstand auf 0 px oder höher eingestellt ist. Weitere Informationen findest du unter Schriftarten ändern.

Stelle im Menü „Website-Stile“ sicher, dass der Buchstabenabstand für alle deine Schriftarten auf 0 px oder höher eingestellt ist.

image2.jpg

Verlassen Sie sich nicht auf Abstands-Blöcke

Abstands-Blöcke fügen einer Seite Leerraum hinzu und schaffen beim Anzeigen einer Website auf einem Computer minimalistische Layouts. Auf Mobilgeräten sind Abstands-Blöcke jedoch normalerweise verborgen. Dies kann das Aussehen deines Layouts für mobile Websites auf unbeabsichtigte Weise ändern. Anstatt viele Abstands-Blöcke zu verwenden, könntest du beispielsweise das Padding ändern, um mehr Leerraum hinzuzufügen.

AMP für Blog-Seiten aktivieren

Wenn Sie Squarespace zum Bloggen verwenden, aktivieren Sie Accelerated Mobile Pages (AMP), um die Ladegeschwindigkeit zu erhöhen.

Stelle sicher, dass Stil für Mobilgeräte aktiviert ist (Version 7.0)

Stil für Mobilgeräte ist in Version 7.1 immer aktiviert. Weitere Informationen findest du unter Wie wird meine Website auf Mobilgeräten dargestellt?

Die meisten Squarespace-Templates zeigen Inhalte auf Mobilgeräten in einem einzigartigen, gestapelten Layout an, sodass Besucher problemlos durch Ihre Inhalte scrollen können. Wenn Stil für Mobilgeräte deaktiviert ist, müssen die Besucher mit den Fingern heranzoomen, um auf Ihrer Website zu navigieren.

So stellen Sie sicher, dass Stil für Mobilgeräte aktiviert ist:

  1. Klicken Sie im Hauptmenü auf Design und dann auf Template-Einstellungen.
  2. Vergewissern Sie sich, dass Stil für Mobilgeräte anzeigen deaktiviert ist.

Diese Einstellung wird nur angezeigt, wenn Ihr Template das Deaktivieren von „Stil für Mobilgeräte“ unterstützt.

Weitere Tipps zur Formatierung

Weitere Tipps zur Formatierung für Mobilgeräte findest du unter Wie wird meine Website auf Mobilgeräten dargestellt? In diesem Artikel behandeln wir, wie Inhalte auf kleineren Bildschirmen angezeigt werden und wie bestimmte Arten von Inhalten für die Kompatibilität mit Mobilgeräten optimiert werden können.

War dieser Beitrag hilfreich?
128 von 304 fanden dies hilfreich
Tipps, um Ihre Website für Mobilgeräte zu optimieren