Afbeeldingen zijn belangrijk om je bezoeker een sfeerimpressie te geven van jouw bedrijf. Maar afbeeldingen met een hoge resolutie doen niet veel goeds voor de laadsnelheid van je website. Naast de resolutie verlagen kan er gebruik gemaakt worden van “lazy loading”.
Geen idee hoe en waarom? In deze blog leg ik je precies uit wat je kan doen om jouw afbeeldingen te optimaliseren in HubSpot!
Om te zien hoe jouw website presteert ga je naar Google - PageSpeed Insights. Hier kun je de score van je website bekijken en zien waar het fout gaat. Als je afbeeldingen niet zijn geoptimaliseerd, dan is de kans groot dat je slecht scoort en je hier dus verandering in moet aanbrengen.
De scherpte van een afbeelding wordt bepaald door de resolutie. Check dus altijd na het verlagen van de resolutie of de afbeelding nog goed tot zijn recht komt op jouw website, in jouw e-mail of blog. Gelukkig heeft HubSpot 3 resolutie opties klaar staan om uit te kiezen.
Als je een nieuwe afbeelding invoegt en met de cursor op de afbeelding gaat staan. Komt er Details in beeld te staan. Klik hier vervolgens op.
Bij Image Optimization kun je kiezen voor 3 opties:
Tip! Gebruik waar het kan Scalable Vector Graphics (SVG's). Een SVG kan oneindig groot en klein geschaald worden zonder dat de kwaliteit verloren gaat.
Lazy loading is simpelweg het vertraagd laden van je afbeeldingen. Lazy loading voeg je toe aan afbeeldingen die niet meteen in beeld staan. Het zorgt er dus voor dat de afbeeldingen pas laden als ze tevoorschijn komen. Vooral op pagina’s met veel afbeeldingen zal lazy loading tot zijn recht komen. Je voegt lazy loading toe bij de afbeeldingen in de drag and drop builder in HubSpot.
Onder de afbeelding staat Image loading. Hier heb je 3 keuzes:
Maak je gebruik van een custom module? Dan kan het zijn dat je niet gelijk de optie ziet om lazy loading in te stellen. Vraag jouw websitebouwer of deze optie aangezet kan worden.
Wil je hulp bij het optimaliseren van je afbeeldingen? Laat het ons gerust weten, we helpen je graag verder!