Eerder schreef ik een artikel over het verkleinen van een afbeeldingsbestand  met behulp van de ingebouwde e-mailoptie in Verkenner^(Explorer) of met behulp van een desktopprogramma met de naam Image Resizer voor Windows . Dit zijn goede opties, maar er zijn verschillende andere manieren om een ​​afbeelding te optimaliseren. Veel websites zullen je ook vertellen om Paint te gebruiken , maar ik heb ontdekt dat het geen goede methode is omdat de afbeeldingen er veel slechter uitzien.

Ten eerste is het belangrijk om te begrijpen dat sommige methoden die worden gebruikt om de grootte van een afbeelding te verkleinen, resulteren in een afbeelding van lagere kwaliteit, wat prima is voor een website, maar niet voor afdrukken. Dit gebeurt meestal wanneer u de resolutie van een afbeelding wijzigt, bijvoorbeeld van 2560×1440 in 1920×1080.

Een andere manier om de grootte van een afbeelding te verkleinen, is door de afbeelding te comprimeren. Er zijn twee soorten compressie: lossless en lossy. Compressie^(Lossless) zonder verlies zal de grootte van de afbeelding verkleinen zonder een enkele pixel van het originele bestand te verliezen. Lossy betekent dat sommige gegevens verloren gaan.

Ten slotte maakt het beeldformaat ook een groot verschil in de grootte van het bestand. Een normale foto die je met je camera maakt, zal waarschijnlijk een JPG -afbeelding zijn, want dat werkt goed qua compressie. Afbeeldingen met weinig kleuren (256 kleuren of minder) zullen echter een stuk kleiner zijn als je GIF gebruikt . PNG is een verliesvrij formaat dat sterk kan worden gecomprimeerd. Het werkt goed voor webafbeeldingen en complexe foto's.

In dit artikel geef ik een paar voorbeelden met screenshots van het comprimeren van een afbeelding met meerdere formaten, zodat je de verschillen in grootte en kwaliteit kunt zien.

Hoe de afbeeldingsgrootte te verkleinen

Laten we beginnen met te praten over hoe u de afbeelding kunt verkleinen zonder kwaliteitsverlies. Dit geeft je het kleinste bestand terwijl de originele kwaliteit van de afbeelding behouden blijft. Het is duidelijk dat het gebruik van lossy compressie je veel kleinere bestanden geeft, zoals je in de onderstaande voorbeelden zult zien, maar je zult wat kwaliteit verliezen.

Formaat en compressie

Laten we eerst beginnen met een egale kleurenafbeelding. Als voorbeeld heb ik zojuist een screenshot gemaakt van de HDG- website (600×319) omdat deze weinig kleuren heeft en niet complex is. Hier zijn de bestandsgroottes in de verschillende formaten zonder enige compressie:

Originele GIF: 27 KB

Originele JPEG: 67 KB

Originele PNG: 68 KB

Zoals je kunt zien, zijn de PNG- en GIF- bestanden absoluut scherper dan de JPEG -bestanden . Zoals eerder vermeld, is JPEG beter voor fotografie. GIF doet het hier goed omdat het slechts 27 KB is in vergelijking met de PNG , die 68 KB is. In mijn ervaring comprimeren PNG^(PNGs) 's echter veel beter als het een compressie met verlies is en de beeldkwaliteit nog steeds erg goed is.

Toen ik een verliesloze compressie van de drie deed, werden alleen de JPG- en PNG - afbeeldingen kleiner, maar niet veel. De PNG ging naar 45 KB en de JPG ging naar 58 KB. Toen ik een lossy compressie deed, waren de cijfers voor PNG het meest indrukwekkend.

Lossy GIF: 22 KB

JPEG met verlies: 50 KB

PNG met verlies: 23 KB

Zoals je kunt zien, ziet de PNG er het beste uit en is hij slechts 1 KB groter dan de GIF ! Daarom gebruik ik PNG - afbeeldingen op deze website voor de meeste van mijn screenshots. JPEG is normaal gesproken altijd beter voor foto's met veel kleuren. Maar onthoud, JPG is slechts 16-bits, terwijl PNG 24-bit is, dus JPG ondersteunt miljoenen kleuren, maar PNG ondersteunt onbeperkte kleuren.

De GIF is slechts met 5 KB verminderd, maar heeft tegelijkertijd veel kwaliteit verloren. De JPG comprimeerde niet veel, maar JPG's comprimeren^(JPGs) normaal gesproken niet zo goed als PNG^(PNGs) 's.

Je kunt je foto-app gebruiken om het formaat van een afbeelding te wijzigen om te zien welk formaat het kleinst is. Voor compressie raad ik het gebruik van online tools aan, omdat ze geweldig werk leveren. Persoonlijk gebruik ik Kraken.io voor mijn websites, maar er zijn andere goede die er zijn, zoals TinyPNG  en Optimizilla .

Afbeeldingsresolutie wijzigen

De belangrijkste manier om een ​​afbeelding te verkleinen, is door de afbeeldingsresolutie te verlagen. Als je een bestand hebt van 4000×2500, dan zal het verkleinen van de grootte tot 2000×1250 het bestand de helft kleiner maken. Je verliest natuurlijk een groot deel van de originele afbeelding in de gegevens, maar afhankelijk van je doel maakt het misschien niet uit.

Elk beeldbewerkingsprogramma heeft een manier waarop u de afbeelding kunt wijzigen of vergroten of verkleinen. Hier kunt u de breedte/hoogte of de resolutie wijzigen, normaal gesproken dots per inch ( DPI ) of pixels per inch ( PPI ). Lees dit geweldige artikel over het verschil tussen DPI en PPI^{(difference between DPI and PPI)} . Voor alles op internet hoeft u zich alleen zorgen te maken over pixels, niet over punten. Punten^(Dots) hebben alleen effect op afgedrukte afbeeldingen.

Dus mijn website kan bijvoorbeeld alleen afbeeldingen tot 680 pixels breed hebben. Daarom^(Therefore) verklein ik altijd het formaat van een afbeelding naar 680 pixels of lager voordat ik het upload, omdat WordPress het anders voor mij zal verkleinen naar 680px, maar de bestandsgrootte zal groter zijn dan nodig is.

Als je meer wilt weten over het 72 pixels/inch-nummer en de resample-optie, bekijk dan dit uitstekende bericht^{(excellent post)} dat tot in detail gaat.

Kleurdiepte/modus wijzigen

Als u in het bovenstaande voorbeeld een afbeelding met slechts enkele kleuren heeft, hoeft u geen afbeeldingsindeling te gebruiken die miljoenen kleuren ondersteunt. In mijn webpaginavoorbeeld hoeft de GIF alleen geïndexeerde^(Indexed) kleuren en 8 bits/kanaal te ondersteunen.

U kunt RGB -kleur en 16 bits/kanaal kiezen, maar de afbeelding ziet er dan precies hetzelfde uit, maar heeft een grotere bestandsgrootte. U kunt meer lezen over deze kleurmodi^{(colors modes)} op de website van Adobe. Naast Photoshop laten de meeste afbeeldingseditors je ook de kleurdiepte/modus voor een afbeelding wijzigen.

Afbeelding bijsnijden

Een andere gemakkelijke manier om de grootte van een afbeelding te verkleinen, is door deze eenvoudig bij te snijden! Alles dat is weggesneden, wordt voltooid uit de afbeelding verwijderd. Welke afbeelding je ook hebt, je kunt hem normaal gesproken op zijn minst een beetje bijsnijden, wat zeker zal helpen om de grootte te verkleinen.

En merk op dat een uitsnede niet alleen de typische hoeft te zijn waarbij je dingen van boven/onder of links/rechts wegknipt. SnagIt Editor , een van mijn favorieten, heeft een uitsnijdingstool waarmee je delen van afbeeldingen horizontaal of verticaal uit het midden van een afbeelding kunt knippen. Dit komt vaker van pas dan je zou denken. Hier is een voorbeeld waarbij ik een schermafbeelding van het menu Start moet opnemen terwijl ik een opdracht typ.^(Start)

De bovenstaande bestandsgrootte was oorspronkelijk 22 KB groot. In plaats van dat te gebruiken, knipte ik het middelste gedeelte uit, dat ik niet nodig had, zoals hieronder weergegeven.

De nieuwe bestandsgrootte is slechts 9 KB! Dat alles zonder zelfs maar enige compressie uit te voeren of het bestandsformaat te wijzigen. Toen ik het eenmaal had gecomprimeerd, kreeg ik het terug tot slechts 4,4 KB. Bijsnijden is dus een belangrijke manier om de grootte van een afbeelding te verkleinen.

Hopelijk heb je de grootte van je afbeelding verkleind en een beetje geleerd over hoe digitale afbeeldingen werken! Als je vragen hebt, voel je vrij om commentaar te geven. Genieten van!

How to Reduce the Size on an Image File

Previouѕlу, I wrote an artісle on how to reduсe the size of an image file using the built-in email option іn Explorer or by υsing a desktop program called Image Resizer for Wіndows. Thеse are good options, bυt there are several other wayѕ to go about optimizing an іmagе. Also, a lot of websites will tell you to use Paint, but I have fоυnd it’s not a good method because the images look way worse.

Firstly, it’s important to understand that some methods used to reduce the size of an image will result in a lower quality picture, which may be fine for a website, but not for printing. This usually occurs when you change the resolution of a picture, say from 2560×1440 to 1920×1080.

Another way to reduce the size of an image is to compress the image. There are two types of compression: lossless and lossy. Lossless compression will reduce the size of the image without losing a single pixel of the original file. Lossy means that some data will be lost.

Finally, the picture format also makes a big difference in the size of the file. A normal picture you take from your camera will probably be a JPG image because that works well in terms of compression. However, images with few colors (256 colors or less) will be a lot smaller if you use GIF. PNG is a lossless format that can be highly compressed. It works well for web graphics and complex photographs.

In this article, I give a few examples with screenshots of compressing an image using multiple formats so you can see the size and quality differences.

How to Reduce Image Size

Let’s start off by talking about how you can reduce the size of the image without losing quality. This will give you the smallest file while keeping the original quality of the image. Obviously, using lossy compression will give you much smaller files, as you’ll see in the examples below, but you’ll lose some quality.

Format & Compression

First, let’s start with a flat color graphic. As an example, I just took a screenshot of the HDG website (600×319) since it has few colors and isn’t complex. Here are the files sizes in the different formats without any compression:

Original GIF: 27 KB

Original JPEG: 67 KB

Original PNG: 68 KB

As you can see, the PNG and GIF files are definitely sharper than the JPEG. As mentioned earlier, JPEG is better for photography. GIF does well here as it’s only 27 KB compared to the PNG, which is 68 KB. However, in my experience, PNGs compress much better if it’s a lossy compression and the image quality is still very good.

When I did a lossless compression of the three, only the JPG and PNG images got reduced in size, but not by much. The PNG went to 45 KB and the JPG went to 58 KB. When I did a lossy compression, the numbers for PNG were the most impressive.

Lossy GIF: 22 KB

Lossy JPEG: 50 KB

Lossy PNG: 23 KB

As you can see, the PNG looks the best and it’s only 1 KB bigger than the GIF! That’s why I use PNG images on this website for most of my screenshots. JPEG will always normally be better for photography images with lots of colors. But remember, JPG is only 16-bit, whereas PNG is 24-bit, so JPG supports millions of colors, but PNG supports unlimited colors.

The GIF only reduced by 5 KB, but at the same time lost a lot of quality. The JPG didn’t compress much, but JPGs normally don’t compress as well as PNGs do.

You can use your photo app to change the format for an image to see which size is smallest. For compression, I recommend using online tools as they do a great job. I personally use Kraken.io for my websites, but there are other good ones out there like TinyPNG and Optimizilla.

Change Image Resolution

The main way to shrink an image is to lower the picture resolution. If you have a file that is 4000×2500, then reducing the size to 2000×1250 will make the file half the size. You’ll obviously be losing a large chunk of the original image in the data, but depending on your purpose, it may not matter.

Every image editing program will have a way for you to change or resize the image. Here you can change the width/height or the resolution, which is normally dots per inch (DPI) or pixels per inch (PPI). Read this great article on the difference between DPI and PPI. For anything on the web, you only have to worry about pixels, not dots. Dots will only effect printed images.

So, for example, my website can only have images up to 680 pixels wide. Therefore, I always resize an image to 680 pixels or lower before uploading it because otherwise WordPress will resize it to 680px for me, but the file size will be larger than it needs to be.

If you want to understand more about the 72 pixels/inch number and the resample option, check out this excellent post that goes into great detail.

Change Color Depth/Mode

In the example above, if you have an image with only few colors, then you don’t need to use an image format that supports millions of colors. In my webpage example, the GIF only needs to support Indexed color and 8 bits/channel.

You can choose RGB color and 16 bits/channel, but the image would look exactly the same, but have a larger file size. You can read more about these colors modes on Adobe’s website. In addition to Photoshop, most image editors also let you change the color depth/mode for an image.

Crop Image

Another easy way to reduce the size of an image is to simply crop it! Anything that is cropped out will be completed removed from the image. No matter what image you have, you can normally crop it a little bit at least, which will definitely help reduce the size.

And note that a crop doesn’t just have to be the typical one where you cut out stuff from the the top/bottom or left/right. SnagIt Editor, one of my favorites, has a cut out tool that lets you cut out parts of images from the middle of an image horizontally or vertically. This comes in handy way more often than you would think. Here’s an example where I have to include a screenshot of the Start menu while typing a command.

The above file size was originally 22 KB in size. Instead of using that, I cut out the middle portion, which I didn’t need as shown below.

The new file size is just 9 KB! All that without even doing any compression or changing the file format. Once I compressed it, I got it down to only 4.4 KB. So cropping is an important way to reduce the size of an image.

Hopefully, you reduced the size of your image and learned a little bit about how digital images work along the way! If you have any questions, feel free to comment. Enjoy!

Related posts

• Exporteren, wissen en vergroten van gebeurtenislogboeken in Windows

• Hoe de grootte van gebruikerspostvakken in Exchange 2007 te bekijken?

• Boekrecensie - De How-To Geek Guide to Windows 8

• GIMP-plug-ins installeren: een handleiding

• Hoe Google Chrome offline (zelfstandig) installatieprogramma te downloaden

• Verwijder onmiddellijk achtergronden van afbeeldingen met behulp van AI

• Hoe DDS-bestanden te openen in Windows 10

• Hoe de map Windows.old te verwijderen in Windows 7/8/10

• Hoe u uw pc-software automatisch kunt bijwerken

• Hoe dvd's te digitaliseren

• 6 beste camera-instellingen voor maanfoto's

• Een dynamische schijf converteren naar een basisschijf?

• Meerdere pagina's naar één PDF-bestand scannen

• Hoe een drone te vliegen voor totale beginners

• 8 van de beste technische ideeën om met zelfisolatie om te gaan

• Hoe de Windows-toets uit te schakelen

• Een QR-code scannen op iPhone en Android

• Een vergrendeld bestand openen wanneer een ander programma het gebruikt?

• Gebruikersaccountbeheer (UAC) uitschakelen voor een specifieke toepassing

• Pagina's en bestanden in cache bekijken vanuit uw browser