How to Resize Images in Photoshop

Resizing an image, any type of image, is an essential skill that is useful to just about everyone, in particular to all website owners and admins. As an administrator, you need to make sure everything’s up to date and that it runs smoothly. Certainly, one of the biggest challenges you may face is keeping your website optimized. You want the page to load fast, so as to prevent the bounce rate from soaring. What can immensely jeopardize the page load time are images, especially if you use the wrong size.

Say you’ve set the width of your page to be 1300 pixels. In that case, you shouldn’t upload images that are wider than the value you’ve set for the page as a whole. The browser will have to resize them on its own, which will either cause the page to load slowly or it won’t even load properly. In order to avoid optimization issues, it’s for the best to learn how to resize images in Adobe Photoshop. This is truly a simple task and it will spare you a lot of trouble. In fact, this, along with increasing the resolution of your photos, is an essential item in the skill set of every blogger and WordPress admin.

There are three basic ways to change the dimensions of your images: resizing, cropping, and changing the canvas size. We’ll now show you how to accomplish each of these three methods.

How to Resize Images in Photoshop

We’ll start, obviously, by opening the image file. Resizing images in Adobe Photoshop starts from the menu at the top of your screen. Go ahead and select Image > Image Size. In the newly opened dialogue box, you’ll be able to change the resolution of your image as well as set the desired dimensions.

You can change the image size in pixels or inches, whichever you prefer. Using pixels makes more sense if you’re resizing the image for online use, while inches are more convenient if you’re resizing for print.

If you wish to preserve the original proportions of your picture, don’t forget to highlight the Link icon.

To resize your image, change the dimensions either in the Width or in the Height field. If you enabled the Link icon, by changing one, the other will automatically and proportionally adjust.

Another important thing you shouldn’t forget about is the Resample Image option. You should use it when you want to change the number of pixels in your image. More pixels equals better quality, so if you’re making your image dimensions larger, you’ll probably want to keep this option enabled. Otherwise, when you resize image, you’ll just stretch the current pixels to a larger dimension, making your image blurry.

By adding pixels to your image, you’ll make it sharper (so-called upsampling), and by eliminating pixels, you’ll reduce its quality (downsampling).

If you wish for the pixel resolution to remain intact regardless of the image size being changed, make sure to uncheck the Resample Image option.

When you’re done with resizing, click OK.

How to Crop Images in Photoshop

Cropping allows us to remove certain areas we no longer need or want to display from the images. To do it in Photoshop, open the image file you want to edit, select the Crop tool from the Tools panel on the left side of your screen. Once you click on the icon, crop borders will show up around the edges of your image. The next thing you should do is to bring your cursor to any of the crop handles. You can left-click on them, and then drag them to resize the crop box. As you do this, you’ll be able to see inside the crop box the part of the image that won’t be cropped out.

Don’t forget to select the Delete Cropped Pixels option from the Options bar at the top of your screen. This will permanently discard all the pixels that stayed outside your crop area. But in case you want to keep them, just uncheck this box.

To save the changes you made, click the Save button from the Options bar.

How to Change the Canvas Size in Photoshop

When you wish to add extra space around your photo, you should resize the size of the canvas on which the image is placed. By doing this, you’ll have more space to add some extra details and decorative elements, since the size of the image itself won’t change.

From the Image menu select the Canvas Size option. In the dialogue box you’ll be able to see the current size of your canvas. There are two ways in which you could resize it. One is to simply enter the new dimensions in both the Width and Height fields. Or, you can check the Relative box. This will allow you to specify how many pixels you’d like to add or remove from your canvas.

Once you’re happy with the canvas size, click OK to apply the changes.

Conclusion

Optimizing your images for the web requires a lot of work. But, if you want your website to load faster and be fully responsive, you need to be careful with your image sizes. If you’re using WordPress, then you’re probably familiar with the photo resizing option this CMS offers by default. But you should know that if you decide to use it, you’ll only change the size of the image that’s going to be displayed on your site. On the other hand, the file itself will keep its original dimensions, which might continue to cause optimization issues. It’s always best to create and upload properly optimized photos right from the get-go. Now that you know how to resize images in Photoshop, go ahead and put this knowledge into practice and make some beautiful and lightning-fast pages!