Google staat aan de top van de voedselketen op internet. De samenleving beïnvloedt (of dicteert) veel van wat er online gebeurt. En hun nieuwe afbeeldingsformaat, WebP, zet deze trend voort. Nu de snelheid van het laden van pagina's steeds belangrijker wordt (voornamelijk vanwege Google Page Rank), beschouwen ontwikkelaars en ontwerpers beeldcompressie als de gemakkelijkste manier om laadtijden te verminderen. Google WebP-afbeeldingen zijn ongeveer 30% kleiner dan gewone JPG- of PNG-afbeeldingen en behouden een gelijkwaardige kwaliteit. Het beste van alles is dat u zich geen zorgen hoeft te maken over het handmatig converteren van uw afbeeldingen naar WebP.

In dit artikel laten we u zien hoe u dit nieuwe afbeeldingsformaat kunt gebruiken met WordPress, ook al wordt het nog niet standaard ondersteund.

Gebruik Optimole om WebP-bestanden op WordPress te presenteren

WebP, als afbeeldingsindeling, wordt niet standaard ondersteund in WordPress. U kunt een .webp-afbeelding uploaden, maar net als bij een SVG-bestand kunt u foutmeldingen krijgen. En nogmaals, wat betreft het gebruik van SVG-bestanden met WordPress , er is een eenvoudige oplossing via plug-in.

Onder de geteste WebP-services, Optimole onderscheidt zich van de massa. Het kan inderdaad werken met een minimum aan configuratie. We willen u daarom uitleggen hoe u het configureert en uw WordPress-installatie zo gemakkelijk mogelijk compatibel maakt met het WebP-formaat.

Allereerst zul je duidelijk willen download en installeer de plug-in zelf . Het staat in de WP.org-directory en is helemaal gratis. Sinds de API-gebaseerde service die het inschakelt (tot op zekere hoogte). Hoewel het mogelijk is om traditionele afbeeldingen on-the-fly naar WebP te converteren met PHP, verlenen niet alle webhosts deze toestemming aan uw server. Als u deze toestemming heeft, kunt u de plug-in ook bekijken WebP Express. Daar krijg je veel controle over , maar het is een systeem dat meer configuratie vereist om soepel te kunnen werken.

Zodra Optimole is geïnstalleerd en geactiveerd op uw Site web WordPress, je vindt een nieuwe menu-optie op Media - Optimole .

Uw Optimole API-sleutel

Voordat u toegang kunt krijgen tot instellingen of configuraties, moet u een Optimole-account hebben. Als u er al een heeft geconfigureerd, kunt u op de knop klikken Ik heb al een API-sleutel . Als niet, sla de API-sleutel op en verzend deze per e-mail . Het basis-API-sleutelaccount is gratis en u krijgt ongeveer 5 hits op dit niveau. Als u meer nodig heeft, zijn er prijsniveaus beschikbaar.

Optimole definieert een bezoek als ' iedereen die je bezoekt als je een keer [. . .] Elke gebruiker wordt slechts één keer geteld. Het maakt niet uit wat ze op uw site doen, hoeveel afbeeldingen ze downloaden of hoeveel pagina's ze bezoeken; het is maar een gebruiker. Als ze uw site verlaten en dezelfde dag terugkomen, zijn ze nog steeds gewoon een gebruiker. "

Zodra de gemeten bezoeken zijn uitgeput, worden alleen de WebP-afbeeldingen niet meer weergegeven. Uw afbeeldingen zelf niet. U vindt de API-sleutel helemaal bovenaan in uw Optimole-dashboard.

Plak het gewoon in uw WordPress-dashboard en u bent klaar om WebP-afbeeldingen te verspreiden met WordPress.

Uw Optimole WordPress-dashboards

In uw WordPress-dashboard krijgt u basisinformatie over uw WebP-optimalisatie. Hiermee kunt u problemen oplossen en het succes van deze versnelling beoordelen. Op deze manier kunt u verschillende instellingen wijzigen.

Eerst zie je het account dat aan de API is gekoppeld, en onder aan het scherm toont de plug-in de nieuwste geoptimaliseerde afbeeldingen. U kunt zien hoeveel kleiner de weergegeven WebP-afbeeldingen zijn dan de originele afbeeldingen die u naar WordPress hebt geüpload.

Dan is er het tabblad moeilijkheden mogelijk bovenop. Niemand ziet het gemarkeerde tabblad graag, maar we moeten ook allemaal zien welke conflicten er kunnen ontstaan.

Het belangrijkste probleem waarmee we werden geconfronteerd, zijn andere plug-ins voor beeldcompressie en levering. Zoals je in de bovenstaande afbeelding kunt zien, werkt de Jetpack-plug-in op dezelfde manier als Optimole via Photon APIT , zodat ze hun hoofd kunnen stoten. Voor ons uitte dit zich in het feit dat er geen beelden naar de bezoeker. We hebben geen problemen gehad met andere compressieservices zoals TinyPNG of Smush.

Dashboards gebruiken

Als u meer gedetailleerde informatie wilt over hoe uw site met WebP werkt, bevat het Optimole External Dashboard deze informatie voor u.

In plaats van slechts 9,5 keer kleiner, kunt u de werkelijke grootte zien van de bestanden die worden geserveerd. Evenals de bestanden zelf gedurende een periode van 30 dagen.

U kunt ook watermerken instellen in het Optimole-dashboard (of WP), zodat iedereen die een WebP van uw WordPress-site ontvangt, automatisch uw logo-blazoen ontvangt. Het is een eenvoudig proces en u krijgt controle over de dekking, locatie en meer.

U kunt in principe hetzelfde doen vanuit beide dashboards. Ofwel onder het tabblad Parameters van WordPress, of door een bezoek te brengen aan het dashboard buiten Optimole. Het hangt allemaal af van waar je het meest comfortabel mee bent, evenals het niveau van donnees wat je op een bepaald moment nodig hebt.

Bovendien kunt u het compressieniveau, lazy loading en wanneer / of bepaalde afbeeldingen worden gestreamd als WebP op basis van bestandsnamen regelen. Dit alles vindt u op het tabblad Parameters de Media - Optimole .

pak

Het beste van het gebruik van WebP met WordPress-websites is dat u niet handmatig met de bestanden hoeft te werken. Geen extra downloads, geen extra compressietijd, niets. Vanwege de manier waarop API's werken, worden alle processen en berekeningen in realtime uitgevoerd. Google heeft het internet echt sneller gemaakt door WebP te gebruiken in plaats van JPG of PNG. Het belangrijkste voordeel is echter dat de afbeeldingen dezelfde kwaliteit behouden, ook al wordt hun formaat aanzienlijk verkleind. Het is misschien interessant van u dat Google u dwingt om hun indeling te gebruiken om uw site te versnellen, zodat deze u hoger kan rangschikken en de eindgebruikerservaring ook beter is. En dat is waar het uiteindelijk om gaat.