Resizing and Cropping Images for the Web

If you are using Pixlr [Recommended]

Pixlr (pixlr.com) is a web-based photo-editing site that is free and quite easy to use.

When you visit Pixlr’s website there are a couple of options. If you are new to the world of imagery on the web we recommend using Pixlr Express. If you already know how to use Photoshop but don’t have it on your computer we recommend using the Advanced version of Pixlr which has more robust features.

For this example we will use Pixlr Express:

  1. Click the Pixlr Express icon to open the program.

    pixlr express icon


  2. Click the Browse icon to select the image from your computer. Click Open.

    the browse icon (left-most icon) on the Pixlr Express home screen


  3. Select the Adjustment Icon to be able to resize, crop, rotate, and many more options.

    screenshot of the Pixlr edit screen, with the Adjustment icon in the lower left highliighted.  

Resize an Image

Select the Resize image icon. Enter the pixel size you want based on the recommended asset size. Click Apply. When you are finished editing your image, click save in the upper left corner of the screen.


screenshot of Pixlr Resize Image menu

Crop an Image

Select the Crop icon. Enter the new size of the image or click and drag the blue squares to highlight the correct area. You can move the selection box until the part of the image that you want to use is selected. Click Apply. When you are finished editing your image, click save in the upper left corner of the screen.

screenshot of Pixlr crop image interface, showing the draggable handles to re-size the image

screenshot of Pixlr Crop Image dialog box, showing options for dimensions and also proportions

Watch A Tutorial for using Pixler to edit an image size.


If you are using Photoshop

If you have Photoshop on your computer, here are some articles with tips for cropping and resizing images as well as saving them for Web.