Afbeelding op je site plaatsen? Eerst even bewerken!

Door Nora van Deursen, 

Uitleg CMS - Sweet 5.0, Afbeeldingen, Foto's, Content en Tips

Afbeeldingen op je site plaatsen is een goed idee. Dat vinden niet alleen je bezoekers, ook Google houdt ervan. In dit blog vertellen we je waarom het slim is om een afbeelding te bewerken voor je hem plaatst. Wist je dat onbewerkte plaatjes tot een langzame website kunnen leiden met als gevolg dat je bezoekers het voor gezien houden? Dat wil je voorkomen. Voor het gemak voegen we een korte checklist toe waarmee je direct aan de slag kunt.

Heb je nog weinig ervaring met het opbouwen van je website en het plaatsen van afbeeldingen? Dan kun je de ingebouwde mogelijkheden van ons CMS gebruiken. Zo weet je zeker dat jouw site snel blijft en dat plaatjes er netjes uitzien. Aan (blog)pagina’s kun je via het tabblad afbeeldingen een plaatje toevoegen dat achter de schermen automatisch op maat gesneden wordt. Je kunt ook een slide toevoegen. Een slide is een afbeelding over de gehele breedte aan de bovenkant van een pagina. Gebruik voor slides een liggende afbeelding. Wil je weten hoe je slides en afbeeldingen toevoegt? Lees dan de korte instructie in onze handleiding.

Voor wie zin heeft om zich de fijnere kneepjes van het vak eigen te maken, gaan we hieronder dieper in op het optimaliseren van afbeeldingen voor je website. We sluiten af met de beloofde checklist en twee SEO tips.

Het juiste formaat voor je web-afbeelding

Via het CMS kun je op verschillende manieren afbeeldingen aan je website toevoegen. Je kunt afbeeldingen op een vaste positie invoegen, afbeeldingen in de tekst invoegen, slides toevoegen en fotoalbums aanmaken. Hoe je een afbeelding plaatst lees je in de handleiding. Dít blog gaat over wat je moet doen vóór je de afbeelding plaatst.

Wil je ook een mooie website? Met alles erop en eraan voor een vaste prijs van €499,00? Kies voor het complete websitepakket van Tijdvooreensite. Benieuwd? Vraag een persoonlijke demoversie aan!

Gratis demo

De afmetingen van je afbeelding aanpassen 

Bedenk vooraf hoe groot je het plaatje in beeld wil hebben en bewerk het voordat je het upload. Wordt de afbeelding bijvoorbeeld getoond op een breedte van 800 pixels? Zorg dan dat je afbeelding niet kleiner, maar liever ook niet groter is. Een te kleine afbeelding geeft onscherp beeld. Een te grote afbeelding maakt je website traag en het risico bestaat dat hij vreemd wordt afgesneden.

In het CMS heb je de mogelijkheid om voor pagina's, blogartikelen en sommige andere modules een afbeelding toe te voegen op een vaste positie. Deze afbeelding heeft een vaste grootte. Een afbeelding die je hier plaatst wordt automatisch bijgesneden. Het mooiste resultaat krijg je door elke afbeelding de goede afmetingen te geven vóór het plaatsen. Afbeelding kleiner dan 800 pixels raden we af. Voor slides die paginabreed worden getoond, kun je het beste een afbeelding kiezen die tenminste 1920 pixels breed is. 

De afmetingen van een afbeelding die je in de tekst plaatst kun je zelf bepalen. Wil je afbeeldingen in een rij of raster tonen? Zorg dan voor een rustig en georganiseerd beeld door ze precies even groot te maken.

De beste resolutie voor je afbeelding kiezen

Sommige afbeeldingen hebben een hoge resolutie. Dat is geweldig als je een grote poster wil maken maar voor je site is het onhandig. Zo’n zware afbeelding neemt veel ruimte in en maakt je site lanzaam. Met de meeste fotobewerkers kun je een verkleinde versie van de afbeelding opslaan en het aantal pixels per inch of centimeter opgeven. De optimale resolutie voor het web is 72 pixels per inch (dpi). 

Finishing touch voor een zo klein mogelijk bestand

Er zijn online tools die het aantal pixels verminderen door de pixels die op elkaar lijken gelijk te trekken. Als je jouw bewerkte afbeelding nog even door zo’n programma haalt, kom je ongeveer uit op het kleinst haalbare bestand.

Hoe kun je een foto of plaatje verkleinen ?

Afbeeldingen verkleinen of op maat snijden kan met ieder fotobewerkingsprogramma. De meest bekende programma's zijn Paint (op elke windows pc standaard meegeleverd), Apple Foto's op een Apple computer en Photoshop, wereldwijd de meest gebruikte software professioneel. Een ander zeer makkelijk programma's om foto's te bewerken is irfanview. Ook zijn er online oplossingen zoals Google Photo's. Staat de juiste optie er voor jou nog niet bij? De consumentenbond heeft een handige pagina voor je gemaakt met betrouwbare, goedkope en/of professionele oplossingen voor het bewerken van afbeeldingen.

De checklist

  • Open de afbeelding in je favoriete fotobewerker. 
  • Pas de hoogte en de breedte aan naar het formaat dat je wilt laten zien. 
  • Kies een resolutie van 72 dpi (pixels per inch).
  • Sla de afbeelding op als .jpg. 
  • Is het een logo met transparante achtergrond? Gebruik dan .png. 
  • Haal tot slot je afbeelding nog even door een online tool als https://tinyjpg.com.

Et voilà! Je afbeelding is klaar om geplaatst te worden. 

SEO voor afbeeldingen

Wil je echt álles uit je plaatje halen? Maak dan de zoekmachines blij met deze twee trucs:

  • geef het bestand voor het uploaden een naam met de zoekterm er in. 
  • geef de afbeelding een alt-tag met het zoekwoord in een beschrijvende zin. 

Zo weet je zeker dat jouw zorgvuldig gekozen plaatje je website ook écht versterkt. Meer leren over afbeeldingen op je website? Lees de tips van Daan voor het kiezen van foto’s en de tips van Paul over goede SEO voor je website

Vallen afbeeldingen buiten beeld? Ga voor responsive webdesign!

Druk aan de weer geweest met foto’s bewerken voor je website, maar merk je dat deze niet mooi uitkomen op elk apparaat? Wellicht is je huidige website niet responsive. Responsive websites passen zich automatisch aan aan het scherm waarmee je de website bekijkt. Dit scherm kan van een desktop zijn, maar ook van een smartphone of tablet. Bij niet-responsive webdesign vallen afbeeldingen vaak buiten beeld en moet je onhandige fratsen uitvoeren om het plaatje óf de tekst goed te zien. 

Zeg ja tegen gebruiksvriendelijkheid en kies voor een responsive website. Tijdvooreensite heeft voor jou een kant-en-klaar websitepakket waarmee jouw responsive website binnen een week online staat. En nog lekker betaalbaar ook. Waar wacht je nog op?

Ik wil meer informatie! Doe mij maar een gratis demo 

Terug naar overzicht