@@adroitws1367 yes, It's not a 'file format name' (or... it depends on how you look at it actually 😅). After what I've learned, so are "raw files" just a term for all image files with uncompressed camera information. I think almost every leading camera manufacturer use their own RAW image format🤔
I've been using PNG's for my art for years. It was initially because of the alpha channel, but its other advantages have revealed themselves over those years.
With digital arts, you should definitely always use PNG unless you do stuff like add deliberate noise, chromatic aberration, etc. "photo" post processing effects. Problem with digital arts is that many artists seem to use twitter these days, so the art gets converted to JPG regardless, it also gets chroma subsampled so the color information is halved. So like said in the video, with specific platforms you still have to use JPG, Twitter did bow to photographers and stopped recompressing JPG uploads under 4096px.
@@marcopeterson805 Apple refused to support WebP for longest time so adaptation has been slow, but they do now, maybe because the commercial HEIF adaptation is still at 0%. Because it can be both lossless and lossy, it's confusing format to use and I believe it's locked to VP8 standards which with WebM have become obsolete. Not ideal format because of these. However many websites now use it because it is still much higher quality for lossy images, especially with high contrast material like text and logos, compared to JPG with always lower filesize and because most modern browsers now support it. After all, with popular websites, 50kb save on single image loaded by millions of users is suddenly hundred megabytes saved on single of hundreds of images.
If your working with icons/logos etc you're most likely using vector tools (illustrator and what not), in which case PNG isn't even the right move. Assuming the target platform supports it, formats like SVG would be better. That said if it doesn't then yes PNG is a great choice, and you might even get away with 8-bit colors if you don't have gradients.
@@benjib2691 I personally cannot stand it but that's just me. There are other alternatives like illustrator or affinity designer (which I use), all of them are perfectly capable of editing vector images. You could even edit them by hand if you wanted too, but that's another story
When deciding between svg and png, I do the png at 4 times the size and compare the file size between the two. Sometimes the svg file size will be bigger so I'll go with the png instead. - this is for Web use
SVG is a great format for web applications. I use them all the time. Just don't try and put too much detail into a single file, as you'll likely run into larger file sizes that present render blocking issues. At that point, you might as well use a raster format.
Your content was the only detailed step by step tutorial that got me out of the print mess I'd made. Thank you so much, and I hope that it helps others too :)
In a nutshell, from what I learned. JPEG: Really good for IRL photos, NO TRANSPARENCY, NO 16-Bit Channel for Banding PNG: Really good for Digital arts, YES TRANSPARENCY, YES 16 Bit Channel for Banding Thanks for your lesson!
The lossless quality of PNG is worth the larger file size, in my opinion. Lossless compression makes the files future proof since converting between two lossless formats is lossless, obviously, while converting between two lossy formats degrades the quality every conversion. I also prefer lossless audio for the same reason.
If you really want even smaller file for .PNG you can use PNGOUT by Ken Silverman. The pngout program do its job on deflate compression layer level, so the resulting output will be treated normally as any usual .png (s).
"converting between two lossless formats is lossless" That statement is not really true. You can still lose bits. Try it out: Get a hash from the original, convert it to another lossless format and convert it back and get another hash. Is the hash the same? However, the lossless JPEG XL has backwards compatiblity with JPEG so when you convert back from JPEG XL to a JPEG you should get the same JPEG.
You have both options available, so you don't need to choose. You can use both. That's why we all use both. Of course PNG is great but even a relatively small 4K res photo in PNG is impractical in todays internet speeds in most places of the world. JPG is absolutely incredible for photography, so as everyone already knows: each has its use, and you can use both.
I am a veteran graphic designer and have watched or read many various tutorials and I must say that you and your RUclips channel are simply the best. I thank you and compliment you on how gifted you are as a teacher and tutor for us all. Excellent!
Extremely informative! I've been in graphic design at a sign company in the US for 7 years, and I wish every single person I work with outside of the graphics department could have a basic understanding of this and related subjects. You did mention that print and digital applications are very different, but often we will receive files that aren't even close to being usable for either and are expected to just "make it work." I'm not bitter.
@@nooneinpart WebP lossless IS a lot better then PNG. It's basically always a smaller size then PNG with the same quality (obviously). The only type of image I've found where PNG is smaller is screenshots of website. For art especially webp basically gets a free win and JPEG XL lossless is ever better
Well JPEG XL (jxl) has higher bit depth (8,16,32, int/float) layer support, transparency, animation support (thank god, bye GIF) and of course better lossless compression than PNG and better (more efficient) lossy compression than jpg and much more, so lets hope that it gets the adoption it deserves when the standard is published :)
@@mar2ck_ Yes I'd like to think that using AVIF for photo images is a good idea due to the higher compression with good appeal, but a lot of content like screenshot or webcontent with sharp text and such would be better compressed by JPEG XL due to some features it has and its focus of fidelity instead of appeal. Its also better as a general exchange and storage format for production by far since AVIF has a rather limiting feature set: e.g. 12 bit maximum per channel and not in RGB space iirc.
@@micky2be XS is not releavant. Can't even find a comparision between XS and XL and there is no software for it in repos. XL is the new standard, period. Most applications that can be used to edit or display images can already display it and yes I can safely claim this cause on GNU/Linux the support can be baked into the GUI toolkits that are used by almost any application that has a GUI. GTK ships with support per default and Qt has a plugin.
I never know the main different between PNG and JPEG until I watch this Videos. It really helpful for me. I love how you describe both PNG or JPEG and talk about the different simply and very easy to undestand. And not only this video, all your contents are very helpful anyway. Hope you always make this kind of photoshop tutorial, etc.
@Goody Morillas They compress the images further. So if you start with an compressed image, it'll look worse and worse as image data is lost with each compression
Such a perfect video. Aside from no stuttering and not a single brake where he "needs to think" or "needs to find a button", just overall smooth explanation. And I love your video background, so thoughtful on the colours, orange candles on the blue side, etc... Absolutely love this video and will recommend it!
I always used "save as" to finish my photoshop jobs. I also thought that png was only for backgroundless images and you just taught me a lot. Even though I have to use subtitling to understand since I don't speak English 😞
@@toku5829 really? Sorry for the question, what is the difference with American English? I am learning English at my own pace, so I may not yet be aware of other types of English than American and British English.
@@SiempreAndres India also has a separate "version" of English. The accent as well as, some of the words are different in Indian and British/American English.
for my illustrations, i usually mostly export in jpeg. they are meant to be seen digitally first and foremost and bc of their high resolution, they cause artifacts as PNG when uploaded to twitter (where i mostly post art). I always save a PNG version as well tho for the best quality locally
When in doubt use tiff. Better than PNG in every way, compression can be adjusted as per your preference, much better memory usage than png on most 3d and rendering software, Use LZW or Zip compression with RLE or Zip if you have layers on or discard if you don't want layers. Also can save ICC profiles so no colour change from one software to another. Oh also, you can save layers in the image so photoshop can open it with layers by default or discard all layers and save flat image.
Internally, TIFF is just storing PNG and JPEGs with metadata, so this isn't an entirely apple to oranges comparison. Also, TIFF's ability to hold different formats is a double-edged sword I ended up learning the hard way when I tried to use a TIFF file that contained a format that an application didn't know how to handle. Just because something accepts a TIFF, doesn't mean it accepts the image formats inside it.
As others point out, TIFF is a *wrapper* and the actual image encoding could be any of a great many things. Your ability to share images using TIFF is consequently somewhat uncertain whether the person you send it to, or even yourself at a future date, is going to work. PNG also has some subformats but not nearly as many. JPEG also has subformats but it seems everyone uses JFIF.
Use jpeg for photos, png for computer drawings, gif for animations, and svg for things that need to work at very different sizes without being re-rendered.
Everything about these tutorials is amazing… no hype, no bs.. “boring but important”…. “Pause to learn more”… it’s all of what we want and none of what we don’t….. getting these for free feels illegal sometimes…
As far as I know, JPEG is lossy vs PNG is lossless.. It's difficult to compare those, it's the same as FLAC vs MP3. The main point of JPEG nowadays is to send pictures efficiently on social media. Saving up network bandwidth and data usage for people on limited data access. If you seriously need 100% quality, then go with either lossless PNG, or non-compressed at all BMP. For vector graphics, I don't know much that since I don't use it personally. But I would just stick with SVG.
When it comes to bit mode I've always heard that it's best to work in the highest quality (16-bit or 32-bit if you can) and largest color space possible and "take your losses" (take losses from going from say 16-bit to 8-bit or ProPhoto RGB to sRGB) when you are exporting. But work in the highest bit range and color space possible for the most flexibility (of course not all photoshop tools will work in 16-bit mode, some only work in 8-bit mode). But this example of PNG vs JPEG does make sense, as PNG is 16-bit by default and JPEG is only 8-bit. However, I suspect that when the JPEG-XL spec is finalized and more widely used, this will change things or even the score since JPEG XL I believe will be 16-bit.
You can see on the screenshots that he is using 16 bit PNG and comparing it to 8 bit JPEG. If you use 8 bit PNG you'll get nearly the same banding problem.
From wikipedia: ,,The file format (bitstream) was frozen on 25 December 2020 and formally standardized on 13 October 2021. Any file compliant to this standard is guaranteed to be decodable by all future releases." Btw. the standard was formally approved in december 2021. And when you go to the twitter account of Jon you can see they are working on ,,the 2nd edition of the spec, which will be just editorial improvements and clarifications, and some very minor technical details - nothing bitstream-breaking."
I've been saving my art in PNG for years due to it being higher quality than JPEGs. It's great for making a sprite sheet because of said higher quality and alpha channel.
I've seen some sprite sheets saved in JPG, and that just ruins the whole sheet, making it basically useless. It's a shame that so many people default to JPG so often without thinking.
Puppy: PDF/SVG vector with transparency: 3kb (Infinitely scalable) HEIC with transparency: 288kb JPEG: 823kb PNG with transparency: 917kb JP2 with transparency 1.3Mb Affinity Photo : 1.7mb Photoshop: 3.8Mb The 24.8Mb Photoshop gradient converts to a 9kb .heic file with no banding. (incorrect on recheck- it has banding, just subtle) The 59Mb Photoshop paperclip photo converts to a 3Mb .heic file with no visible loss of quality.
THANK YOU! The demonstration drives home what these differences actually mean. Been hearing other photographers say for a long time we use jpeg because it "handles color better", but my background in programming and graphics told me that obviously couldn't be true! But the computer nerd crowd I was in stopped thinking about image file size a decade ago and work almost exclusively with overkill machines, fast internet, and lots of disk space. I can see how someone who doesn't live in that world might be conscientious of file size and come to think of jpegs as being better for color!
JPEG is just like MP3 these days: Vastly surpassed by newer standards, but so ubiquitous that it's impossible to kill. (Even if you need smaller sizes and therefore a lossy format, JPEG is no longer the format to use. Thankfully WebP seems to be making at least some headway these days.)
THe crazy thing is that JPEG 2000 was meant to replace Jpeg 20 years ago and it just barely begin to be used. I hope it wont be that slow to get proper Webp support.
Bad 'ole geocities days with lime buttons (on busy pink backgrounds) were compressed so high so couldn't easily read what they said. People didn't know when to use gif over jpg either. lol
I am not your ordinary spectator. but every time i accidentally find your video i am very impressed with your video. Great picture quality, great studio. Confidence and enthusiasm in speaking. And high skil of spreathing knowledge.
@@humandroid53 There are no benefits of using png when it comes to print. Everything in this video where png was better should have been a vector format for print. Png stands its ground for digital applications. Hence the name, Portable Network Graphic.
you explain and demonstrate everything exhaustively and efficiently. you are extremely respectful of your viewers time and well spoken, you would make a great professor in a digital media class!
Great content, i love it and clear me a lot of questions, but i still have one: If you always want the best quality of your photos, you still use png in 16 bit? because it's only matter jpeg if you want less space
Of course! But again, if you're just looking for storage, there are other formats too, like TIFF. Because TIFF (along with PSD) support layers! But for social media, it depends. Most mainstream platforms convert to JPEG after upload, so it makes sense that you do the compression instead of letting the platform do it for you.
If you're willing to print photographs with a serious lab they will ask you for tiff files. Jpeg is compressed, it's better for digital. Also for offset print you'll "always" get better results with tiff than with jpeg. For the web of course the tiff is not even handled and you need small files.
@@strixcz You don't have the final final say when uploading to social sites, but it's still smart to do SOME prepping yourself compression-wise, it helps some!
@@martin2do "If you're willing to print photographs with a serious lab they will ask you for tiff files." And they'll want it in CMYK colorspace, not sRGB.
2:58 this works well on simple small drawings that's why webpages uses png as default but there is a reason jpg is standard for larger, more complex images. I just tried to save a photo taken in jpeg reulting in 2.29MB for default 84 quality or 4.95MB for highest 100 quality and png rsulting in 16.5MB with default (6) compression settings. So PNG is more than 3x bigger in file size and it takes longer to decompress (switch between images). But I actually found something new. I always thought that format like .tif is looseless but .png same a jpeg is loosy. Learned something new today.
Let me share some other fact relating to that. To have smooth gradient of 16-bit to 8-bit jpg, you could trick Photoshop by make gradient in 16-bit jpg and change mode 8-bit at final step before save, export, export as. You still have very smooth gradient without any banding issue. For above trick you still have smooth gradient from both PNG, JPG. But the PNG was double the file size.
@@clintshidwood4511 Although it's true that there is no such thing as 16-bit JPG, the technique Phong is referring to still has merit. The perceptibility of banding and other artefacts in an image, becoming compounded with each process made to an image, if that image is edited in 8-bit per channel. To minimise this compounding of artefacts and prevent them from being visible in the final image, editing in 16-bit is worthwhile, as the compounding error per image process is minimised and generally not perceptible. I would not bother switching to 8-bit as the final step though, since the export essentially does that for you during the creation of the final saved image. When I create gradients in 16-bit and then export that image, I don't see any banding at all in both PNG or JPG formats. None. JPG artefacts are still present, if you go looking for them and of course their severity is based on the amount of JPG compression you choose at export.
No idea who you are, or why RUclips recommend me this but man am I glad it did. This was a really well done video, and it explained something that I never really understood fully. Thanks!
Great tech tutorial, i only occasionally use png and usually use jpeg at 100%. Banding is definitely an issue with gradients. Its good to see when on is better than the other.
16 bit PNG has essentially zero banding, 8 bit JPEG has severe banding IF you perform the demonstration. It is not expected that anyone will expand the color space of JPEG to deliberately cause banding.
Great Topic! PNG is also useful when anyone wants to place their logo on MS Word Document or PowerPoint, but CMYK doesn't support PNG, therefore I convert my PNGs to TIFF on the Artwork sent for printing.
I'm blown away by how comfortable this video feels... Your voice, your smile, your editing, the flow of information, this is great work ! I'll come back !
The difference is the jpeg is 287 kb and the png is 1263 kb. This may not look like a huge difference but it scales exponentially when you begin to create more complex imaging.
I always use the free small program Pngyu which does the exact same. It's perfect. However TinyPNG has the option to integrate it into your website which is interesting for big websites who need smaller files but still good looking.
Dude, this is the first video of yours that I've seen, but whether it's majestic makeup, or a killer skin care routine, your face is fuccin' majestic. You are one handsome fella.
Although I know that Photoshop does not officially support it, since 2017 I have installed Google's WEBP plug-in with each annual update because Photoshop won't open images in that format otherwise. I believe that Google issued WEBP in 2013 and as time has gone on, I am finding that more and more images that I download from the Web, particularly from news sites, may be labelled as JPGs in the address bar but when downloaded to my computer are actually WEBP. I can see no difference between the two beyond file size. JPEGs are 2 to 3 times the file size of the same image with the same dimensions in WEBP despite both being 8 bit at 72 ppi. I would really like a full rundown on WEBP and whether it is something that is more than just a format that came about for space-saving reasons on cloud storage.
Job well done! I’ve been doing digital illustration forever and never realized the difference when it comes to 8 vs 16 bit and all that goes with that! Thank you!
One of the biggest problems I've found with using PNG's for final outputs (in this case renders), is file size. When I'm sending a pack of still renders to a client, over email they easily exceed the 30mb limit. Other than that PNG is mighty!!
I'm almost 40 and grew up with dial up internet so I have respect for the JPEG file format. It was necessary for the time, but with higher bandwidth internet it is deprecated and that's to be expected.
Damn, man! Saw your old videos and now... You're growing so fast! You pronunciation and accent much better, voice work to great and really love your mic, you sounds amazing with u87. Such a work... Good luck!
Yeah but while PNG might be great for web use or other uses requiring RGB it's not so good for print use requiring CMYK since PNG's colour mode is RGB and print requires CMYK outputting generally.
There are other formats for that though, not to mention any PC these days can easily convert RGB > CMYK anyway. Not really a downside to PNG so long as you don't use it as the output format. I wouldn't use JPEG for printing either though...
Depends of the JPEG export settings. Not sure how they are in the Photoshop, but in GIMP, when exporting a JPEG with 100% quality and as progressive (with DCT method set as floating point) there's no visible difference in quality and you still get a smaller image. The fact that you had to use color correction and zoom incredibly close that you can count the pixels to even see the difference should tell you something.
In a reduced colour pallete with highly graphic simple colour illustrations PNG wins out, its a good lesson to those who imagine jpeg is always better file size wise.
If you had committed the gradients to a layer and then converted to 8-bit, there would be some dithering added to make the bands fuzzy. This doesn't happen if the special layers are rendered at 8 bits. However, JPEG isn't accurate down to the lower bit, and would wipe most of the dithering. With a real photograph there would be very little compression gain at 16-bit PNG. Might as well save it as uncompressed TIFF.
Great info and very well made vid. PS: your pronunciation of exaggerated was correct and your English is so clear that RUclips auto closed captions was perfect
If your going with PNG there is still great compression tools online to compress the size of those. For simple drawings like that dog I always go with Vector art. Eps or SVG because there is no loss in quality and you can scale that to billboard size and it is still sharp.
Small correction. PNG isn't entirely lossless. It is only as lossless as your bits per channel. If you're working on 16 bits and save a 16 bits PNG it is lossless. But if you save a 8 bit PNG, you will lose data. Same with 24 and 32 bits. Plus it doesnt properly support HDR, so you'd have to compress your HDR to 0-1 range. I'd say go with jpeg for photo-like images for web viewing and png for non-HDR, web viewing of vector art, and possibly delivering 16 or 24 bit final art work. Otherwise, use EXR, tiff, or a more relevant format for product delivery images.
I just wish there was a JPEG 10/12/16 bit option. Because PNG files are awesome, but the file size of big resolution files are way too big for web usage.
Didn't watch the video but seeing as my version of Photoshop crashes when I try to export a JPEG but PNGs are fine, you've convinced me to make the change.
A small note : For web, the formats that are currently recommended are neither jpeg nor png. For raster graphics, it's WebP, a lossless format that is smaller than png. For vector graphics, it's SVG. The JPEG vs PNG debate was something that existed on the web 10 years ago. Not today.
Bro, I don't use photoshop. I will never ever run into a situation where this video will help me! Did I watch the whole thing? Yes. Did the handsome, well spoken man keep me captivated the WHOLE time? Yes!
It has always amazed me that jpeg is still so commonly used and that something like jpeg2000 never fully replaced it a long time ago. Will jpeg live on for another 20 years? I really hope not.
"I really hope not." Strange that you care about MY choices for image storage and display format. The image formats I use are intended to be *eternal* never mind the next 20 years. Public specification of TIFF and JPEG (and PNG) help ensure that far in the future it will be possible to view these images.
Because I'm self-taught, I've been struggling with my Photoshop skills for a few years now. I know enough to do what I need and usually just look up anything unusual I need to do for my pictures. This video appeared in my suggestions and quickly answered a bunch of questions I've always wondered about! Thanks for posting and making it all very easy to understand. I'm definitely planning to check out some more from your channel!
is there much of a different exporting vs saving as? i have reverted to just exporting as png since it's quicker and my clients dont need anything more than an emailable file
Precisely explained in a relevantly easy to understand way. Love your videos brother. Simply Brilliant. You are single handedly destroying the formidable learning curve for all of us, one tutorial at a time.
![How are Images Compressed? [46MB ↘↘ 4.07MB] JPEG In Depth](http://i.ytimg.com/vi/Kv1Hiv3ox8I/mqdefault.jpg)
I never really thought about the differences except for transparency, but these formats are actually quite different
yeah if you can use raw or png in your phone you'll notice the difference
@@zer0b0t wtf is raw?
@@adroitws1367 u aint ever heard of a raw file??? its just a file that contains data that hasnt been compressed, encrypted or processed in any way.
@@jackmcardlec like photograph raw? but that isn't a file format name right?
@@adroitws1367 yes, It's not a 'file format name' (or... it depends on how you look at it actually 😅). After what I've learned, so are "raw files" just a term for all image files with uncompressed camera information. I think almost every leading camera manufacturer use their own RAW image format🤔
png: flat art, vectors, transparency
jpeg: real photos, exif data, compression
I've been using PNG's for my art for years. It was initially because of the alpha channel, but its other advantages have revealed themselves over those years.
For example: which ones?
With digital arts, you should definitely always use PNG unless you do stuff like add deliberate noise, chromatic aberration, etc. "photo" post processing effects.
Problem with digital arts is that many artists seem to use twitter these days, so the art gets converted to JPG regardless, it also gets chroma subsampled so the color information is halved. So like said in the video, with specific platforms you still have to use JPG, Twitter did bow to photographers and stopped recompressing JPG uploads under 4096px.
Opinions on webp?
@@marcopeterson805 Apple refused to support WebP for longest time so adaptation has been slow, but they do now, maybe because the commercial HEIF adaptation is still at 0%.
Because it can be both lossless and lossy, it's confusing format to use and I believe it's locked to VP8 standards which with WebM have become obsolete. Not ideal format because of these.
However many websites now use it because it is still much higher quality for lossy images, especially with high contrast material like text and logos, compared to JPG with always lower filesize and because most modern browsers now support it. After all, with popular websites, 50kb save on single image loaded by millions of users is suddenly hundred megabytes saved on single of hundreds of images.
JPEG XL sounds promising
If your working with icons/logos etc you're most likely using vector tools (illustrator and what not), in which case PNG isn't even the right move. Assuming the target platform supports it, formats like SVG would be better. That said if it doesn't then yes PNG is a great choice, and you might even get away with 8-bit colors if you don't have gradients.
Inkscape works great for vectorial images, and is open source. I've used it in the past for doing diagrams
@@benjib2691 I personally cannot stand it but that's just me. There are other alternatives like illustrator or affinity designer (which I use), all of them are perfectly capable of editing vector images. You could even edit them by hand if you wanted too, but that's another story
When deciding between svg and png, I do the png at 4 times the size and compare the file size between the two. Sometimes the svg file size will be bigger so I'll go with the png instead. - this is for Web use
*you're
SVG is a great format for web applications. I use them all the time. Just don't try and put too much detail into a single file, as you'll likely run into larger file sizes that present render blocking issues. At that point, you might as well use a raster format.
Hey Unmesh...Thanks so much for the mention...very kind of you 👍
Your content was the only detailed step by step tutorial that got me out of the print mess I'd made. Thank you so much, and I hope that it helps others too :)
Ye
@@PiXimperfect JPEG JPEG JPEG JPEG is the best
@@Villager6883 give some evidence
@@Yeettoinfinity Cause it’s more reliable.
In a nutshell, from what I learned.
JPEG: Really good for IRL photos, NO TRANSPARENCY, NO 16-Bit Channel for Banding
PNG: Really good for Digital arts, YES TRANSPARENCY, YES 16 Bit Channel for Banding
Thanks for your lesson!
Never stop doing what you do. I can’t tell you how helpful your channel has been in answering questions like this.
Would be much better if the answer was well informed and useful.
The lossless quality of PNG is worth the larger file size, in my opinion. Lossless compression makes the files future proof since converting between two lossless formats is lossless, obviously, while converting between two lossy formats degrades the quality every conversion. I also prefer lossless audio for the same reason.
If you really want even smaller file for .PNG you can use PNGOUT by Ken Silverman.
The pngout program do its job on deflate compression layer level, so the resulting output will be treated normally as any usual .png (s).
"converting between two lossless formats is lossless"
That statement is not really true. You can still lose bits. Try it out: Get a hash from the original, convert it to another lossless format and convert it back and get another hash. Is the hash the same? However, the lossless JPEG XL has backwards compatiblity with JPEG so when you convert back from JPEG XL to a JPEG you should get the same JPEG.
Even at the highest compression setting, it's still lossless. It just takes more time to encode.
You have both options available, so you don't need to choose. You can use both. That's why we all use both. Of course PNG is great but even a relatively small 4K res photo in PNG is impractical in todays internet speeds in most places of the world. JPG is absolutely incredible for photography, so as everyone already knows: each has its use, and you can use both.
that's not how lossless works.
I am a veteran graphic designer and have watched or read many various tutorials and I must say that you and your RUclips channel are simply the best. I thank you and compliment you on how gifted you are as a teacher and tutor for us all. Excellent!
How hard is it to start job as a new graphic designer
Placing PNG files in to Photoshop is excellent? LMAO
Extremely informative! I've been in graphic design at a sign company in the US for 7 years, and I wish every single person I work with outside of the graphics department could have a basic understanding of this and related subjects. You did mention that print and digital applications are very different, but often we will receive files that aren't even close to being usable for either and are expected to just "make it work."
I'm not bitter.
true...its like u have computer and just press some dam keys and out comes perfect image...dont act like you have to sweat it out! :D
Even since 2012 or 2013, I knew and found out that PNGs hold TONS of more quality than JPEGs. That's why I ALWAYS export my art into PNGs.
Same here, but I recently switched to WebP, same quality as PNG with a much lighter file size, sometimes half of PNG.
@@lahcenebelbachir7929 Why not avif which surpasses webp?
@@xorbe2 AVIF is only better for complex, photographic images, WEBP is better for simple illustrations.
@@nooneinpart WebP lossless IS a lot better then PNG. It's basically always a smaller size then PNG with the same quality (obviously). The only type of image I've found where PNG is smaller is screenshots of website. For art especially webp basically gets a free win and JPEG XL lossless is ever better
You might want to consider using OpenEXR. It supports high dynamic range and is lossless.
Well JPEG XL (jxl) has higher bit depth (8,16,32, int/float) layer support, transparency, animation support (thank god, bye GIF) and of course better lossless compression than PNG and better (more efficient) lossy compression than jpg and much more, so lets hope that it gets the adoption it deserves when the standard is published :)
JPEG XL by far the best at lossless compression but I've found that for lossy compression AVIF gives better results with less noise artifacts
There is also the JPEG XS, for ultimate lossless compression. But not sure how it plays along the JPEG XL.
@@mar2ck_ Yes I'd like to think that using AVIF for photo images is a good idea due to the higher compression with good appeal, but a lot of content like screenshot or webcontent with sharp text and such would be better compressed by JPEG XL due to some features it has and its focus of fidelity instead of appeal. Its also better as a general exchange and storage format for production by far since AVIF has a rather limiting feature set: e.g. 12 bit maximum per channel and not in RGB space iirc.
Using the correct tool for the job does imply having tools to choose from in the first place
@@micky2be XS is not releavant. Can't even find a comparision between XS and XL and there is no software for it in repos. XL is the new standard, period. Most applications that can be used to edit or display images can already display it and yes I can safely claim this cause on GNU/Linux the support can be baked into the GUI toolkits that are used by almost any application that has a GUI. GTK ships with support per default and Qt has a plugin.
I never know the main different between PNG and JPEG until I watch this Videos. It really helpful for me. I love how you describe both PNG or JPEG and talk about the different simply and very easy to undestand. And not only this video, all your contents are very helpful anyway. Hope you always make this kind of photoshop tutorial, etc.
You are an absolute legend bro ❤️
Never thought I’d see you here :0
Hope you’re having a shit one 😼
He's a literal robot lol
tf is happening here
@@JohnPaulBuce wdym?
@@de_g0od just cause im aussie doesn't mean im a robot :(
Fantastic video! I've been posting PNG files to social media for years now and always get compliments on how well they hold up. :)
Thank you for watching! Hope to see you again soon :)
@Goody Morillas They compress the images further. So if you start with an compressed image, it'll look worse and worse as image data is lost with each compression
But the problem is no one will ever tell u their secrets 😂
Such a perfect video. Aside from no stuttering and not a single brake where he "needs to think" or "needs to find a button", just overall smooth explanation. And I love your video background, so thoughtful on the colours, orange candles on the blue side, etc... Absolutely love this video and will recommend it!
I always used "save as" to finish my photoshop jobs. I also thought that png was only for backgroundless images and you just taught me a lot. Even though I have to use subtitling to understand since I don't speak English 😞
Me too, the good thing is that his English is easy to understand
Indians English is easy to understand than Americans 😂
@@toku5829 really? Sorry for the question, what is the difference with American English?
I am learning English at my own pace, so I may not yet be aware of other types of English than American and British English.
Postscript: ñ
@@SiempreAndres India also has a separate "version" of English. The accent as well as, some of the words are different in Indian and British/American English.
for my illustrations, i usually mostly export in jpeg. they are meant to be seen digitally first and foremost and bc of their high resolution, they cause artifacts as PNG when uploaded to twitter (where i mostly post art). I always save a PNG version as well tho for the best quality locally
When in doubt use tiff. Better than PNG in every way, compression can be adjusted as per your preference, much better memory usage than png on most 3d and rendering software, Use LZW or Zip compression with RLE or Zip if you have layers on or discard if you don't want layers. Also can save ICC profiles so no colour change from one software to another.
Oh also, you can save layers in the image so photoshop can open it with layers by default or discard all layers and save flat image.
Actually, I always use .tif when saving EO satellite images I work with. I weirdly associate .png with photographs. I don't know why.
TIFF is great for saving arbitrary metadata as well. Also has the most data types (uint8, 16, 32, float, etc). So many options.
Internally, TIFF is just storing PNG and JPEGs with metadata, so this isn't an entirely apple to oranges comparison. Also, TIFF's ability to hold different formats is a double-edged sword I ended up learning the hard way when I tried to use a TIFF file that contained a format that an application didn't know how to handle. Just because something accepts a TIFF, doesn't mean it accepts the image formats inside it.
@@hehefunnysharkgoa9515 very true about internal storing in jpg and png, curious which software was it
As others point out, TIFF is a *wrapper* and the actual image encoding could be any of a great many things. Your ability to share images using TIFF is consequently somewhat uncertain whether the person you send it to, or even yourself at a future date, is going to work. PNG also has some subformats but not nearly as many. JPEG also has subformats but it seems everyone uses JFIF.
Use jpeg for photos, png for computer drawings, gif for animations, and svg for things that need to work at very different sizes without being re-rendered.
Everything about these tutorials is amazing… no hype, no bs.. “boring but important”…. “Pause to learn more”… it’s all of what we want and none of what we don’t….. getting these for free feels illegal sometimes…
Photoshop syndrome lol
As far as I know, JPEG is lossy vs PNG is lossless.. It's difficult to compare those, it's the same as FLAC vs MP3. The main point of JPEG nowadays is to send pictures efficiently on social media. Saving up network bandwidth and data usage for people on limited data access. If you seriously need 100% quality, then go with either lossless PNG, or non-compressed at all BMP. For vector graphics, I don't know much that since I don't use it personally. But I would just stick with SVG.
Exactly, it's a meaningless comparison, and for vectors you should use a vector format.
When it comes to bit mode I've always heard that it's best to work in the highest quality (16-bit or 32-bit if you can) and largest color space possible and "take your losses" (take losses from going from say 16-bit to 8-bit or ProPhoto RGB to sRGB) when you are exporting. But work in the highest bit range and color space possible for the most flexibility (of course not all photoshop tools will work in 16-bit mode, some only work in 8-bit mode). But this example of PNG vs JPEG does make sense, as PNG is 16-bit by default and JPEG is only 8-bit. However, I suspect that when the JPEG-XL spec is finalized and more widely used, this will change things or even the score since JPEG XL I believe will be 16-bit.
You can see on the screenshots that he is using 16 bit PNG and comparing it to 8 bit JPEG. If you use 8 bit PNG you'll get nearly the same banding problem.
PNG's are 16 bit by default in PS? That's weird AF. I'm playing my cards on lossless 16bpp WebP though.
From wikipedia: ,,The file format (bitstream) was frozen on 25 December 2020 and formally standardized on 13 October 2021. Any file compliant to this standard is guaranteed to be decodable by all future releases."
Btw. the standard was formally approved in december 2021. And when you go to the twitter account of Jon you can see they are working on ,,the 2nd edition of the spec, which will be just editorial improvements and clarifications, and some very minor technical details - nothing bitstream-breaking."
JPEG is design to compress image for sharing purpose, not graphist work.
@@Quarassou Nope, it just happens to be good at that.
I've been saving my art in PNG for years due to it being higher quality than JPEGs. It's great for making a sprite sheet because of said higher quality and alpha channel.
I've seen some sprite sheets saved in JPG, and that just ruins the whole sheet, making it basically useless. It's a shame that so many people default to JPG so often without thinking.
@@Liggliluff Yeah. I guest most people don't understand the quality difference between JPEGs and PNGs.
Puppy:
PDF/SVG vector with transparency: 3kb (Infinitely scalable)
HEIC with transparency: 288kb
JPEG: 823kb
PNG with transparency: 917kb
JP2 with transparency 1.3Mb
Affinity Photo : 1.7mb
Photoshop: 3.8Mb
The 24.8Mb Photoshop gradient converts to a 9kb .heic file with no banding. (incorrect on recheck- it has banding, just subtle)
The 59Mb Photoshop paperclip photo converts to a 3Mb .heic file with no visible loss of quality.
THANK YOU! The demonstration drives home what these differences actually mean. Been hearing other photographers say for a long time we use jpeg because it "handles color better", but my background in programming and graphics told me that obviously couldn't be true! But the computer nerd crowd I was in stopped thinking about image file size a decade ago and work almost exclusively with overkill machines, fast internet, and lots of disk space. I can see how someone who doesn't live in that world might be conscientious of file size and come to think of jpegs as being better for color!
I typically use png by default, jpeg for saving space, webp wherever possible for web assets
Fun fact: The thumbnail of this video is a JPEG.
And the vid is encoded in MPEG (JPEG but for video)
It's a webp
JPEG is just like MP3 these days: Vastly surpassed by newer standards, but so ubiquitous that it's impossible to kill. (Even if you need smaller sizes and therefore a lossy format, JPEG is no longer the format to use. Thankfully WebP seems to be making at least some headway these days.)
THe crazy thing is that JPEG 2000 was meant to replace Jpeg 20 years ago and it just barely begin to be used. I hope it wont be that slow to get proper Webp support.
I think jpeg 2000 had weird licensing, that made it basically useless. The jpeg foundation released jpeg xl recently. That looks quite promising.
Bad 'ole geocities days with lime buttons (on busy pink backgrounds) were compressed so high so couldn't easily read what they said. People didn't know when to use gif over jpg either. lol
I think WEBP is a better replacement for PNG, AVIF should replace JPEG
@@mgord9518 No JPEG XL should replace JPEG.
I am not your ordinary spectator. but every time i accidentally find your video i am very impressed with your video. Great picture quality, great studio. Confidence and enthusiasm in speaking. And high skil of spreathing knowledge.
When I worked at a print shop, we had to go from PNG back to JPEG when proofing graphics before printing as the colors were often off.
@@humandroid53 There are no benefits of using png when it comes to print. Everything in this video where png was better should have been a vector format for print. Png stands its ground for digital applications. Hence the name, Portable Network Graphic.
png cannot be saved in cmyk color mode
Thank you. Yes. Exactly. ✅
@strickzcs Yes, 🙌🏻 Exactly! This video should BEGIN with this comment as a disclaimer! 🤦🏼♀️
If its for web and your concerned about file size, use WebP over either, if possible (line art or flat images for example) use svg.
I Never noticed the difference, thank you Unmesh for telling us all about it. your are a great creator
you explain and demonstrate everything exhaustively and efficiently. you are extremely respectful of your viewers time and well spoken, you would make a great professor in a digital media class!
I was always confused in this topic, I used to have a lot of problem, Really it's amazing content and you solved my problem, Thank you so much.
I have no idea what you are talking about, but the video editing is so nice I'm still enjoying it.
Great content, i love it and clear me a lot of questions, but i still have one: If you always want the best quality of your photos, you still use png in 16 bit? because it's only matter jpeg if you want less space
Of course! But again, if you're just looking for storage, there are other formats too, like TIFF. Because TIFF (along with PSD) support layers! But for social media, it depends. Most mainstream platforms convert to JPEG after upload, so it makes sense that you do the compression instead of letting the platform do it for you.
If you're willing to print photographs with a serious lab they will ask you for tiff files. Jpeg is compressed, it's better for digital.
Also for offset print you'll "always" get better results with tiff than with jpeg.
For the web of course the tiff is not even handled and you need small files.
@@strixcz You don't have the final final say when uploading to social sites, but it's still smart to do SOME prepping yourself compression-wise, it helps some!
@@martin2do "If you're willing to print photographs with a serious lab they will ask you for tiff files."
And they'll want it in CMYK colorspace, not sRGB.
@@thomasmaughan4798 depends on the machinery some photo gear use rgb or lab. Offset press yep cmyk and/or direct tones
2:58 this works well on simple small drawings that's why webpages uses png as default but there is a reason jpg is standard for larger, more complex images. I just tried to save a photo taken in jpeg reulting in 2.29MB for default 84 quality or 4.95MB for highest 100 quality and png rsulting in 16.5MB with default (6) compression settings. So PNG is more than 3x bigger in file size and it takes longer to decompress (switch between images).
But I actually found something new. I always thought that format like .tif is looseless but .png same a jpeg is loosy. Learned something new today.
Really interesting! I don't know much about photoshop and was wondering why sometimes there was banding now everything is clear. Good explanation.
I just recommended this video to my friend who wanted to start learning texturing for 3D models. He now got a quite good understanding about it :)
Let me share some other fact relating to that. To have smooth gradient of 16-bit to 8-bit jpg, you could trick Photoshop by make gradient in 16-bit jpg and change mode 8-bit at final step before save, export, export as. You still have very smooth gradient without any banding issue.
For above trick you still have smooth gradient from both PNG, JPG. But the PNG was double the file size.
are you for real?? thats not how it works, son
@@clintshidwood4511 Although it's true that there is no such thing as 16-bit JPG, the technique Phong is referring to still has merit.
The perceptibility of banding and other artefacts in an image, becoming compounded with each process made to an image, if that image is edited in 8-bit per channel. To minimise this compounding of artefacts and prevent them from being visible in the final image, editing in 16-bit is worthwhile, as the compounding error per image process is minimised and generally not perceptible.
I would not bother switching to 8-bit as the final step though, since the export essentially does that for you during the creation of the final saved image.
When I create gradients in 16-bit and then export that image, I don't see any banding at all in both PNG or JPG formats. None.
JPG artefacts are still present, if you go looking for them and of course their severity is based on the amount of JPG compression you choose at export.
No idea who you are, or why RUclips recommend me this but man am I glad it did. This was a really well done video, and it explained something that I never really understood fully. Thanks!
Great tech tutorial, i only occasionally use png and usually use jpeg at 100%. Banding is definitely an issue with gradients. Its good to see when on is better than the other.
16 bit PNG has essentially zero banding, 8 bit JPEG has severe banding IF you perform the demonstration. It is not expected that anyone will expand the color space of JPEG to deliberately cause banding.
Thank you so much for the 'not for print' disclaimer. One of my top problems is receiving PNG files customers want printed.
Great Topic! PNG is also useful when anyone wants to place their logo on MS Word Document or PowerPoint, but CMYK doesn't support PNG, therefore I convert my PNGs to TIFF on the Artwork sent for printing.
I'm blown away by how comfortable this video feels... Your voice, your smile, your editing, the flow of information, this is great work ! I'll come back !
"You can see no banding here..." RUclips compression says Hi!
I've been a graphic designer for over 10 years, and i still love to watch your videos cause of your bubbly personality and some little tips!
The difference is the jpeg is 287 kb and the png is 1263 kb. This may not look like a huge difference but it scales exponentially when you begin to create more complex imaging.
I loved the way you just started the video without advertising, intro or what else. keep the good work, you gained my attention.
Sir provide your brand t shirts on Flipkart or amazon also.... Plzzz😥😥
Nice, simple, clean, good delivery and lovely soothing for the eyes setup. You are AWESOME!
Bruh, I was trying to focus on the pros & cons, but those eyebrows......I just can't
Not even the smile can save those
@@Blitzbogen Lol, nope.
As an Android Developer, I don't know that much about photoshop but u gave me an idea of both extensions very well.
I really love deep dives into the details we take for granted. I love using vector graphics in all my reports as it lowers the file size dramatically
The best Photoshop tutorial channel on RUclips!
A small tip: If you want even smaller png files, just go to the TinyPNG website and compress it. Sometimes it gets even ~75% smaller :)
I always use the free small program Pngyu which does the exact same. It's perfect. However TinyPNG has the option to integrate it into your website which is interesting for big websites who need smaller files but still good looking.
Oxipng has an option for Zopfli compression, which takes significantly longer but is able to milk out the last few % to make PNGs as small as possible
You could, but then that defeats the purpose of using a lossless format in the first place.
Dude, this is the first video of yours that I've seen, but whether it's majestic makeup, or a killer skin care routine, your face is fuccin' majestic. You are one handsome fella.
I'm sure BMP(bitmaps) might have a purpose too if you ever taiked about that. I've almost exclusively used PNGs for just about everything.
This subject is really not applicable to anything I do, or even all that interesting to me, but the host's charisma is undeniable. So I'm still here 😅
Although I know that Photoshop does not officially support it, since 2017 I have installed Google's WEBP plug-in with each annual update because Photoshop won't open images in that format otherwise. I believe that Google issued WEBP in 2013 and as time has gone on, I am finding that more and more images that I download from the Web, particularly from news sites, may be labelled as JPGs in the address bar but when downloaded to my computer are actually WEBP.
I can see no difference between the two beyond file size. JPEGs are 2 to 3 times the file size of the same image with the same dimensions in WEBP despite both being 8 bit at 72 ppi. I would really like a full rundown on WEBP and whether it is something that is more than just a format that came about for space-saving reasons on cloud storage.
I've always been using jpeg for my art and despised the results. Thank you soooo much for explaining!!
As always amazing info thanks and best regards from Mexico
Job well done! I’ve been doing digital illustration forever and never realized the difference when it comes to 8 vs 16 bit and all that goes with that! Thank you!
One of the biggest problems I've found with using PNG's for final outputs (in this case renders), is file size. When I'm sending a pack of still renders to a client, over email they easily exceed the 30mb limit. Other than that PNG is mighty!!
There is a reason, why ftp is still a thing ..
If you are using CMYK colorspace, use JPEG or TIFF. Same flow applies, just replace PNG with TIFF
I'm almost 40 and grew up with dial up internet so I have respect for the JPEG file format. It was necessary for the time, but with higher bandwidth internet it is deprecated and that's to be expected.
Damn, man! Saw your old videos and now... You're growing so fast! You pronunciation and accent much better, voice work to great and really love your mic, you sounds amazing with u87. Such a work... Good luck!
Yeah but while PNG might be great for web use or other uses requiring RGB it's not so good for print use requiring CMYK since PNG's colour mode is RGB and print requires CMYK outputting generally.
Thank you!! This affects me as an artist who makes prints.
He literally had a disclaimer in the video saying that he wasn't talking about printing
There are other formats for that though, not to mention any PC these days can easily convert RGB > CMYK anyway. Not really a downside to PNG so long as you don't use it as the output format. I wouldn't use JPEG for printing either though...
@@heroninja1125 probably .TIFF
Depends of the JPEG export settings. Not sure how they are in the Photoshop, but in GIMP, when exporting a JPEG with 100% quality and as progressive (with DCT method set as floating point) there's no visible difference in quality and you still get a smaller image. The fact that you had to use color correction and zoom incredibly close that you can count the pixels to even see the difference should tell you something.
In a reduced colour pallete with highly graphic simple colour illustrations PNG wins out, its a good lesson to those who imagine jpeg is always better file size wise.
this video is so high quality, a delight to watch , the info is clear and easy to understand, subscribed
I always use and have used png just because i thought it was cooler since it can do the transparency
Can also do animated PNGs APNG, but unfortunately is not a standard right now
Your room looks sick. You are like a photoshop guru. That's amazing. Lighting is perfect as well. I have to subscribe.
"JPEG or PNG?"
People who don't care: "Image is image!"
If you had committed the gradients to a layer and then converted to 8-bit, there would be some dithering added to make the bands fuzzy. This doesn't happen if the special layers are rendered at 8 bits. However, JPEG isn't accurate down to the lower bit, and would wipe most of the dithering.
With a real photograph there would be very little compression gain at 16-bit PNG. Might as well save it as uncompressed TIFF.
I’m e commerce Images editor I’m learning much and more from you
That's one of the most challenging tasks, especially editing in bulk! Salutes to you, and thanks so much for watching :)
😊
Great info and very well made vid.
PS: your pronunciation of exaggerated was correct and your English is so clear that RUclips auto closed captions was perfect
That was very helpful and interesting you are great at explaining these things
First video I watched of this channel. The way this guy communicates and presents himself is superb. Very enjoyable to watch.
If your going with PNG there is still great compression tools online to compress the size of those. For simple drawings like that dog I always go with Vector art. Eps or SVG because there is no loss in quality and you can scale that to billboard size and it is still sharp.
No bs, just information, quickly and clearly presented... 🧐
I'm totally Subscribing
DONT work in 16 bit
Work in 32 bit, It gives you room for the best images to be made
Small correction. PNG isn't entirely lossless. It is only as lossless as your bits per channel. If you're working on 16 bits and save a 16 bits PNG it is lossless. But if you save a 8 bit PNG, you will lose data. Same with 24 and 32 bits. Plus it doesnt properly support HDR, so you'd have to compress your HDR to 0-1 range.
I'd say go with jpeg for photo-like images for web viewing and png for non-HDR, web viewing of vector art, and possibly delivering 16 or 24 bit final art work. Otherwise, use EXR, tiff, or a more relevant format for product delivery images.
I just wish there was a JPEG 10/12/16 bit option. Because PNG files are awesome, but the file size of big resolution files are way too big for web usage.
Absolutely!
Optimize. Use tinypng
Use webp for web bro. Game changer
Timo, you want JPEG XL. Up to 24 bit integer or 32 bit float.
Clicked for the Title,
Stayed for the Charisma
Fantastic work
They have not implemented PNG tech into digital film. Not even sure if PNG is meant to be used in that fashion.
JPG is best for video compression.
Not true.
Didn't watch the video but seeing as my version of Photoshop crashes when I try to export a JPEG but PNGs are fine, you've convinced me to make the change.
A small note : For web, the formats that are currently recommended are neither jpeg nor png.
For raster graphics, it's WebP, a lossless format that is smaller than png.
For vector graphics, it's SVG.
The JPEG vs PNG debate was something that existed on the web 10 years ago. Not today.
finally someone with brain
Photoshop does not know this format
Bro, I don't use photoshop. I will never ever run into a situation where this video will help me!
Did I watch the whole thing? Yes.
Did the handsome, well spoken man keep me captivated the WHOLE time? Yes!
It has always amazed me that jpeg is still so commonly used and that something like jpeg2000 never fully replaced it a long time ago. Will jpeg live on for another 20 years? I really hope not.
"I really hope not."
Strange that you care about MY choices for image storage and display format. The image formats I use are intended to be *eternal* never mind the next 20 years. Public specification of TIFF and JPEG (and PNG) help ensure that far in the future it will be possible to view these images.
JPEG 100% needs to be used unless further replacement because it carries EXIF data while PNG does not
@@watchf Good point. TIFF also has EXIF.
@@watchf JPEG XL is backwards compatible and useable rn.
Because I'm self-taught, I've been struggling with my Photoshop skills for a few years now. I know enough to do what I need and usually just look up anything unusual I need to do for my pictures. This video appeared in my suggestions and quickly answered a bunch of questions I've always wondered about! Thanks for posting and making it all very easy to understand. I'm definitely planning to check out some more from your channel!
is there much of a different exporting vs saving as? i have reverted to just exporting as png since it's quicker and my clients dont need anything more than an emailable file
ruclips.net/video/ytsip27O72I/видео.html Here's a video explaining that.
Precisely explained in a relevantly easy to understand way. Love your videos brother. Simply Brilliant. You are single handedly destroying the formidable learning curve for all of us, one tutorial at a time.
I’m sorry but I’m not listening to a dude that’s got Johnny Bravo hair 🤡
I started using photoshop because of you. Thank you so much for all you do !
Bro, shave that off, no offence.
I don't even use photoshop nor do much image editing, but you're so wholesome I subscribed instantly.
This video didn’t leave my recommended page for this entire week so yeah I’m watching it, you won
Your teaching style is honestly one of the best, thanks a lot!!!!