Skalierendes Design-System
Textgrößen, Abstände, Paddings – alles skaliert automatisch und elegant. Kein Rätselraten, kein Nachjustieren. Einfach ein solides, variables System, das sich an kleine Gerätegrößen anpasst.
100 % fluid & automatisch skalierend
Weniger Aufwand. Keine komplizierten Formeln. Alles passt sich an.
Weniger Aufwand. Keine komplizierten Formeln. Alles passt sich an.
Stell dir vor, du musst nicht mehr ewig herumprobieren, bis die Schriftgröße auf Handy, Tablet und Desktop gut aussieht. Kein ewiges Rechnen, keine klobigen Breakpoints. Mit unserem System gibst du nur einen Wert an – und alles skaliert automatisch genau so, wie es sein soll. Für alle Bildschirmgrößen.
Abstandshalter verkleinern/vergrößern sich proportional im Verhältnis
Oft wird es so gehandhabt, dass Abstandshalter eine fixe Höhe bekommen, um einen Leerraum zwischen zwei Elementen zu setzen. Der Nachteil, Abstandshalter wirken auf kleineren Bildschirmen und Endgeräten zu hoch oder müssen manuell in der Höhe für jeden Breakpoint angepasst werden.
Abstandshalter mit wphave behalten ihr Verhältnis über alle Bildschirmbreiten hinweg. Das bedeutet, dass ein Freiraum auf großen wie auf kleinen Geräten dieselbe Proportion behält.
Intelligente Textgrößen
Verschiedene Textgrößen wie S, M, L und XL sind eine herkömmliche Methode, um dem Nutzer eine wiederverwendbare Struktur zu bieten. Oft wird es so gehandhabt, dass jede Textgröße einzeln angepasst werden kann. Das hat zu Folge, wenn man die Basis Schriftgröße anpasst, dass gespeicherte Textgrößen wie S, M, L und XL nicht mehr valide kleiner oder größer wirken wie zuvor. Eine manuelle nachjustierung ist notwendig.
Mit wphave passt du nur eine Größe an. Sobald du die Schriftgröße für den Text oder die Überschriften angepasst hast, werden alle Textgrößen wie S, M, L und XL automatisch kleiner und größer. Textgröße S bleibt danach automatisch kleiner und XL deutlich größer, im Verhältnis zur neu festgelegten Basisschriftgröße.
Responsive Steuerelemente
In der Standard-Bearbeitungsoberfläche von WordPress fehlt ein Feature, das gefragter ist denn je: Steuerelemente für Tablet- und Mobilansichten.
Ob diese Funktion jemals in den WordPress-Kern Einzug hält, ist ungewiss. Die starke Nachfrage zeigt jedoch deutlich: Instruktives, responsives Design ist keine One-Size-Fits-All-Lösung. Es gibt immer wieder spezielle Anwendungsfälle, in denen es entscheidend ist, Breiten, Abstände oder Schriftgrößen gezielt für einzelne Breakpoints anzupassen.
Unsere Lösung liefert dir genau das – ohne Umwege: Die passenden Responsive-Controls sind direkt integriert. Du kannst jederzeit in eine andere Ansichtsgröße wechseln und exakt dort Anpassungen vornehmen.
Befindest du dich in der mobilen Ansicht, gelten deine Änderungen ausschließlich für diesen Bereich. So einfach und intuitiv war responsives Design noch nie.
* Was musst du beachten?
Damit das automatische Sklalierungssystem für alle Größen wie Schriftgrößen, Innenabstände (Padding), Außenabstände (Margin) und Zwischenräume (Gap) durchweg einwandfrei funktioniert, solltest du darauf achten, immer die Einheit „REM“ anstelle von „PX“ (Pixel) zu wenden. Denn Pixel sind fest in ihrer Größe und können sich nicht automatisch anpassen.
Aber keine Sorge. Das Interface ist so ausgelegt, dass dir automatisch „REM“ als bevorzugte Einheit angezeigt wird. Andere Werte wie „PX“ oder „%“ sind zwar weiterhin auswählbar, sollten aber für Größen wie Schriftgrößen, Innenabstände (Padding), Außenabstände (Margin) und Zwischenräume (Gap) vermieden werden. Wenn du also immer ein Auge darauf hast, das du Werte mit der Einheit „REM“ verwendest, profitierst du automatisch von stufenloser Skalierung und Inhalte werden auf kleineren Endgeräten perfekt für die jeweilige Größe angezeigt.