In mijn blogs besteed ik veel aandacht aan de techniek achter webshop, maar natuurlijk is de voorkant, de look-and-feel die shop maakt! Ooit als webdesigner gestart, weet ik dat foto’s de sfeer van de website of shop bepalen. Ook zijn afbeeldingen soms de “boosdoener” als het gaat om performance problemen. Daarom is het tijd om wat aandacht te besteden aan de foto’s op een webshop.
Natuurlijk zijn er een paar open deuren t.a.v. afbeeldingen, zoals foto’s en afbeeldingen plaatsen die de doelgroep aanspreekt, het juiste bestandstype etc. In deze blog besteed ik aandacht aan wat tips, waardoor je beter scoort met je webshop.
Zoekmachines via AI content verstrekken
Door jouw afbeelding meer context te geven in de vorm van productbeschrijvingen, begrijpen zoekmachines beter wat er op de pagina staat en rank je beter. Gebruik zoektermen die jouw doelgroep gebruikt. Als je zoekwoordonderzoek voor jouw webshopteksten hebt gedaan kun je die keywords goed gebruiken in de alt-tags.
In Shopify is er tegenwoordig een standaard AI wizard, waarmee deze content gecreëerd kan worden. Geen Shopify, niet getreurd, want er zijn ook veel apps beschikbaar voor andere platformen, zoals Elementor voor Wordpess.
Type afbeelding
JPG is het meest gangbare bestandstype voor productafbeeldingen, hero- en slideshowbanners, blogpostafbeeldingen. PNG: biedt een hogere kwaliteit compressie, maar met een grotere bestandsgrootte dan JPG’s. Dit formaat is geschikter voor logo’s en pictogrammen.
Het juiste formaat voor betere performance!
In de intro gaf ik het al aan een trage pagina kan soms komen door te zware product afeeldingen. Die qua formaat te groot zijn, voor een banner kun je het beste voor desktop de maximale breedte aanhouden van de devices die je shop het vaakste bezoeken (te vinden in Google Analytics) . De meest voorkomende beeldscherm resoluties zijn: 1024×768, 1280×1024, 1366×768 pixels, 1400×1050, 1680×1050 en 1920×1080 pixels, dus een banner van 1280 px breed zal voor het grootste deel van het publiek er prima uitzien. Het is aan te raden om voor de mobile versie van de shop een kleinere banner te gebruiken, zodat de pagina sneller laad.
Niet alleen de afmeting is van belang, maar ook hoe zwaar het bestand is. Is een afbeelding boven de 1 MB dan is dat veel te zwaar. Een gemiddelde afbeelding zit rond de 100kb. Er zijn online tools beschikbaar die een afbeelding kunnen comprimeren naar een minder zware variant en toch de kwaliteit behouden.
Eigen look-and-feel via AI
In 2000 kon je al webdesigner op een CD sfeerfoto’s kopen, die waren duur en vaak zat het er net niet tussen wat je zocht en voor je het wist stond de plank vol met CD’s met stock images, later kon je stock foto’s downloaden en was er ook veel online gratis beschikbaar. Een mooie oplossing, maar niet uniek. Toen kwam de mobiel met goede camera’s en filters, maar tja die kwaliteit was niet je van het…
Maar nu…Met Openart.ai kun je tegenwoordig je eigen sfeerafbeeldingen creëren. De mogelijkheden zijn eindeloos, door verschillende filters en opdrachten te gebruiken heb je binnen enkele minuten zoveel verschillende varianten waar je uit kunt kiezen. Zoals bijvoorbeeld een zwarte kat bij een kerstboom, geeft met 6x klikken en 6 verschillende overlay’s een compleet ander plaatje in een handomdraai!
Hopelijk heb ik je weer op weg geholpen je shop een beetje beter te maken met deze tips, have fun met het creëren van je eigen afbeeldingen via openart.ai 😊