Studio Editor: Fehlerbehebung bei Problemen mit der Reaktionsfähigkeit

5 Min. Lesezeit
Hast du Probleme mit Breakpoints im Website-Design deines Kunden? Der Studio Editor bietet dir Tools, um häufige Probleme mit der Reaktionsfähigkeit zu lösen – zum Beispiel überlappende, falsch platzierte oder falsch ausgerichtete Elemente auf verschiedenen Bildschirmgrößen. Mit den richtigen Anpassungen kannst du eine professionelle Website erstellen, die auf jedem Gerät gut aussieht.

Text, der an bestimmten Breakpoints zu klein angezeigt wird

Sieht dein Text zu klein aus, wenn du die Website deines Kunden auf kleineren Bildschirmen anzeigst? Mit einem responsiven Verhalten, das proportional skaliert, und der Max-min-Einstellung kannst du sicherstellen, dass dein Text auf jeder Bildschirmgröße gut aussieht.
Wähle den Text aus und öffne das Inspektor-Panel. Lege zunächst das Responsive Verhalten auf Proportional skalieren fest. Klicke dann unter Design auf Max-Min, um die minimale und maximale Schriftgröße festzulegen.
Screenshot des Studio Editors, der ein Textelement neben dem Inspektor-Panel zeigt. Der Bereiche für das responsive Verhalten ist hervorgehoben und die Max-min wird angeklickt.
Tipp:
Die Max-min-Einstellung wird automatisch nacheinander auf kleinere Breakpoints angewendet, sodass du ausschließlich am Desktop Änderungen an Breakpoints vornehmen musst.

Elemente über Breakpoints hinweg falsch platziert

Wenn die Position eines Website-Elements über verschiedene Bildschirmgrößen hinweg unerwartet verschoben wird, liegt dies wahrscheinlich an den Einstellungen zum Andocken und zum Rand. Führe die folgenden Schritte aus, um das Problem zu beheben und sicherzustellen, dass deine Elemente in ihrer vorgesehenen Position bleiben.
Mehrere Elemente werden verschoben
Wenn sich alle Elemente im selben Parent-Container befinden (z. B. Abschnitt, Zelle usw.) kannst du sie stapeln, um gleichbleibende Abstände und Ausrichtung zu gewährleisten.

Falsch ausgerichtete Elemente über Breakpoints hinweg

Wenn Elemente in deinem Abschnitt falsch ausgerichtet sind oder ihr Layout nicht mehr stimmt, sobald sich die Bildschirmgröße ändert, liegt dies oft an nicht-einheitlichen Andock- oder Randeinstellungen.
Befolge diese Schritte, um das Problem zu finden und zu beheben. So kannst du sicherstellen, dass deine Elemente auf allen Bildschirmgrößen korrekt ausgerichtet werden.

Überlappende Elemente über Breakpoints hinweg

Wenn du Elemente anordnest, können sie im Editor genau den richtigen Abstand haben, sich aber überschneiden, wenn du die Live-Website in verschiedenen Viewports überprüfst. Überlappungen treten in der Regel aufgrund der Positionierung oder des responsiven Verhaltens von Elementen auf.
Wenn sich Website-Elemente auf verschiedenen Bildschirmgrößen überschneiden, befolge diese Schritte, um das Problem zu identifizieren und zu beheben.