Haltepunkte (auch als Bildschirmgrößen bezeichnet) sind Pixelbereiche, die der Breite verschiedener Geräte entsprechen, z. B. desktop, Tablets und Mobilgeräte. Wenn sich die Breite eines Geräts innerhalb eines vordefinierten Pixelbereichs für Haltepunkte befindet, wird das Layout der Website so angepasst, dass der Inhalt und das Design für die jeweilige Gerätegröße und -ausrichtung optimiert sind. Wenn ich beispielsweise eine Website auf einem desktop Computer ansehe, kann ich das gesamte Website-Menü anzeigen, aber wenn ich die Website auf meinem Mobilgerät ansehe, sehe ich stattdessen ein Hamburger-Menü.
Im Folgenden sind die Haltepunkte aufgeführt, die im Editor angeboten werden:
-
desktop (1025px-1399px). Dies ist der Standardhaltepunkt.
-
Tablette (768px-1024px)
-
Mobil (767px und darunter). Es wird immer empfohlen, Änderungen an Haltepunkten auf Mobilgeräten auf einem Mobilgerät zu überprüfen, anstatt die Größe eines desktop Bildschirms zu ändern.
Wenn Sie Entwurfs-, Layout - oder Inhaltsänderungen am standardmäßigen desktop Haltepunkt vornehmen, werden die Änderungen automatisch auf die anderen Haltepunkte angewendet. Wenn Sie Inhalte ändern, z. B. einen widgethinzufügen, Text bearbeiten oder einen Abschnitt hinzufügen oder löschen, wird die Änderung automatisch auf alle anderen Haltepunkte angewendet, unabhängig davon, an welchem Haltepunkt die Änderung vorgenommen wurde. Wenn Sie z. B. einen widget zum Tablet-Haltepunkt hinzufügen, wird der widget auch allen anderen Haltepunkten hinzugefügt.
Wenn Sie jedoch Änderungen an der Position oder Größe eines Elements an bestimmten Haltepunkten vornehmen, werden die Änderungen nicht auf andere Haltepunkte angewendet. Wenn Sie z. B. die Größe eines Elements am Haltepunkt für Mobilgeräte ändern, gilt die Änderung nur für die Haltepunkte für Mobilgeräte und Landschaften für Mobilgeräte und nicht für andere Haltepunkte.
Responsive Websites funktionieren auf Desktops, Tablets und Smartphones. Aus diesem Grund können Sie in unserem responsiven Editor beim Bearbeiten eine Vorschau der Website für diese Ansichten anzeigen lassen. So können Sie vor dem Veröffentlichen überprüfen, wie Ihre Website auf verschiedenen Geräten dargestellt wird, und sicherstellen, dass Ihre Website auf jedem Gerät gut aussieht.
Klicken Sie auf eines der Gerätesymbole in der oberen Navigationsleiste, um die Geräteansicht zu wechseln:
Bei den verschiedenen Geräteansichten handelt es sich nicht um verschiedenen Versionen Ihrer Website. Wenn Sie ein Element in einer Ansicht (z. B. für Mobilgeräte) löschen, wird das Element von der gesamten Website gelöscht (also für Desktops, Tablets und Mobilgeräte). Anstatt ein Element zu löschen, können Sie es mit der rechten Maustaste anklicken und auf einem bestimmten Gerät ausblenden.
Die Gerätevorschauen zeigen nicht immer genau das, was letztendlich tatsächlich auf einem Gerät zu sehen ist. Funktionen wie Schriftarten, die Größe des Gerätefensters, die Benutzeroberfläche und das Browser-Verhalten können zur Folge haben, dass diese Vorschauen mehr oder weniger ungenau sind. Wenn Sie ganz genau wissen möchten, wie Ihre Website auf einem bestimmten Bildschirm aussieht, testen Sie die Ansicht mit einem echten Gerät.
Kommentare
0 Kommentare
Zu diesem Beitrag können keine Kommentare hinterlassen werden.