appiphanyinc.com

Een van de eerste uitdagingen waarmee ik als webmaster van deze blog te maken kreeg, had betrekking op afbeeldingen. Nodig zijn comprimeer afbeeldingen (JPG, PNG, GIF) met een zeer hoog niveau van eisen als u de serverbronnen wilt optimaliseren en ook snel wilt laden.

Vandaag ga ik de 2 methoden die ik gebruik uitleggen bewerk en comprimeer afbeeldingen als een echte ninja. De afgelopen 3 jaar heb ik alles geprobeerd, maar uiteindelijk is dit wat voor mij het beste werkt, dus ik wil het met jullie delen.

Een of meer afbeeldingen tegelijk comprimeren op de meest eenvoudige manier

Wat veel mensen aanbevelen om afbeeldingen te comprimeren, is het gebruik van programma's zoals Photoshop of andere multimedia-editors van de stijl. Iets dat heel goed is, maar dit soort applicatie ze zijn meestal niet goedkoop precies, en ze brengen ook veel professionele functies met zich mee waar ik persoonlijk genoeg van heb - ik wil gewoon een paar aanpassingen maken en een paar afbeeldingen comprimeren, niet een korte animatie van 8 minuten maken.

Een afbeelding bewerken en comprimeren zonder een applicatie te installeren

Als alles wat ik nodig heb, is om een ​​afbeelding te comprimeren en de marges en grootte aan te passen Ik gebruik een webtool met de naam Pixlr Express. Het is een online applicatie die jaren geleden het licht zag van Autodesk –dezelfde van Autocad-, en die nu is overgenomen door een ander bedrijf (123RF). Maar laten we ter zake komen ...

Het probleem is, het is nog steeds gratis en het werkt net zo goed. Niet alleen dat, maar geen registratie vereist en het stelt ons in staat om afbeeldingen te bewerken, filters, lettertypen en een flink aantal effecten toe te voegen. Ik heb het al een hele tijd in de map "favorieten" van mijn browser staan.

Om een ​​afbeelding te comprimeren met Pixlr Express we hoeven alleen de afbeelding in de editor te laden en op "Sparen”. Bij het opslaan stelt de tool ons in staat om het gewenste compressieniveau toe te passen (van 0% tot 100%).

Op het moment van opslaan is het moment waarop we de afbeelding kunnen comprimeren

De kwaliteit van de afbeelding komt natuurlijk overeen met het compressieniveau dat we toepassen. Als persoonlijk advies raad ik je aan om te solliciteren een compressieniveau van 65% in vergelijking met het origineel. Op dat punt ziet het beeld er nog steeds goed uit en wordt het gewicht drastisch verminderd.

Hoe u meerdere afbeeldingen tegelijk comprimeert en trapsgewijs maakt

Als we meerdere afbeeldingen hebben, kan het werken met Pixlr een beetje vervelend zijn. Voor deze gevallen gebruik ik een gratis programma genaamd HERRIE (Radical Image Optimization Tool), speciaal ontworpen om JPG-, GIF- en PNG-afbeeldingen te comprimeren.

Met RIOT kunnen we een afbeelding laden, het compressieniveau aanpassen en een voorbeeld zien van hoe het eruit zou zien als de compressie eenmaal was toegepast. Dit is voor ons geweldig om het zoveel mogelijk aan te passen en er toch goed uit te zien.

Maar de echte magie van RIOT zit hem in zijn "Batch" -functie. Vanaf hier kunnen we meerdere afbeeldingen tegelijk laden (bijvoorbeeld alle afbeeldingen in een map of submappen) en comprimeer ze in cascade. Om dit te doen, hoeven we alleen maar op het pictogram te klikken "Partij”, Selecteer de bestemmingsmap (Uitvoermap) en de bronmap (Afbeeldingen toevoegen -> Alle afbeeldingen uit de map toevoegen). Zodra we alles naar onze zin hebben, klikt u op "Begin”Om bulkcompressie uit te voeren voor alle geselecteerde afbeeldingen.

Dat is leuk hoor, hoor ...

Het verschil tussen afbeeldingen een voor een comprimeren en het op deze manier doen, is gewoonweg verschrikkelijk. Stel je voor dat je alle afbeeldingen van een universitaire baan moet optimaliseren, of erger nog, alle afbeeldingen op je website.

Het perfecte compressieniveau voor afbeeldingen op een blog of website

Zoals ik hierboven al zei, is het perfecte compressieniveau 65% voor webpagina's. Maar dit is slechts een persoonlijke aanbeveling ...

Maar als we een webpagina hebben en we willen het "perfecte" compressieniveau, dan zullen we zeker iets meer willen dan de persoonlijke aanbeveling van een gek die zichzelf "de gelukkige Android" noemt.

Voor deze gevallen heeft Google de bekende pagina voor webmasters Pagespeed Insights. Deze tool vertelt ons niet alleen de laadsnelheid van onze website en geeft ons wat ander advies, maar stelt ons ook in staat om een ​​kopie te downloaden van alle afbeeldingen die een specifieke URL bevat. Deze kopieën van de afbeeldingen worden 100% geoptimaliseerd.

Om de afbeeldingen te downloaden, moeten we de URL invoeren waar ze hangen, en klikken op de "Analyseren”. Zodra de analyse is voltooid, van de "Computer"We scrollen bijna tot het einde en klikken op de link"Download de afbeelding, JavaScript- en CSS-bronnen die zijn geoptimaliseerd voor deze pagina”. We krijgen automatisch een ZIP-bestand waarin deze bronnen al zijn geoptimaliseerd.

Het is een beetje verborgen, maar het is een functie met een brutaal hulpprogramma

Ik hoop dat deze tutorial nuttig voor je is. Als ik zoiets had kunnen lezen toen ik aan dit project begon, zou het me zeker veel hoofdpijn hebben bespaard.

P.D: Post gewijd aan mijn "ik" uit het verleden. Eens kijken of je het leert, jochie!

Heb je Telegram geïnstalleerd? Ontvang de beste post van elke dag op ons kanaal. Of, als je dat liever hebt, kom alles te weten in onze Facebook pagina.