Bewegung

Das Theme bewegt die Seite sparsam. Die Bewegung soll einem Besucher zeigen, was gerade passiert, und das Auge einmal führen. Sie wiederholt sich nicht, und sie hält nichts auf. Die Bewegung ist von Anfang an eingeschaltet. Du musst nichts einstellen.

Was sich bewegt

• Abschnitte erscheinen beim Scrollen. Überschrift und Inhalt eines Abschnitts gleiten ein kleines Stück hoch und blenden ein, einmal, wenn sie ins Bild kommen. Die Karten einer Liste folgen einander kurz nacheinander.
• Karten, Knöpfe und Pfeile reagieren auf die Maus. Eine Karte hebt sich ein wenig, ihr Bild wird leicht größer, ein Knopf steigt etwas, ein Pfeil rückt ein Stück vor. Die Linie unter einem Menüpunkt wächst von links.
• Der Kopf wird schmaler. Scrollst du, wird die Leiste oben etwas flacher und bekommt einen weichen Hintergrund. Der Inhalt darunter springt dabei nicht.
• Zahlen zählen hoch. In einem Abschnitt wie „Kennzahlen“ zählt eine Zahl einmal von null bis zu ihrem Wert.
• Menüs blenden ein. Das geöffnete Menü, aufklappbare Abschnitte und ein Dropdown erscheinen mit einer kurzen Überblendung. Ein Hinweis, den ein Besucher schließt, blendet aus.
• Seitenwechsel blenden über. Beim Wechsel zwischen zwei Seiten blendet die neue Seite kurz ein. Der Kopf bleibt dabei stehen. Das klappt nicht in jedem Browser. Wo es nicht geht, wechselt die Seite ganz normal.

Es gibt kein Parallax-Scrollen, keine Laufbänder, kein Karussell zum Blättern und keine Effekte rund um den Mauszeiger. Nur die Bilder im Seitenanfang blenden ineinander über. Dort gibt es einen Knopf, der sie anhält.

„Weniger Bewegung“ wird beachtet

Manche Menschen vertragen Bewegung auf dem Bildschirm schlecht. Telefone, Tablets und Computer haben dafür eine Einstellung, meist „Bewegung reduzieren“ oder „Weniger Bewegung“. Das Theme hält sich daran. Hat ein Besucher sie an, dann:

• erscheint nichts mit Einblenden, nichts hebt sich, nichts wird größer und keine Zahl zählt hoch,
• wechseln die Seiten ohne Überblendung,
• springt ein Link auf eine Stelle der Seite direkt dorthin,
• bleibt im Seitenanfang nur das erste Bild stehen,
• ändern Knöpfe und Links weiter ihre Farbe, wenn man darüberfährt. Das ist keine Bewegung.

Der Besucher stellt das selbst in seinem Gerät ein. Du musst dafür nichts tun und kannst es nicht für ihn tun.

Außerdem gilt immer:

• Es bewegt sich nur, was weich ein- und ausblendet oder sich verschiebt. Nichts verändert seine Größe so, dass der Text darunter wegrutscht.
• Was beim Öffnen der Seite schon im Bild ist, wird nie versteckt. Auch ohne JavaScript ist alles sichtbar.
• Mit der Maus reagieren Dinge nur auf Geräten, die eine Maus haben. Auf einem Touchscreen wird ein Knopf beim Antippen kurz dunkler.
• Im Ausdruck steht alles sichtbar da.

Bewegung abschwächen oder ausschalten

Im Backend gibt es dafür keinen Schalter. Weder im Website-Editor noch in den Einstellungen lässt sich die Bewegung abstellen oder dämpfen. Das geht nur im Child-Theme, also durch eine Agentur oder einen Entwickler. Wie das aussieht, steht für diese Leute auf der Seite Farben, Schriften, Abstände.

Wer es einfach haben will, wählt einen Stil, der es anders mitbringt. Das Theme kennt zwei Stufen der Bewegung: „dezent“ ist die Vorgabe, „lebhaft“ gleitet weiter, langsamer und mit etwas größeren Bildern. Der Stil „Turnverein“ hat die lebhafte Stufe. Der Stil „Feuerwehr“ hebt Karten nicht an. Sie zeigen beim Darüberfahren nur eine Linie. Der Stil „Musikverein“ lässt Abschnitte etwas langsamer einblenden. Siehe Stilvarianten.

Häufige Fragen

Die Seite wirkt auf einem Handy ruhiger als am Computer. Das ist richtig. Reaktionen auf die Maus gibt es nur, wo es eine Maus gibt.

Ein Besucher meldet, dass ihm die Bewegung unangenehm ist. Er kann in seinem Gerät „Weniger Bewegung“ einschalten. Danach bleibt die Seite ruhig.

Warum zählt die Zahl bei mir nicht hoch? Entweder hast du „Weniger Bewegung“ an, oder die Zahl steht im Text so, dass sie nicht als einzelne Zahl zu erkennen ist, etwa „10–12“. Dann bleibt sie stehen, wie du sie geschrieben hast.