Now moving to exporting for web or saving for now, let's say we need to upload our design or use it online, maybe for web design, or even to share it with other clients. So in that case, mainly we need to export a smaller file size. So we can do that by going to File, Export, then selecting export as, and Previously, we had safe forward option, which is now a legacy and you can still use that one. And Photoshop users who probably don't have Creative Cloud version 10 only use that options. That's why we're gonna be discussing that one as well. But let's first start with export as we have our images dimensions, and we have image size as well.
On the right side we have point settings, including format, you can export that one as PNG or JPEG. GIF, which is mainly used for animated files, or SVG files, which are vector files. And the most common format used for images online, is ubik. So gonna stick with that one. And also we have image quality, we can be using that one to get a smaller file size. But let's start first by reducing the dimensions for our point, as 2000 pixels will be too much, it's going to be used in web design, or even most online applications.
And also in web design. It depends on where you're going to be using that image, whether it's gonna be a wide fullscreen banner, or maybe a small image widget within your design, what's usually 2000 pixels are too much. So let's give that one to maybe 800 pixels. Or instead to maintain or proportions you can use the scale options. So let me get that one back to 2000 pixels among the 2000. I'm going to be scaling up one down maybe first, then go to 50% and we have with some height changes and also image size reduced.
However, we can go even below that. We can be sliding that one down, maybe for 40% or 78, something like that. Probably for a portrait image like this one can go for lower width as it's not going to be used as a banner for our website. So let's get it all the way to 30%. And now we have 440 kilobytes. Now we can be ultra sacrificing quality for our image, reducing quality to get a lower file size, can go even more aggressive, reducing even more quality to 30% or so.
Now, as you can see, we already got that image size all the way from 3.7 megabytes to 70 kilobytes and it still looks okay. And mice. And as you can see, we have to sacrifice quality sometimes to get a better performance for our web design, or even a slower file size that we can easily share via emails or upload to different websites. And also can be exporting more than a scale for our design or our image by clicking that plus in here. So we have that one was full size, which is our new image size, and also can be generating half of that one, or even maybe double of that size, if you would like to export more than a scale for the same image. So maybe you can go for two x.
And also make sure while you're creating your design from scratch, that it has RGB color profile. And if you didn't do that, don't worry guys, we have that one selected for us convert to sRGB for color space if you're using CMK for essence, and also if you'd like to add copyrights to your image or contact info you can be selecting that one. However, I'm not going to be doing that now and exporting or we can be creating a new folder create of them. Now also, let's go quickly and discover safer with option going to File, Export, save for web, we can be zooming out a bit. And this our optimized version, we can be checking original image or two up to compare between both of them. And we can see our original image size was 15 megabytes, maybe it was 50 megabytes, not 3.7 why he said that, I don't know.
And after optimization, it's gonna be 1.04 megabytes or almost one megabyte, and that's because we have a preset applied JPEG icon. You can be selecting from any of these presets, you can be selecting maybe a bit low if you want to move forward. An aggressive conversion of your image or medium for something in between. and you have two presets for PNG files. And we have also some presets for GIF. If you want to use GIF format, maybe for animation or vector files.
However, before we select another preset, we can be reducing file size as well, or image size. Here we have the dimensions for our image, so we can get that one to 600 pixels and clicking in here. Now we have a used image size. However, we can go for JPEG low, for instance, to see how far we can get. Now it's almost doubled from 15 megabytes all the way to 42 kilobytes. And even within your presets, you can be controlling quality if you'd like to reduce that one or increase it.
Or if you'd like to select from here instead of low you have medium high, very high and maximum. And also if you feel that you're getting too brains are noise within your image, you can be adding some blur to your image to compensate for that or hide some of your brains and noise may be a better fit. And always you can be zooming in back to check how it looks like and see the difference between your original and optimized image. And once you're done with that, you can be clicking Save to save your image, maybe adding optimized version and clicking Save. Here's one more check for you guys. If you'd like to be exporting layers, you can easily do that.
But let's first go and open a PSD file including some layers. So going to file open recent, I'm going to go with that one. Mikey F. We can be exporting only our void in here. So let's quickly select our boy See you later. Here we have it, we can be right clicking or layer. And we have quick export as PNG file or we can be exporting as as well.
Now we can be using the design element or that cool guy in here for a creative an interactive web design, so can be reducing our file size by using image size. And also can be selecting a smaller file, which will be using our image size from two megabytes all the way to 511 kilobytes. And also can be using scale for our image as maybe that width will be too much for with design. However, I'm going to be exporting that one as this clicking sport all safe. And that's basically guys how you can be optimizing your images and saving them for one