Wcześniej pisałem artykuł o tym, jak zmniejszyć rozmiar pliku obrazu  za pomocą wbudowanej opcji poczty e-mail w Eksploratorze^(Explorer) lub za pomocą programu komputerowego o nazwie Image Resizer for Windows . To dobre opcje, ale istnieje kilka innych sposobów optymalizacji obrazu. Ponadto wiele stron internetowych zaleca używanie Painta^(Paint) , ale uważam, że nie jest to dobra metoda, ponieważ obrazy wyglądają znacznie gorzej.

Po pierwsze, ważne jest, aby zrozumieć, że niektóre metody stosowane w celu zmniejszenia rozmiaru obrazu spowodują obniżenie jakości obrazu, co może być dobre w przypadku witryny internetowej, ale nie w przypadku drukowania. Zwykle dzieje się tak, gdy zmieniasz rozdzielczość obrazu, powiedzmy z 2560×1440 na 1920×1080.

Innym sposobem zmniejszenia rozmiaru obrazu jest jego skompresowanie. Istnieją dwa rodzaje kompresji: bezstratna i stratna. Kompresja bezstratna^(Lossless) zmniejszy rozmiar obrazu bez utraty jednego piksela oryginalnego pliku. Stratna^(Lossy) oznacza, że ​​niektóre dane zostaną utracone.

Wreszcie format obrazu ma również duży wpływ na rozmiar pliku. Normalne zdjęcie, które zrobisz aparatem, będzie prawdopodobnie obrazem JPG , ponieważ działa to dobrze pod względem kompresji. Jednak obrazy z kilkoma kolorami (256 kolorów lub mniej) będą znacznie mniejsze, jeśli użyjesz GIF . PNG to bezstratny format, który można mocno skompresować. Sprawdza się dobrze w przypadku grafiki internetowej i złożonych zdjęć.

W tym artykule podam kilka przykładów ze zrzutami ekranu kompresji obrazu przy użyciu wielu formatów, dzięki czemu można zobaczyć różnice w rozmiarze i jakości.

Jak zmniejszyć rozmiar obrazu

Zacznijmy od rozmowy o tym, jak zmniejszyć rozmiar obrazu bez utraty jakości. Dzięki temu uzyskasz najmniejszy plik przy zachowaniu oryginalnej jakości obrazu. Oczywiście użycie kompresji stratnej da ci znacznie mniejsze pliki, jak zobaczysz w poniższych przykładach, ale stracisz trochę jakości.

Format i kompresja

Najpierw zacznijmy od płaskiej, kolorowej grafiki. Jako przykład, właśnie zrobiłem zrzut ekranu strony HDG (600×319), ponieważ ma ona niewiele kolorów i nie jest skomplikowana. Oto rozmiary plików w różnych formatach bez kompresji:

Oryginalny GIF: 27 KB

Oryginalny plik JPEG: 67 KB

Oryginalny plik PNG: 68 KB

Jak widać, pliki PNG^(PNG) i GIF są zdecydowanie ostrzejsze niż JPEG . Jak wspomniano wcześniej, JPEG jest lepszy do fotografii. GIF dobrze sobie radzi, ponieważ ma tylko 27 KB w porównaniu do PNG , czyli 68 KB. Jednak z mojego doświadczenia wynika, że ​​pliki PNG^(PNGs) kompresują się znacznie lepiej, jeśli jest to kompresja stratna, a jakość obrazu jest nadal bardzo dobra.

Kiedy wykonałem bezstratną kompresję tych trzech, tylko obrazy JPG i PNG zostały zmniejszone, ale niewiele. PNG poszedł do 45 KB, a JPG do^(JPG) 58 KB. Kiedy wykonałem kompresję stratną, liczby dla PNG były najbardziej imponujące.

Stratny GIF: 22 KB

Stratny JPEG: 50 KB

Stratna PNG: 23 KB

Jak widać, PNG wygląda najlepiej i jest tylko 1 KB większy niż GIF ! Dlatego używam obrazów PNG na tej stronie do większości moich zrzutów ekranu. JPEG zawsze będzie lepszy w przypadku obrazów fotograficznych z dużą ilością kolorów. Pamiętaj jednak, że JPG jest tylko 16-bitowy, podczas gdy PNG jest 24-bitowy, więc JPG obsługuje miliony kolorów, ale PNG obsługuje nieograniczoną liczbę kolorów.

GIF zmniejszony tylko o 5 KB, ale jednocześnie stracił dużo na jakości. JPG nie kompresował dużo, ale JPG^(JPGs) zwykle nie kompresują się tak dobrze, jak PNG^(PNGs) .

Możesz użyć aplikacji do zdjęć, aby zmienić format obrazu, aby zobaczyć, który rozmiar jest najmniejszy. Do kompresji zalecam korzystanie z narzędzi online, ponieważ wykonują świetną robotę. Osobiście używam Kraken.io do moich stron internetowych, ale są też inne dobre, takie jak TinyPNG  i Optimizilla .

Zmień rozdzielczość obrazu

Głównym sposobem zmniejszenia obrazu jest obniżenie rozdzielczości obrazu. Jeśli masz plik o wymiarach 4000×2500, zmniejszenie rozmiaru do 2000×1250 spowoduje, że plik będzie o połowę mniejszy. Oczywiście stracisz dużą część oryginalnego obrazu w danych, ale w zależności od celu może to nie mieć znaczenia.

Każdy program do edycji obrazu będzie miał sposób na zmianę lub zmianę rozmiaru obrazu. Tutaj możesz zmienić szerokość/wysokość lub rozdzielczość, która zwykle jest punktami na cal ( DPI ) lub pikselami na cal ( PPI ). Przeczytaj ten świetny artykuł na temat różnicy między DPI a PPI^{(difference between DPI and PPI)} . W przypadku czegokolwiek w Internecie musisz się martwić tylko o piksele, a nie o kropki. Kropki^(Dots) będą miały wpływ tylko na drukowane obrazy.

Na przykład moja strona internetowa może zawierać obrazy o szerokości do 680 pikseli. Dlatego^(Therefore) zawsze zmieniam rozmiar obrazu do 680 pikseli lub mniej przed przesłaniem go, ponieważ w przeciwnym razie WordPress zmieni go dla mnie na 680 pikseli, ale rozmiar pliku będzie większy niż powinien.

Jeśli chcesz dowiedzieć się więcej na temat liczby 72 pikseli na cal i opcji ponownego próbkowania, zapoznaj się z tym doskonałym postem^{(excellent post)} , który zawiera bardzo szczegółowe informacje.

Zmień głębię kolorów/tryb

W powyższym przykładzie, jeśli masz obrazek z tylko kilkoma kolorami, nie musisz używać formatu obrazu, który obsługuje miliony kolorów. W moim przykładzie na stronie internetowej GIF musi obsługiwać tylko kolor indeksowany i 8 bitów na kanał.^(Indexed)

Możesz wybrać kolor RGB i 16 bitów na kanał, ale obraz będzie wyglądał dokładnie tak samo, ale będzie miał większy rozmiar pliku. Możesz przeczytać więcej o tych trybach kolorów^{(colors modes)} na stronie Adobe. Oprócz programu Photoshop^(Photoshop) większość edytorów obrazów umożliwia również zmianę głębi/trybu kolorów obrazu.

Przytnij zdjęcie

Innym prostym sposobem na zmniejszenie rozmiaru obrazu jest po prostu jego przycięcie! Wszystko, co jest wycięte, zostanie usunięte z obrazu. Bez względu na to, jaki masz obraz, możesz go przynajmniej trochę przyciąć, co z pewnością pomoże zmniejszyć rozmiar.

I zauważ, że przycinanie nie musi być tylko typowym, w którym wycinasz rzeczy od góry/dołu lub lewej/prawej strony. SnagIt Editor , jeden z moich ulubionych, ma narzędzie do wycinania, które pozwala wycinać części obrazów ze środka obrazu w poziomie lub w pionie. Przydaje się to częściej, niż mogłoby się wydawać. Oto przykład, w którym muszę dołączyć zrzut ekranu menu Start podczas wpisywania polecenia.

Powyższy rozmiar pliku miał pierwotnie 22 KB. Zamiast tego wyciąłem środkową część, której nie potrzebowałem, jak pokazano poniżej.

Nowy rozmiar pliku to zaledwie 9 KB! Wszystko to bez jakiejkolwiek kompresji lub zmiany formatu pliku. Po skompresowaniu zmniejszyłem go do zaledwie 4,4 KB. Dlatego przycinanie jest ważnym sposobem na zmniejszenie rozmiaru obrazu.

Mamy nadzieję, że zmniejszyłeś rozmiar swojego obrazu i dowiedziałeś się trochę o tym, jak działają obrazy cyfrowe! Jeśli masz jakieś pytania, śmiało możesz je komentować. Cieszyć się!

How to Reduce the Size on an Image File

Рreviously, I wrote an article on how to reduсe thе sizе of an image file using the built-in email optiоn in Εxplorer or by using a desktop program called Image Resizer for Windows. Τhese are good optiоns, but there are several other ways to go about оptimizing an image. Also, a lot of websites will tell you to uѕe Paint, but I have found it’s not а 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

• Eksportuj, wyczyść i zwiększ rozmiar dzienników zdarzeń w systemie Windows

• Jak wyświetlić rozmiar skrzynek pocztowych użytkowników w programie Exchange 2007?

• Recenzja książki — przewodnik po systemie Windows 8 „Jak to zrobić”

• Instalowanie wtyczek GIMP: poradnik

• Jak pobrać instalator Google Chrome offline (autonomiczny)

• Jak skonfigurować strony wzorcowe w programie Adobe InDesign CC

• Użyj Netstat, aby zobaczyć porty nasłuchiwania i PID w systemie Windows

• Jak zaktualizować Raspberry Pi

• Jak włączyć uwierzytelnianie Steam Guard

• Jak naprawić AirDrop nie działa z iPhone'a na Maca?

• Jak latać dronem dla początkujących?

• Jak wykonać test obciążenia procesora

• Jak podłączyć SSH lub SFTP do Raspberry Pi?

• Utwórz aplikację Gmail na komputer, korzystając z tych 3 klientów poczty e-mail

• Jak wyłączyć klawisz Windows

• 7 technicznych wskazówek dotyczących optymalizacji SEO dla dowolnej witryny internetowej

• Jak stworzyć zespół w Microsoft Teams

• Jak zmienić kolor tła w Dokumentach Google

• Jak zeskanować wiele stron do jednego pliku PDF

• Jak otworzyć plik JAR w systemie Windows