Keine eigenen Pixel-Werte. Keine Änderungen im Reiter Stil. Eine Komponenten-Klasse pro Element. Wenn du diese drei Regeln einhältst, bleibt die Website dauerhaft pflegbar.
1. Keine eigenen Pixel-Werte
Trage in Elementor keine festen Werte für Schriftgrößen, Abstände oder Ränder ein — also kein 23px, kein 14px.
Warum: Feste Pixel bleiben auf dem Handy genauso groß wie am Monitor. Die Werte im System skalieren mit der Bildschirmbreite. Ein selbst eingetippter Abstand von 80px wirkt am Desktop richtig und sprengt mobil das Layout.
Stattdessen: Abstand-Helfer wie u-mb--xl oder u-p--l.
2. Klassen statt Stil-Reiter
Das Aussehen kommt aus der Klasse, nicht aus dem Reiter Stil. Farben, Schriftarten und Schriftgrößen dort zu ändern, sieht kurzfristig richtig aus — aber das Element hängt danach nicht mehr am zentralen Design.
Warum: Wenn die Markenfarbe sich ändert, zieht die ganze Website automatisch mit — nur die per Hand gefärbten Elemente nicht. Die findet man dann einzeln wieder. Bei 40 Seiten wird das eine lange Suche.
3. Eine Klasse pro Element
Schreib c-btn--primary, nicht c-btn c-btn--primary. Die kurzen Grundformen (c-btn, t-text, t-heading) sind interne Bausteine und gehören nicht in den Editor.
Die eine Ausnahme: Helfer-Klassen mit u- regeln nur Abstand, Breite oder Sichtbarkeit — nie das Aussehen. Sie dürfen zusätzlich stehen:
t-heading--l u-mb--xl — Sektionsüberschrift mit großem Abstand nach unten.
Was du nicht kombinierst: zwei Varianten derselben Familie. c-btn--primary c-btn--secondary ergibt keinen Sinn — das Ergebnis ist zufällig.