Beweging

Een demo met twaalf effecten: scroll, tekst, beeld, cursor en overgang. Scroll en kijk.

Bekijk de effecten Bekijk de techniek

Demo, geen bedrijf en geen aanbod

Beweging is geen versiering. Ze laat zien wat bij elkaar hoort, wat er verandert en waar je heen gaat. De pagina werkt en leest ook stil.

Zo werkt de lopende strook

De effecten

Waarom beweging?

  1. Richting

    Beweging laat zien waar je heen gaat. Een regel die omhoog komt, wijst je oog naar waar het lezen begint.

  2. Samenhang

    Wat bij elkaar hoort, beweegt samen. Dingen die tegelijk komen, lees je als één geheel.

  3. Tempo

    Jij bepaalt het tempo, de pagina volgt. Stop je met scrollen, dan staat alles stil.

  4. Rust

    Wie geen beweging wil, krijgt dezelfde pagina stil. Zet je beweging uit, dan staan deze vier stappen gewoon onder elkaar.

Drie regels

Zo is elke sectie van deze demo gebouwd.

  1. Eerst de eindstaat

    De pagina werkt en leest zonder beweging, zonder JavaScript en na een fout. Beweging komt erbovenop.

  2. Eén hoofdmoment per sectie

    Elke sectie draait om één beweging. De rest blijft rustig, zodat die ene opvalt.

  3. Jij kunt het uitzetten

    De pagina volgt de instelling van je besturingssysteem, of je kiest zelf Beweging uit in het menu of onderaan. Dan bouwt de pagina zich live af en op, zonder herladen.

Zet beweging uit en kijk wat er blijft

Alles blijft staan, behalve de beweging. De pagina bouwt zichzelf live af en op, zonder herladen. Jij kunt het uitzetten. Zonder scripts staat de beweging al uit.

Alle twaalf

Kies een effect voor de uitleg en de echte waarden.

Laden…