One­pager /​ Sin­gle­page Web­sei­ten: Erfolg mit allem auf einer Seite

Datum: 14. February 2014

Web­sei­te mit nur einer Sei­te: Vor­tei­le & Nach­tei­le des Einseiters

Der One­pager, auch als Sin­gle­page Web­sei­te bekannt oder ver­ein­facht als Web­sei­te, die nur aus einer Sei­te besteht (Ein­sei­ter), ist das nur was für fau­le oder ist so eine Sei­te wirk­lich bes­ser als eine klas­si­sche Home­page mit Navi­ga­ti­on und allem was dazu gehört? Mit bes­ser ist zu ver­ste­hen: „Kann so einen Sei­te mehr Kon­tak­te, Leads und damit Umsatz brin­gen als eine klas­sisch kon­zi­pier­te Web­site?“ In die­ser Hin­sicht durch­leuch­ten wir an die­ser Stel­le die­se Aspek­te des One­pagers. Da One­pager häu­fig über die Soft­ware Word­Press umge­setzt wer­den, wird hier auch auf die Anfor­de­run­gen dazu eingegangen.

One­pager, abge­lei­tet aus der Landingpage

Der One­pager ist die Ein­sei­ten-Ant­wort auf das eta­blier­te Kon­zept der Landing­pa­ge. Auf Landing­pa­ges wird ein ähn­li­ches Kon­zept ver­folgt wie auf einem Onepager:

  • Kon­zen­tra­ti­on auf das Wesentliche
  • Ver­mei­dung von Ablenkung
  • Stei­ge­rung der Anfra­gen und des Umsatzes

Wäh­rend Landing­pa­ges bei Shops noch eher zum Ein­satz kom­men, ist der Ein­satz des One­pagers für Shops zur Unter­stüt­zung des Abver­kaufs auch möglich.

Für wen ist ein One­pager geeignet?

Onepager: richtig aufbauen

One­pager: rich­tig aufbauen

Nicht für jede Web­sei­te ist ein One­pager geeig­net. Inso­weit es sich um ein kon­kret absteck­ba­res The­ma, The­men­web­sei­te, han­delt, auf dem nicht zu vie­le Infor­ma­tio­nen zu ver­mit­teln sind, kann ein One­pager ver­wen­det werden.

Die Kon­zept­ent­wick­lung für einen One­pager ist auf­wen­di­ger als für eine nor­ma­le Web­sei­te, wo Unter­sei­ten ver­wen­det wer­den kön­nen, um Infor­ma­tio­nen bes­ser aufzusplitten.

 

Beim Menü fängt der One­pager an…

Beim One­pager liegt das Menü gewöhn­lich hori­zon­tal am Sei­ten­an­fang und ist stän­dig im Blick­feld. Über das Menü soll­te die Sei­te bequem durch­na­vi­giert wer­den und gleich über den Sicht­be­reich erkenn­bar sein, dass ein wei­te­rer Bereich danach anfängt. Der Scroll­bal­ken soll­te in der Ver­wen­dung nicht benutzt wer­den müs­sen. Die Nut­zung von unter­ge­ord­ne­ten Navi­ga­ti­ons­punk­ten kann vor­kom­men, soll­te aller­dings eher die Aus­nah­me blei­ben, damit die Sei­ten­län­ge nicht über­mä­ßig lang wird. Pro­ble­ma­tisch ist daher beim One­pager, ob die Navi­ga­ti­ons­punk­te für eine hori­zon­ta­le Dar­stel­lung im Menü über­haupt geeig­net sind.

Für die Benen­nung der Navi­ga­ti­ons­punk­te im Menü emp­fiehlt sich eine Benen­nung nach Dienst­leis­tung oder Ange­bot. Den­noch soll­te auch die Ant­wort nach dem „Wer bie­tet das an?“ nicht offen bleiben.

Die Inhal­te für den Onepager

Wie auch bei einer klas­si­schen Web­sei­te benö­tigt auch der One­pager eine struk­tu­rier­te Vor­ge­hens­wei­se, die eine Mit­be­wer­ber­ana­ly­se und Begriffs­ana­ly­se benö­tigt. Dar­aus sind dann für die Dar­stel­lung der Inhal­te, also Text, Bild oder auch ande­re mul­ti­me­dia­le Ele­men­te, Schlüs­se zu ziehen.

Die Inhal­te beim One­pager benö­ti­gen eine gute Erfass­bar­keit. Daher soll­ten die Inhal­te mög­lichst immer im Sicht­be­reich lie­gen. Das geht – abge­se­hen von mobi­len Dar­stel­lun­gen – nur wenn 800 px an Sei­ten­hö­he nicht über­schrit­ten wer­den. Auf die­se Wei­se ist am ehes­ten gewähr­leis­tet, dass der nächs­te abgrenz­ba­re Bereich, aber auch die ver­mit­teln­de Infor­ma­ti­on, im Sicht­be­reich liegen.

Soll­ten wei­te­re Infor­ma­tio­nen not­wen­dig sein, so soll­ten die Infor­ma­tio­nen hori­zon­tal wei­ter ange­bo­ten wer­den. Dies hat den Vor­teil, dass die Sei­ten­hö­he davon unbe­ein­flusst bleibt. Den­noch soll­ten hier wich­ti­ge Infor­ma­tio­nen an den Anfang und unwich­ti­ge ans Ende gesetzt wer­den. Des Wei­te­ren gibt es die Lösung mit selek­tiv auf­klapp­ba­ren Berei­chen zu arbei­ten, was aller­dings eher die zwei­te Wahl sein soll­te. Gera­de die gra­fi­sche Auf­ma­chung und der Call-to-Action, also die Auf­for­de­rung zum gewünsch­ten Han­deln, soll­te von Anfang an berück­sich­tigt werden.

Web­de­sign für den Onepager

Beim Web­de­sign für den One­pager emp­feh­len sich die­se Vorgehensweisen:

  • Navi­ga­ti­on hori­zon­tal oben
  • Navi­ga­ti­on in unte­ren Berei­chen wei­ter sicht­bar halten
  • Slider am Anfang mit Aus­blick auf die Dienst­leis­tun­gen und Angebote
  • Unter­schied­li­che Berei­che farb­lich unterscheiden
  • 800 px bei den ein­zel­nen Berei­chen der Navi­ga­ti­ons­punk­te in der Höhe nicht überschreiten
  • Nicht an Gra­fik spa­ren, damit kei­ne Text­las­tig­keit entsteht
  • Call-to-Action gut herausarbeiten

Tech­nik für den Onepager

Die Tech­nik hat unter ande­rem mit dem ein­ge­setz­ten Sys­tem zu tun. Wer sich eine PHP oder HTML Sei­te macht, für den ist hier nicht ganz soviel zu beach­ten. Wer aller­dings Word­Press ein­setzt, was zur Zeit sehr beliebt ist, der soll­te auf die Umset­zung ach­ten. Schnell lan­den hier Inhal­te im Goog­le-Index, die als dop­pel­te Inhal­te gezählt wer­den. Aus die­sem Grun­de soll­te jeder, der einen One­pager umsetzt, mit der Site Abfra­ge prü­fen, was Goog­le von der eige­nen Sei­te erfasst hat und gege­be­nen­falls Gegen­maß­nah­men ergrei­fen. Hier­zu in den Goog­le Such­schlitz dies ein­ge­ben site:meinedomain.de.

Ach­tet gera­de bei einem One­pager auf das über­tra­ge­ne Daten­vo­lu­men. Schnell wird beim Ein­satz eines Sliders und wei­te­rer Gra­fi­ken ein höhe­rer Daten­trans­fer not­wen­dig und das heißt für Besu­cher der Web­sei­te erst mal war­ten. Neben Caching-Plug­ins wie z.B. WP-Super-Cache, emp­feh­len sich bei One­pagern aller­dings auch Plug­ins, die Bil­der erst nach Not­wen­dig­keit nach­la­den. Die­se Plug­ins nen­nen sich Lazy-Load-Plug­ins. Hier kann ich euch BJ Lazy Load emp­feh­len. Aller­dings soll­tet ihr beim Slider-Plug­in auch gleich auf eine extra Lazy-Load-Funk­ti­on ach­ten, da vie­le Slider ein Lazy Load über ein Plug­in nicht unter­stüt­zen. Damit könnt Ihr die Lade­zeit für eure Besu­cher mini­mie­ren und damit die Zufrie­den­heit mit der Web­sei­te erhöhen.

Für Such­ma­schi­nen­ein­stel­lun­gen ist Word­Press-SEO eines der bes­ten Plugins.

Such­ma­schi­nen­op­ti­mie­rung eines Onepagers

Prin­zi­pi­ell unter­schei­det sich beim One­pager eine Such­ma­schi­nen­op­ti­mie­rung nicht von einer ande­ren Landing­pa­ge. Eine Web­sei­te kann auch ein Key­word-Set, also eine Art zusam­men­hän­gen­de Anzahl von Begrif­fen, opti­miert wer­den. Hier­aus wird schnell klar, dass es bes­ser ist daher eine The­men­web­sei­te als One­pager umzusetzen.

Bei der Absprungra­te wird der One­pager nicht gera­de punk­ten kön­nen. Die Absprungra­te wird bei Goog­le Ana­ly­tics per Defi­ni­ti­on so gemes­sen: Ein Absprung tritt dann auf, wenn nur eine Sei­te betrach­tet wird und die Sei­te dann wie­der ver­las­sen wird. Die­ses Ver­hal­ten ist unab­hän­gig von der Zeit. Den­noch kann Goog­le zusätz­lich die Zufrie­den­heit mit einer Web­sei­te bewer­ten. Soll­te die Zufrie­den­heit mit einer Sei­te hoch sein bzw. die Benut­zer­er­fah­rung sehr gut, so wird der durch den Absprung gemes­se­ne Wert weni­ger ins Gewicht fallen.

Die zu erzie­len­den Ergeb­nis­se der Such­ma­schi­nen­op­ti­mie­rung kön­nen bei einem One­pager sehr gut sein, auch wenn alle Links nur auf eine Sei­te zusam­men­lau­fen. Denk­bar wäre aller­dings zusätz­lich einen Blog­be­reich für Ankün­di­gun­gen, Fak­ten oder News ein­zu­rich­ten. So lässt sich ein One­pager auch erwei­tern und Links auch auf Unter­sei­ten ein­ge­hen zu lassen.

Kos­ten eines Onepagers

Es fängt beim One­pager mit vie­len Über­le­gun­gen an, damit die ver­schie­de­nen Zie­le erreicht wer­den kön­nen. Der One­pager ist eine Landing­pa­ge, eine optisch anspre­chen­de Sei­te, und lie­fert auch noch eine hohe Anzahl an Anfra­gen und damit Umsatz. Selbst bei der Tech­nik, ob auch Respon­si­ve für mobi­le End­ge­rä­te opti­miert umge­setzt oder nicht, ist eini­ges zu beach­ten. Der One­pager kann daher hoch­wer­tig gemacht kei­ne kos­ten­güns­ti­ge Alter­na­ti­ve zu einer Web­sei­te sein.

Bei den Word­Press-One­pager-The­mes soll­te dar­auf geach­tet wer­den, dass die­se auch wirk­lich frei kon­fi­gu­rier­bar sind. Vie­le haben nur fest­ge­leg­te Berei­che, die dann nicht groß­ar­tig ver­än­der­bar sind. Aus die­sem Grun­de haben wir uns ein eige­nes One­pager-The­me programmiert.

Ein bes­se­res, aber im Respon­si­ve Bereich nicht ganz aus­rei­chen­des One­pager-The­me ist das 907 One Page Par­al­lax Tem­p­la­te mit dem wir z.B. die Sei­te linkabbau.eu gestal­tet haben. Dies war einer der ers­ten Geh­ver­su­che und stimmt daher nicht mit den oben genann­ten Anfor­de­run­gen über­ein. Die spä­ter erstell­te Sei­te webdesig.bayern trifft die oben genann­ten Anfor­de­run­gen schon sehr gut.

Tags dieses Beitrags:


    Schreibe einen Kommentar zu "Onepager / Singlepage Webseiten: Erfolg mit allem auf einer Seite"

    Etwas HTML ist ok