Zeige in einer Vorschau an, wie deine Cover-Seite der Version 7.0 auf Mobilgeräten aussehen wird.

Um sicherzustellen, dass deine Cover-Seite auf jedem Gerät gut aussieht, stapelt das Responsive Design den Inhalt automatisch in einer einzigen Spalte. Dies bedeutet, dass deine Cover-Seite auf Mobilgeräten natürlich etwas anders aussieht als auf einem Computer. Das genaue Erscheinungsbild deiner Cover-Seite auf Mobilgeräten hängt von deinem Layout und Inhalt ab, jedoch findest du hier einige allgemeine Regeln.

Cover-Seiten sind in Version 7.1 nicht verfügbar. Um ein ähnliches Erscheinungsbild zu erzielen, kannst du den Header und den Footer auf bestimmten Seiten ausblenden.

Vorschau mit Geräteansicht

Nutze die Geräteansicht, um im Voraus zu sehen, wie deine Cover-Seite auf Mobilgeräten, Tablets oder Computern aussieht. Wir empfehlen außerdem, dass du deine Website auch einmal auf deinem eigenen Gerät aufrufst. Wenn du deine Website auf einem Mobilgerät besuchen möchtest, gib die Seiten-URL in die Navigationsleiste deines mobilen Browsers ein. Die Adresse deiner Website ändert sich auf Mobilgeräten nicht.

Mobile background images

Wenn du Hintergrundbilder auf deiner Cover-Seite verwendest, empfehlen wir, ein Bild ohne Text oder Ränder zu verwenden, das beim Zuschneiden eine gewisse Flexibilität bietet. Weitere Hilfe dazu findest du in unseren Best Practices für Hintergrundbilder.

Text on mobile

Wenn der Textkörper auf einer Cover-Seite eine sehr große Schriftgröße hat, können längere Wörter und Ausdrücke auf Mobilgeräten abgeschnitten werden. Für optimale Ergebnisse empfehlen wir, den Textkörper kurz zu halten, eine kleinere Schriftgröße für den Textkörper zu verwenden und Leerzeichen zwischen Wörtern hinzuzufügen.

Overall layout changes on mobile

Hier sind einige Anpassungen, die du feststellen wirst, wenn deine Cover-Seite auf einem Mobilgerät angezeigt wird:

• Split layouts (like Flash and Spotlight) stack vertically with the image stacked above the text.

• Layouts with split text (like Debut and Projector) stack the left-side text above the right-side.

• The Harbor layout splits horizontally with the map stacked above all text.