Help Registreren

Kies de beste achtergrond voor je website

Verbeter de doorklik ratio en bounce ratio op je Jimdo website.

Je achtergrondafbeelding is de eerste indruk die een bezoeker van je website krijgt. Eentje die ervoor kan zorgen dat je bezoekers verder klikken, of snel het venster weer sluiten. De juiste afbeelding trekt de aandacht van je bezoekers en zorgt dat ze nieuwsgierig zijn om meer te weten te komen over je bedrijf of blog.

 

Hoe moeilijk kan dat zijn, vraag je je misschien af. Daarom dagen we je uit om deze lijst met mogelijkheden voor je achtergrondafbeeldingen eens door te nemen en te checken wat je al kunt afvinken.


Maak contact met je lezers

Als je de top 20 meest gedeelde advertenties in 2016 van video- en technologiebedrijf Unruly bekijkt, zie je dat alle advertenties één ding met elkaar gemeen hebben — ze roepen allemaal een bepaalde emotie op. Emotionele branding wordt in de marketing gebruikt om kijkers aan te spreken, maar het principe geldt net zo goed voor de achtergrond van je website.

 

Kies een afbeelding die past bij je blog of bedrijf. Eentje die je bezoeker een goed gevoel geeft. Eentje die zorgt voor een emotionele verbinding tussen je merk en je bezoeker. Maak je bijvoorbeeld een reisblog, gebruik dan een foto van een prachtige plek waar je ooit geweest bent en geef je bezoekers het gevoel dat ze daar onmiddellijk naartoe zouden willen (of zelfs moeten) gaan. Een foto waar beweging in zit, of die vanuit een bijzondere hoek genomen is kan je achtergrond echt iets extra’s geven.

 

Dit is je kans om je product, een locatie of jezelf van de beste kant te laten zien. Maak je geen zorgen als één achtergrondafbeelding niet genoeg is: je kunt tot wel 25 afbeeldingen kiezen in een slideshow.

Jimdo voorbeeld reisblog met design Shanghai
Jimdo voorbeeld reisblog met design Shanghai

Vind online afbeeldingen van goede kwaliteit

Je website wordt een echte blikvanger met afbeeldingen in hoge resolutie. Je hoeft echt geen professionele fotograaf te zijn om een mooie achtergrondfoto voor je website te maken. Er zijn vele websites waar je gratis stockfoto’s van goede kwaliteit kunt vinden.

 

Wil je een van je eigen producten als achtergrond gebruiken en wil je liever geen professionele fotograaf inhuren, dan hebben wij hier een paar goede tips om een professionele foto te maken met een doe-het-zelf light box.

 

Voor elke afbeelding, of het nu een foto of een logo is, is er een ideaal bestandsformaat. Als je niet zeker weet of je een JPG of een PNG moet gebruiken, kijk dan even naar onze tips voor het gebruik van foto's op je site.

 

Pro Tip: Als je bestand te groot is, gebruik dan een tool als TinyPNG of TinyJPG om het te verkleinen zonder kwaliteit te verliezen.

De perfecte afmetingen

Het wordt vaak over het hoofd gezien, maar de juiste afmetingen en uitsnedes van je foto’s geven je website een veel professionelere look. Probeer onnodige achtergrondruimte weg te snijden, zodat de nadruk op je product ligt, of op de vakantiebestemming die je in de schijnwerpers wilt zetten.

 

Kies liever voor een liggende afbeelding in plaats van een staande. Liggende afbeeldingen zien er op moderne beeldschermen namelijk beter uit dan staande. Op de meeste beeldschermen is de minimumresolutie 1024x768 pixels. Als vuistregel raden we je daarom aan een achtergrondafbeelding te gebruiken van ongeveer 2000 pixels breed. Als je een afbeelding uploadt die kleiner is dan de minimale resolutie, is het resultaat een korrelige jaren ’80-look. Dat is waarschijnlijk niet wat je wilt.

Een uitgesneden kwaliteitsfoto van een mens kan een krachtig middel zijn om de menselijkheid achter een organisatie te laten zien.

 

Vergeet niet om te controleren of je achtergrond op alle belangrijkste browsers als Google Chrome en Firefox, en op verschillende mobiele apparaten goed werkt, zodat je zeker weet dat je achtergrond op alle platformen goed functioneert.

Pro Tip: Weet je niet zeker wat de pixelgrootte van je afbeelding is? Klik dan vanaf je PC met de rechter muisknop op het bestand, kies dan voor “Eigenschappen” en dan op “Samenvatting”. Op een Mac klik je gewoon met je rechter muisknop op de afbeelding en kies je “Toon info” en vervolgens “Meer info.

Stel een focuspunt in

Een focuspunt leidt de kijker precies naar dat punt dat je onder de aandacht wilt brengen. Dat kan je eigen product zijn, of een interessant aspect van de afbeelding. Het focuspunt helpt achtergronden beter uit te lijnen, zodat belangrijke zaken zich niet verstoppen achter de content of je navigatie.

 

Kies Design en vervolgens Achtergrond; kies dan een afbeelding, en klik op “Instellingen” om een focuspunt in te stellen op dat deel van de afbeelding waar je de aandacht op wilt vestigen. Dit kun je doen voor elke willekeurige afbeelding, ook voor slideshows. Photoshop of andere tools heb je hier niet voor nodig.  

 

In een van onze laatste updates hebben we de opties ‘pauzeer’ en ‘ga verder’ toegevoegd aan de slideshow, zodat je een focuspunt kunt instellen voor elke afbeelding, een preview kunt bekijken en daarna verder kunt gaan met het maken van je slideshow.

focuspunt
Gebruik het focuspunt om een bepaald aspect van de foto te benadrukken

Videoachtergronden

Videoachtergronden zien er indrukwekkend uit, maar het kan nog best lastig zijn een balans te vinden tussen een adembenemende achtergrond en een achtergrond die niet afleidt van de content op je website. Als je je werk in actie wilt laten zien, kun je een video maken met een subtiele kleur, zodat hij niet té veel afleidt van de rest van de website. Subtiele bewegingen werken vaak het beste.

 

Subtiele videoachtergrond met het San Francisco design.
Subtiele videoachtergrond met het San Francisco design.

Om een video toe te voegen aan je Jimdo-website moet je een clip van YouTube of Vimeo kiezen. Op sites als Pond5 of AllTheFreeStock vind je royalty-free videoclips die je gratis kunt gebruiken. Wij vinden bijvoorbeeld de designs Stockholm en San Francisco geweldige designs om je videoachtergrond echt van het scherm te laten spatten. Het Stockholm design heeft een grote Header die gedeeltelijk zichtbaar blijft op je andere pagina’s, zodat hij je content niet overschaduwt.

 

Pro Tip: Probeer je video kort te houden. Als hij is afgelopen, start Jimdo hem automatisch opnieuw, zodat er altijd iets te zien is.

Effen achtergrondkleuren

 Als fotografie niet zo bij je past zijn er gelukkig genoeg andere opties voor je websiteachtergrond. Probeer bijvoorbeeld eens gekleurde blokken om een speels effect te creëren. Zorg daarbij wel dat de kleuren passen bij de branche waarin je werkt en de indruk die je van je bedrijf wilt wekken.

Unger music gebruikt een heldere, vrolijke oranje kleur om zijn speelse kant te benadrukken.
Unger music gebruikt een heldere, vrolijke oranje kleur om zijn speelse kant te benadrukken.

De achtergrond kan ook de zichtbaarheid van je tekst beïnvloeden, dus als je echt wilt dat je bezoekers zich op de content van je site concentreren, werkt een witte achtergrond misschien beter. De witruimte geeft je website een opgeruimde en elegante indruk. Dat past bijvoorbeeld goed bij een wat traditioneler bedrijf.

 

Pro Tip: Heb je liever iets rustieks? Experimenteer eens met textuurachtergronden als hout of textiel.

Onderschat de kracht van een opvallende achtergrond niet. Maak creatief gebruik van de mogelijkheden en je bezoekers zullen je site verlaten met een eerste indruk die staat als een huis. Probeer gewoon eens uit welke achtergrond voor je website het beste werkt en vergeet vooral niet plezier te hebben in het uitproberen van alle mogelijkheden!


Heb jij een geweldige achtergrond op je website die je met ons wilt delen? Laat het ons weten in de comments!

FEM EGGERS

Allrounder


Commentaar schrijven

Commentaren: 3
  • #1

    Peter (woensdag, 29 maart 2017 19:00)

    'k Heb wel een leuke achtergrond gevonden voor m'n site. Alleen lijkt die op Safari voor desktop niet in te laden. Na enig opzoekwerk blijkt dit een gekend issue te zijn.

  • #2

    giel rombout (donderdag, 30 maart 2017 19:33)

    Ik zou graag logo variabele grootte kunnen instellen meestal is hij te klein.

  • #3

    Frederick Alonso (dinsdag, 04 april 2017 23:56)

    Leuk artikel, wat wij vaak doen is gebruik maken van een svg image die dan als background of met een javascript animatie aangestuurd wordt. Je kan er zelfs een 3D gevoel aan geven als je met de z-index gaat experimenteren.