What you put in the top of your front page has a huge impact on the success or failure of your website. Put the wrong thing in, and you’ll probably see your visitors quickly navigating away from your site. Put the right content there and you may see your sales go up.
This article isn’t an all-in-one guide for creating above the fold content, nor is about an all-encompassing rule on what you should put in. Rather, I will give you a few tips, recommendations and a little bit of helpful research about this topic.
Voordat we er meteen induiken, is het goed om eerst te weten hoe het bovenste gedeelte van je voorpagina heet. Er is een betere naam voor dan ‘het-bovenste-gedeelte-van-je-site’.
“Above the Fold”
Het wordt ‘Above the Fold’ genoemd. Waarom? Omdat vroeger, toen de mensheid nog kranten las, deze meestal dubbelgevouwen waren, zodat alleen het bovenste gedeelte direct zichtbaar was. Dat bovenste gedeelte, oftewel het ‘above the fold’-gedeelte, bevatte de belangrijkste kop(pen) van de dag. Wanneer je de krant openvouwde, zag je de rest van de minder belangrijke koppen. Bij websites werkt het net zo: het bovenste gedeelte van je site is het eerste wat mensen zien, en wanneer je naar beneden scrolt, zie je de rest van de site, vergelijkbaar met het openvouwen van een krant.
Om bij het krantenvoorbeeld te blijven: stel dat je op straat loopt en een krantenverkoper ziet. Als je de krant ziet en de kop is interessant, dan koop je de krant wellicht om de rest te lezen. Dit is in wezen hetzelfde bij websites: als bezoekers op je site terechtkomen en je ‘above the fold’-content interessant vinden, dan happen ze misschien toe en scrollen ze naar beneden of bekijken ze de rest van je site om meer te zien.
Het onderzoek van Nielsen
Earlier I said that your above the fold content may make or break your site. Nielsen Normal Group has written a few research articles about this across the years. I’ll quote the summary of their article The Fold Manifesto: Why the Page Fold Still Matters
The average difference in how users treat info above vs. below the fold is 84%.
If you just got confused about the wording of the quote, I did too at the start. Let me clarify: That study doesn’t mean that 84% of people do not scroll down, on the other hand I’ve seen other research say that most people do scroll down to the bottom of the page. It also doesn’t mean that the lower part isn’t important. Instead it means that the behavior of your visitors in your site is largely impacted by your content above the fold.
Dit is logisch, aangezien het bovenste gedeelte van een website het eerste is wat je ziet.
Nu je weet hoe belangrijk de ‘above the fold’-content van je voorpagina is: wat zou je eigenlijk bovenaan je site moeten plaatsen?
Kom meteen ter zake
Maak meteen duidelijk waar je site over gaat. Je voorpagina en het gedeelte ‘above the fold’ zijn de levensader van je hele site. Als je bezoekers zich verloren voelen, haken ze snel af en sluiten ze het tabblad. Als je een beginnend auteur bent, schrijf dat dan en toon je nieuwste boek. Als je een bruiloftsplanner bent, schrijf dan dat je een bruiloftsplanner bent die je bezoeker de meest onvergetelijke bruiloft ooit zal bezorgen. Of als je een site maakt voor je kleine hotel, schrijf dan dat je de beste bed & breakfast van de stad bent. (Ik zal deze voorbeelden hieronder vaker gebruiken.)
Je bezoekers zouden niet moeten hoeven raden waar de site over gaat. Ze moeten het meteen begrijpen; pas dan zullen ze naar beneden scrollen om meer details te bekijken.
Betrek je bezoekers doelgericht
Vervolgens moet je nadenken over het daadwerkelijke doel van je website. Wat is überhaupt de reden dat je een website hebt opgezet? Wat die reden ook is, je moet dit ook ‘above the fold’ plaatsen.
Laten we de voorbeelden nemen die ik hierboven noemde. Als beginnend auteur wil je waarschijnlijk meer naamsbekendheid. Als je een gratis e-book hebt, kun je een knop plaatsen waarmee je bezoekers dit kunnen downloaden. Voor de bruiloftsplanner wil je dat mensen contact met je opnemen over je diensten; plaats dan je telefoonnummer of een contactformulier. En voor het kleine hotel voeg je een boekingsformulier toe samen met je telefoonnummer.
Voor Page Builder Sandwich wil ik dat mensen de plug-in beter leren kennen en uiteindelijk klant worden. Daarom heb ik daar een knop geplaatst waarmee bezoekers meteen de demo kunnen uitproberen, en een andere knop om de plug-in te kopen.
Het gedeelte ‘above the fold’ ontwerpen
Nu we weten wat we moeten plaatsen, is het tijd om te beslissen over het ontwerp. Persoonlijk geef ik de voorkeur aan overzichtelijke, in secties verdeelde content, vandaar de effen achtergrond op onze voorpagina. Maar het is ook een goed idee om je ‘above the fold’-content te vergezellen van een afbeelding of video om het levendiger te maken.
Here’re a few examples of what you can do about your front page.
Add a background image. A large background image behind your large statement is a great eye-catcher and can further encourage visitor engagement. For new book author, maybe adding a background image illustrating the setting of his free ebook would entice people more.
Add an introduction video. Admit it, people can be lazy, especially when it comes to reading. So if your site is a bit complicated, it might be a good idea to add a short video that introduces your site/product quickly. For the wedding organizer, then this can be a video of their latest wedding. Or for our site for example, we can add in a quick intro about the features of our plugin.
Add a video background. This is a bit of a trend nowadays, but I find it appealing at times. If this suits your taste, then this might be a good idea.. I know PayPal had a video background before in their site. For the small hotel, you can put in a stationary video of a scenic area of your hotel as the backdrop.
Conclusie
Het creëren van ‘above the fold’-content voor je voorpagina is niet moeilijk, maar er is wat denkwerk en testen voor nodig om het goed te doen. Als je al een site hebt en daar tevreden mee bent, maar een hoog bouncepercentage in Google Analytics ziet, dan raad ik je aan om met bovenstaande tips je ‘above the fold’-content eens opnieuw te bekijken.
If you have tips on creating above the fold content, kindly share them in the comments!
Page Builder Sandwich can Help You Design Your Front Page & Above The Fold Content
Page Builder Sandwich is a WordPress plugin that allows you to create any design you want without writing any piece of code.
Now you can download the Lite version of Page Builder Sandwich from the 
Ik ben blij te kunnen aankondigen dat je vanaf versie 2.4 je inhoud in je frontend kunt bewerken met behulp van Markdown!
Vorige week hebben we versie 2.1 uitgebracht, waarin veel bugs zijn opgelost en het dialoogvenster voor de WordPress-linkbewerker aan Page Builder Sandwich is toegevoegd.
Gelukkig nieuwjaar allemaal!
There may be times where you want to add supporting videos from YouTube or Vimeo into your site. Or maybe you want to add Tweets from Twitter, or content from other websites like Flickr and Instagram. You can