Afbeelding Optimalisatie

Imagify biedt drie optimalisatieniveaus: standaard, agressief en ultra. Bij deze niveaus draait het in wezen allemaal om de beeldkwaliteit. Een van de nadelen van beeldoptimalisatie is dat u wel degelijk beeldkwaliteit verliest. Het is slechts klein en normaal gesproken onmerkbaar, maar het kan merkbaar worden als ultrahoge beeldkwaliteit belangrijk voor u is. Dit zou vaak het geval zijn op websites zoals fotografie-, kunst- of sieradensites enz.

Doet het Degraderen Afbeeldingen Veel?

Veel hangt af van het type afbeeldingen dat je gebruikt. Standaardkwaliteit zal ze bijvoorbeeld helemaal niet verslechteren, terwijl ultra ze enigszins pixeliseert, maar niet te veel. Deze website is bijvoorbeeld ingesteld op ultra kwaliteit. Het voordeel is dat de afbeeldingen in ultra veel kleiner zijn en dus sneller laden dan zelfs de agressieve instelling.

Sommige mensen gaan direct voor de ultrastand en merken echt het verschil. Wanneer u begint met optimaliseren, Zorg ervoor dat u het vakje aanvinkt om de originelen te behouden. Zo kun je, als de ultra-instelling je niet bevalt, terugkeren naar een hogere kwaliteit.

Over het algemeen zal de agressieve instelling uw afbeeldingen met ongeveer 15% in kwaliteit verminderen tot een 85%-niveau. Dit is voor het menselijk oog niet waarneembaar en de meest voorkomende setting. Als de beeldkwaliteit niet van cruciaal belang is, of als u afbeeldingen in cartoonstijl gebruikt in plaats van foto's, kies dan voor ultra. Het is nog steeds volkomen acceptabel. Normaal gesproken haal je met een ultra-instelling ongeveer 85% van je beeldformaat af. Dit betekent dat een afbeelding van 1 MB kleiner wordt tot een grootte van tussen de 100 en 150 pond, wat een enorm verschil maakt voor de laadtijd van de pagina en de paginasnelheidsscores.

Kan ik Doe alles Mijn afbeeldingen één keer aan?

Ja dat kan – bekijk de video voor een handleiding over hoe Imagify werkt. Een goede tip is om ook jouw themamap mee te nemen in de optimalisaties. Uw thema zal veel afbeeldingen bevatten, waarvan sommige rond uw website zullen worden gebruikt. Door uw themaafbeeldingen in te voegen, maximaliseert u de afbeeldingen die u op uw website kunt optimaliseren.

Om te bepalen hoeveel afbeeldingen u moet optimaliseren, kijkt u in uw mediabibliotheek. Het zal je vertellen hoeveel afbeeldingen je hebt. Vermenigvuldig dit vervolgens met 4 (gemiddeld). Dit komt omdat WordPress meerdere versies van uw afbeeldingen maakt voor responsief ontwerp (miniatuur, 300 x 300 px, enz.). U moet elke versie van elke afbeelding optimaliseren om de volledige voordelen van beeldoptimalisatie op alle apparaten te benutten.

Handmatige beeldoptimalisatie is echt iets voor de puristen. Een voordeel hiervan is dat u een volledig geoptimaliseerde afbeelding uploadt, op het juiste formaat, en dat u dus helemaal geen beeldoptimalisatiesoftware hoeft te gebruiken. U bespaart ook serverruimte omdat er geen afbeeldingen op volledige grootte staan. Het is echter behoorlijk tijdrovend, dus voor de meeste mensen zou ik aanraden om gewoon Imagify te gebruiken.

Ik heb De tijd – Wat is erbij betrokken?

Ten eerste moet u de afbeeldingsafmetingen kennen die u gebruikt. Daar bestaat een goede handleiding voor afbeeldingsformaten en best practices op deze pagina. Zodra u uw afbeeldingsformaten kent, kunt u grote afbeeldingen bijsnijden tot de exacte grootte met behulp van een afbeeldingssoftwaretool. Paint.net is gratis en normaal gesproken goed genoeg hiervoor.

Nadat u uw afbeeldingen op het juiste formaat heeft gemaakt, kunt u deze optimaliseren met behulp van een online tool. Een van de beste die er al jaren is TinyPNG.com. U uploadt eenvoudig uw afbeeldingen en downloadt vervolgens de veel kleinere versie die wordt gemaakt. Twee tips bij het uploaden van deze afbeeldingen naar WordPress:

Ten eerste klinkt het raar, maar zorg ervoor dat u de nieuw geoptimaliseerde versie vanuit de map 'Downloads' naar uw website uploadt. Het is zo gemakkelijk om de verkeerde te uploaden vanaf uw bureaublad of waar u uw afbeeldingen ook opslaat. Ten tweede: gebruik een iets andere naam voor de nieuwe afbeeldingstitel. Dit komt door caching. Het kan zijn dat uw WordPress-installatie de nieuwe afbeeldingsgrootte geruime tijd niet herkent als u de afbeelding met dezelfde bestandsnaam uploadt.

Nadat u dit heeft gedaan, kunt u nog een stap verder gaan en de nieuw geoptimaliseerde afbeeldingen naar het WEBP-formaat converteren. Doe dit voordat u ze uploadt. Ga naar de CloudConvert website. Het volgt precies hetzelfde proces als TinyPNG, behalve dat u ervoor kiest om ze naar WEBP te converteren. Download vervolgens de bestanden en upload ze naar uw server.

Het gebruik van software zoals Imagify is een stuk eenvoudiger, maar uiteindelijk zul je onbewerkte, geoptimaliseerde afbeeldingen geüpload hebben, zodat je geen beeldconversietools hoeft te gebruiken, of dat er voortdurend WEBP-conversies actief zijn.

WEBP is een nieuwer afbeeldingsformaat ontwikkeld door Google. De afbeeldingen zijn veel kleiner dan de traditionele JPG- en PNG-formaten en dus moet je ze gebruiken – op voorwaarde dat je server de conversie van traditionele afbeeldingen naar WEBP ondersteunt.

WEBP ontstond eigenlijk in 2010, maar wordt desondanks nog steeds gezien als een 'opkomend' format. Je leest misschien dat je de originele JPG/PNG-afbeeldingen nodig hebt als reserve, evenals de WEBP-formaten, maar de waarheid is dat Chrome, Firefox, Safari en alle andere grote browsers dit ondersteunen, dus het is nu prima om alleen WEBP-versies te hebben.

Doet mijn server Steun Hen?

Imagify heeft een automatische instelling om dit op uw server in te schakelen. De meeste beeldoptimalisatieprogramma's die naar WEBP converteren, doen dit. Het zal controleren en u vertellen of uw server geen WEBP-afbeeldingen zal weergeven. Wat er eigenlijk moet gebeuren, is dat WordPress uw afbeeldingsbestanden op twee manieren moet herschrijven om te kunnen werken. Sommige servers staan dit toe, andere niet:

De beste manier is via fototags. Dit is een HTML5-opdracht die de deel naar een label. Het is vrij eenvoudig, maar niet alle servers ondersteunen het. De tweede manier is om de bestanden te herschrijven via het .htaccess-bestand. Dit is niet de beste manier om dit te doen, omdat het bijdraagt aan serververzoeken bij het laden van pagina's. Het is echter nog steeds nuttig om WEBP te gebruiken als u het op deze manier moet doen.

Kinta is NGINX en is al ingesteld voor WEBP voor het geval je een niet-compatibele serverconfiguratie hebt.

Imagify is een geautomatiseerd proces dat zeer snel is. De benodigde tijd is afhankelijk van de afbeeldingsformaten die u gebruikt. Het optimaliseren van een normaal beeld van minder dan 1 MB duurt enkele seconden.

Vergeet niet om het aantal weergegeven afbeeldingen in uw mediabibliotheek met 4 te vermenigvuldigen, zodat alle responsieve formaten kunnen worden geoptimaliseerd. Stel dat u 100 afbeeldingen heeft, dan worden er 400 geoptimaliseerd. Vermenigvuldig dat met gemiddeld 5 seconden per stuk en je krijgt het idee. Dat zal iets meer dan een half uur in beslag nemen.

Grotere afbeeldingen kunnen langer duren en het kan erg lang duren voordat winkels klaar zijn. Als u bijvoorbeeld 10.000 mediabibliotheekafbeeldingen heeft, moet u 40.000 responsieve afbeeldingen optimaliseren. Vermenigvuldig dat met elk 5 seconden en je kijkt naar 2/3 dagen om je afbeeldingen te optimaliseren.

De gemiddelde website heeft echter lang niet zoveel afbeeldingen, dus het proces zou binnen ongeveer een uur voltooid moeten zijn.

Dus je hebt al je afbeeldingen gemaakt. Ga al uw caches opnieuw wissen en voer een paginasnelheidstest uit. U zult nu merken dat uw website veel sneller laadt, vooral op mobiele apparaten.

Als u tevreden bent met uw afbeeldingen, gaat u verder met de volgende fase. Het volgende deel in het optimalisatieproces is de WP-Rocket caching-sectie, waardoor je scores nog hoger zullen stijgen.