 Hi, this is Jeffrey with Lightbox and today we're going to go over how to optimize an image with Affinity Photo. We're going to show you how to do this a fast and really easy way on using Affinity Photo in order to optimize and make your images smaller for the web. And the reason we want to do this is when you get an image, usually it's a really large size and we need to make that size small because if it's too big, it's going to make your website super slow. And you know what happens with a slow website, it takes forever to load, you get frustrated and bounce right off of it. So let's go ahead and get to this. So for this video we're going to use Unsplash and let's just find one image in here that would look like a cool background. Here we go. Let's take this right here. We'll say we'll use this as a background image. So let's go ahead and download it. And just to show you what I mean by size, you can see this one is 2.3 megabytes right here. So let's go ahead and drag this into your Affinity Photo. All right. Now while you're inside here, what we want to do is export for photo. There's two ways of doing it. You can either go here to File, scroll down to Export, not Export LUT but Export right here. Or there's also a keyboard shortcut which is Shift, Option, Command and S. And you press all those at the same time. All right. So let's just go ahead and click on Export here. So now we got the selection box right here on what we need to do to optimize it. And you can see the estimated file size on it right here is 8.65 megabytes. Now that's massive. And just to give some context on how big your web page should be, your websites should be under 1.5 megabytes total. And keep in mind about half of that size is going to be all the code that's in your website. All right. So let's go ahead and make this smaller. So first step is let's make sure we have the right file here chosen. We have it on JPEG. It's usually JPEG by default. Now about 95% of the time all your images are going to be JPEG. This is the right format for web. Only other format. I won't get too much into it would be PNG, but this is only if you need an image that has a cropped out background. But we're not doing that right now. So let's stay on JPEG. Next one. Let's go ahead and resize it. So you can see right here is 6,016 pixels width. Now that's huge screens, computer screens aren't even that big. Average laptop screen is 1,300 pixels. But this is also a background image so it does not have to be even as big as the entire screen because it's going to be in the background, it's going to stretch up it. So for large images, I find my sweet spot is somewhere between 1,200 and 1,400 pixels width depending on how detailed it is. So we're just going to make this one 1,200. This is the size I set most of my net. And just go ahead and click return. Now let's go over to the quality. You'll see this preset right here, it says JPEG best quality, high quality, medium low. These are just built in presets right here and it automatically changes the quantity. Now I recommend doing this manually. I just leave mine at best quality and then I just scale it down right here the quality. What this is, this quality is, it's actually compression. It's compressing your image and it's making it smaller. You can see at 100, we're at 921 kb, that's a little bit less than 1 megabyte. Now if we drag this down to 80, look at that, we're at 151 kb. That's a great size right there for a large image. Usually you want your large images under 150 kb. No more than 300, 300 is huge. But this is perfect right here. I like my sweet spot on quality at around 80. I'd never go below 70 because you start to see the difference in the quality. I find that if I leave it around 80, it leaves my quality still looking like the regular image. You can't really tell the difference but it makes a huge difference in the file size. So we have one more step to do before we have optimized it all the way. Click on the more button here. So you'll see the embed ICC profile and you'll see the embed metadata is turned on. Now what this is, this is like the data that's connected to the image and that's also creating, that's also creating a bigger size. I'll show you an example. So we got the image right here. Let's click on get info and you can see right here, all this information right here shows where the dates it was created, it shows where it was from, what link it was from. So this is all the information that's in it and we don't need that information for an image on your website. So we're going to click this off. And we're going to click on progressive and all you do is hit close. And you can see it even dropped down a little bit more and went from 151 to now about 144. That's it. Your image is now ready for the web. Let's go ahead and click export, give it a name, go ahead and save it. And now you could upload this directly to your website, to your WordPress website. It's good to go. Just always keep in mind the size of your webpage. I'll have other tutorials coming out showing how to check the size of a whole webpage. But for now, I hope this helps. If it does, you know, yeah, all that good YouTube stuff, like, subscribe, comment. You know, if you want me to show something else, go ahead and let me know, I'd be happy to do it. All right. Thank you for watching. Cheers.