Handel
Sticky købs-bjælke
En sticky købs-bjælke bliver liggende i skærmbilledet, mens brugeren scroller en lang produktside, så pris og »Læg i kurv«-knap altid er inden for rækkevidde. Vær ærlig om evidensen: der findes meget lidt hård, offentlig data specifikt for buy-baren — den behandles overvejende som god praksis (vejledning), understøttet af enkelte A/B-cases.
Definition
En sticky købs-bjælke fastholder de vigtigste købselementer (pris, variant, CTA) i viewporten under scroll.
Hvorfor det virker
Vedvarende adgang til de primære handlinger reducerer navigationsindsatsen: et fast element lader brugeren nå de vigtige kontroller uden at scrolle tilbage til toppen og øger deres opdagelighed. Det er NN/g’s vejledning om sticky-elementer, ikke et måltal.1
Et beslægtet mønster er målt: et lille studie (40 deltagere, desktop) fandt en sticky-menu 22% hurtigere at navigere, og alle med en præference foretrak den. Bemærk ærligt: det er en sticky menu på desktop — ikke en buy bar — så det støtter princippet »hold kontrollerne synlige«, ikke bjælken specifikt. Tallet stammer fra Smashing Magazine, ikke fra NN/g.2
Baymard lister en »sticky product page summary« med pris og »Læg i kurv« som en anerkendt god praksis til lange produktsider — uden dog at angive en effektprocent.3
Der er noget at hente: kun 49% af webshops har »decent« eller »good« produktside-UX, og »Buy«-sektionen tiltrækker naturligt brugerens fokus — så det betaler sig at holde købshandlingen tilgængelig.4
Direkte A/B-evidens (enkelt forhandler, retningsgivende): en sticky købsboks gav +7,9% gennemførte ordrer på desktop (99% signifikans) og +5,2% ordrer på mobil (98% signifikans).5
Hvornår du bruger det — og hvornår ikke
Hvornår du bruger det
- Produktsiden er lang med meget indhold under folden.
- Beslutningen om at købe kan komme når som helst under scroll.
- CTA’en må ikke skulle scrolles frem igen.
Hvornår du bør undgå det
- Siden er kort, og CTA’en altid er synlig.
- Den faste bjælke stjæler for meget plads på mobil.
Best practices
Brug den på reelt lange produktsider
Mønstret løser problemet med, at købsknappen scroller ud af syne. På korte sider stjæler den bare plads.3
Hold den kompakt
Faste elementer optager plads, der kunne bruges til indhold — hold et højt forhold mellem indhold og »chrome«, og brug kun én række.1
Vis de tre essentielle: pris, variant/lagerstatus og den primære CTA
Det er minimum for, at brugeren kan handle uden at scrolle tilbage.4
Vis den først, når hovedkøbssektionen er scrollet væk
Mens den rigtige købssektion er synlig, er baren overflødig og spilder blot plads.1
Lad aldrig baren dække indhold
Fast eller gennemsigtig chrome, der overlapper anmeldelser eller specifikationer, skaber lav kontrast og irriterer.1
Beskyt skærmpladsen på mobil
Små viewports gør en høj bjælke uforholdsmæssigt dyr — hold den til én kompakt række.1
Overhold tap-target- og læsbarheds-minimum
Den sticky CTA bør have et tryk-mål på mindst ca. 1×1 cm og tekst på omkring 16pt.1
Typiske fejl
Baren er for høj på mobil
Den spiser en stor del af en i forvejen lille skærm.
Altid synlig, selv når den er overflødig
At vise baren, mens den rigtige købssektion allerede er på skærmen, duplikerer CTA’en og spilder plads.
Dækker eller overlapper indhold
En uigennemsigtig eller lav-kontrast bjælke over anmeldelser, specifikationer eller billeder.
Proppet med ekstra
Rabatter, garantier og tilbud i en bjælke, der næsten ingen plads har — hold den til pris, variant og CTA.
For små tryk-mål eller for lille tekst
Den komprimerede bjælke falder under 1 cm / ~16pt.
Eksempler i praksis
Lange produktsider i mode og DTC
Mange direkte-til-forbruger-brands bruger en sticky »Læg i kurv« nederst på lange produktsider (rapporteret af CRO-kilder som The Good). Bekræft den enkelte butik live, da implementeringer skifter.
A/B-case (Growth Rock)
En CRO-test af en sticky købsboks målte +7,9% gennemførte ordrer på desktop og +5,2% på mobil — et konkret, men enkeltstående, evidens-eksempel.
Ofte stillede spørgsmål
Hvad er en sticky købs-bjælke?
En fastlåst linje på produktsiden, der bliver liggende i skærmbilledet, mens du scroller. Den viser typisk pris, valgt variant/lagerstatus og en »Læg i kurv«-knap, så købshandlingen altid er inden for rækkevidde.
Hvornår giver den mening at bruge?
Primært på lange produktsider, hvor den oprindelige »Læg i kurv«-knap scroller ud af syne. På korte sider, hvor købsknappen alligevel er synlig, tilføjer den mest støj.
Virker den? Er der tal på det?
Beviserne er begrænsede. Der findes ikke offentlige, hårde tal fra Baymard specifikt for buy-baren — den omtales som god praksis. Et lille Smashing-studie (40 deltagere, desktop, sticky menu) fandt navigation 22% hurtigere, og CRO-cases har målt +5–8% flere ordrer med en sticky købsknap. Det er retningsgivende, ikke endegyldigt.
Hvad skal baren som minimum indeholde?
Tre ting: pris, valgt variant/lagerstatus og den primære »Læg i kurv«-knap. Undlad at proppe rabatter og ekstra tilbud ind — der er ikke plads, og det distraherer fra selve købet.
Hvad er den største faldgrube på mobil?
At baren fylder for meget af den lille skærm. Faste elementer stjæler plads, der kunne bruges til indhold. Hold baren til én kompakt række, og lad den ikke dække tekst eller anmeldelser.
Hvornår bør baren dukke op?
Bedst, når den oprindelige købssektion er scrollet ud af syne. Så længe den rigtige købsknap er synlig, er baren overflødig. Sørg samtidig for tap-targets på mindst ca. 1×1 cm og læsbar tekst.