Aan welke eisen moet een afbeelding aan voldoen. Afbeelding bewerken. Omslagfoto bijsnijden. Dimensies. Afmetingen. Verhoudingen. Coverfoto.
De omslagfoto van een activiteit wordt op meerdere plaatsen op het platform gebruikt, in verschillende maten en afmetingen. Hierdoor kan het soms lastig zijn om een goede afbeelding te kiezen (Zoek je foto's? Hier vind je rechtenvrije foto's).
Daar komt nog eens bovenop dat een afbeelding op alle verschillende schermformaten (telefoons, tablets, laptops, desktops) er vaak ook net weer even anders uit komt te zien. Als een afbeelding vergroot moet worden kan dat bovendien leiden tot wazige foto's.
Hoe zorg je er dan voor dat je afbeelding er in alle gevallen zo goed mogelijk uitziet?
Afmetingen
Binnen Deedmob hanteren we twee formaten:
-
1920x700 op de activiteitpagina (minimum grootte)
-
1920x1080 op de activiteitenkaarten
Zoals je ziet wijken de formaten af (er is helaas geen one-size-fits-all oplossing die functioneel en esthetisch werkt). Dit heeft als gevolg dat er in beide gevallen automatisch stukken van de gekozen afbeeldingen worden "gesneden" op het moment dat het andere format wordt geladen.
-
1920x1080: er zal een strook aan de onderkant en aan de bovenkant afgesneden worden wanneer de afbeelding op de activiteitpagina getoond wordt.
-
1920x700: er zal zowel links als rechts een strook afgesneden worden wanneer de afbeelding op de activiteitkaart getoond wordt.
Om ervoor te zorgen dat de afbeelding er op alle plekken goed uitziet is het dus van belang om ervoor te zorgen dat de belangrijkste content centraal geplaatst is op de afbeelding.
Tip: maak twee templates in jouw favoriete afbeelding bewerker (bijvoorbeeld Canva) met de bovengenoemde formaten. Als je een foto hebt, sla deze op in beide formaten. Probeer beide foto's uit, en kies de foto die er het beste uitziet!
Voorbeelden
|
1920x700: de zwarte stroken laten zien welk deel afgesneden wordt. |
|
|
Goed |
Niet Goed |
|
|
|
|
|
1920x1080: de zwarte stroken laten zien welk deel afgesneden wordt. |
|
|
Goed |
Niet Goed |
|
|
|
|
Nu je dit weet moet het lukken om een goede afbeelding te kiezen of te maken.
Een afbeelding bewerken of bijsnijden
Soms is het noodzakelijk om een afbeelding van tevoren zelf te bewerken of bij te snijden voor het beste resultaat. Voor simpele bewerkingen kan je het afbeeldingsbewerkingsprogramma op je computer gebruiken. Is dat niet toereikend? Er zijn genoeg gratis tools beschikbaar, online en offline. Drie van onze favorieten:
De afbeelding optimaliseren voor het web
Is je afbeelding klaar voor gebruik? Dan kan het geen kwaad om de afbeelding te optimaliseren voor het web en kleiner te maken qua bestandsgrootte (kb/mb). Hoe kleiner een bestand, hoe sneller een pagina laadt. Er zijn online een hoop gratis tools te vinden die dit voor je doen. Bijvoorbeeld:
-
Websiteplanet Image Compressor (jpg/png compressie)
-
Optimizilla (jpg/png/gif compressie)
Nu is de afbeelding echt klaar voor gebruik!
Hieronder nog even alle tips op een rijtje
-
Zorg ervoor dat je de juiste formaten gebruikt. Zie hierboven.
-
Gebruik geen kleine afbeeldingen. Die moeten vergroot worden en zullen er op veel schermen niet mooi uitzien.
-
Grotere afbeeldingen mogen, maar zorg dan dat de verhoudingen ongeveer hetzelfde blijven.
-
Zorg ervoor dat de belangrijkste content van de afbeelding centraal gepositioneerd is zodat het na het bijsnijden nog zichtbaar blijft.
-
Probeer het gebruik van tekst te vermijden. Gebruik je toch tekst zorg er dan voor dat:
-
je zo min mogelijk tekst gebruikt
-
de tekst groot genoeg is
-
de tekst gecentreerd is zodat hij volledig in beeld blijft
-
-
Waar nodig kan je zelf de afbeelding bijsnijden voordat je hem upload.
Succes en veel plezier!