Vastgezette sectie
Zet een blok even vast in beeld terwijl de pagina eronder doorscrolt — voor een boodschap die moet blijven hangen.
Zet een blok tijdelijk vast in beeld terwijl de rest van de pagina eronder doorscrolt — zo blijft een belangrijke boodschap of visual even hangen bij de bezoeker. Hoe lang het blijft staan bepaal je zelf. De technische naam is GsapPin.
Gebruik dit block wanneer één boodschap, cijfer of visual net iets langer aandacht verdient dan een gewone scroll toelaat: een kernstatistiek, een productafbeelding waar tekst omheen scrollt, of een stappenuitleg die pas verdergaat als de vorige stap gelezen is.
Stel de afstand (end) niet te lang in — een sectie die te lang vastzit voelt eerder als een blokkade dan als nadruk. Combineer dit block met GsapCounter om een cijfer te laten oplopen terwijl het vastgezet is.
Gebruiksscenario's per site-type
Een zakelijke dienstverlener gebruikt GsapPin bijvoorbeeld om een kernstatistiek of missiezin even te laten 'plakken' terwijl de toelichting eronder doorscrolt. Een webshop kan het block inzetten om een productafbeelding vast te zetten terwijl de kenmerken ernaast één voor één in beeld scrollen. Op een portfolio-site werkt het goed voor een centraal citaat van een tevreden klant, dat blijft staan terwijl de projectdetails eromheen doorscrollen.
Veelgemaakte fouten
Een veelgemaakte fout is de end-waarde te ruim instellen, waardoor de sectie te lang vastzit en de bezoeker het gevoel krijgt vast te lopen in plaats van door te kunnen scrollen. Test verschillende waarden en kies de kortste afstand die het gewenste effect nog steeds bereikt.
Vermijd het combineren van GsapPin met GsapParallax binnen dezelfde sectie: beide technieken sturen de scrollpositie aan, en samen kunnen ze elkaars berekening verstoren.
Gebruik dit block spaarzaam — één of twee keer per pagina is genoeg. Te veel vastgezette secties na elkaar maken een pagina onvoorspelbaar om doorheen te scrollen, wat vooral op mobiel als hinderlijk kan overkomen. Houd er bij mobiel gebruik bovendien rekening mee dat vastgezette secties op een klein scherm sneller als hinderlijk worden ervaren dan op desktop, simpelweg omdat er minder scrollruimte eromheen is. Test dit block dus altijd ook op een telefoon, niet alleen op een breed beeldscherm.
Voorbeeld
Dit blok blijft even staan terwijl je doorscrolt
De prompt voor dit voorbeeld
Zet een tekstblok op de pagina dat even vast blijft staan terwijl je doorscrolt.