Crop An Image With Photoshop Express Editor
Once you’ve uploaded an image, you should see it displayed at a large size on the right. On the left side is a drawer of tools, with your basic tools at the top.
You’ll find Click, Crop & Rotate at the top of the list. There’s a drop-down menu with Crop Dimensions to choose a ratio (basically, square or rectangle). The editor uses a gridded box overlaid on your image to show what will be cropped. Everything inside the box will be kept, everything outside the box and grayed out will be removed. Once you’re satisfied with your selection, choose another tool from the left-side drawer to continue. Or click Done to immediately download your new image and close the editor.
Crop is really useful for creating those trendy square shaped images or selectively removing So-And-So On The End There In the Group Picture With His Eyes Closed. Goofball.
Resize An Image With Photoshop Express Editor
Click Resize towards the top of the list, just below Crop & Rotate. There are four pre-set sizes that I think are completely useless. Ignore them. Click the Custom button.
Resizing images for social media and websites requires a little knowledge about pixels and typical website “column widths.” The Photoshop Express Editor measures images in pixels, the building blocks of images displayed on screens. The Custom button allows you type in precise pixel dimensions for the editor to apply to your picture. On the Internet, width is the most important dimension. Images and web pages can always be taller, but there are often limits to width in pixels.
Many websites are 960 px in total width. Websites with a “sidebar” and main column might use a main column width anywhere from 640px to 800px and beyond. You want to resize your images to fit your website’s main column width. Otherwise, they will spill over the column borders. These enormous images will also slow down your website’s load time, discouraging visitors from sticking around.
When you know how wide your website is, try to determine a good small, medium and large width for images. For example:
- Small might be 150 pixels wide.
- Medium might be 300 pixels wide.
- Large might be the full width of your main column, or at least 600 pixels.
In Photoshop Exress Editor, type your chosen width into the Width field. The Height will automatically adjust to keep the aspect ratio and the image will automatically change size. Once you’ve found a good size, choose another tool from the left-side drawer to continue. Or click Done to download your image.
There are a ton of other easy to use functions with this tool. You can play with brightness and contrast, remove red eye and make other types of basic edits. I’ll let you explore those on your own. Just try not to go crazy with the Hue effect. However, if you should turn your staff into green-skinned aliens, there is an Undo button at the bottom of every screen.
1.) Determine optimal slide dimensions
From the list below, find your website template’s corresponding slide dimensions and take note of them:
- : x
- Primo : 930 x 300
- Slate : 940 x 350
- Fresh Delight : 700 x 450
- Crema : 900 x 450
- Core : 800 x 500
- Zest : 1500 x 700
Note: If your photo’s dimensions are smaller than the recommended sizes, it may come up pixelated/blurry when stretched to those optimal dimensions. Photos that are 1000 px in width or higher are highly suggested for use.
In this tutorial, well be creating a slide for the Primo template (930 x 300).
4.) Crop image
From the Tools panel on the left, select the Crop Tool. Hover your cursor on the top border of the image and when the Crop Tool changes indicating cropping, click and drag the top border of the crop area down until you reach near 300 px in height but no less than it, then release your mouse button. On a space inside the crop area, click and drag it up or down depending on what you’d like to show on the slide. Press enter/return key on your keyboard to finalize and delete the sections outside the crop area. In the menu bar, navigate to Image > Canvas Size (keyboard shortcut: Alt+Ctrl/Cmd+C) In the Canvas Size window, set Height to 300 px and click on the OK button. If prompted with the following, just click Proceed.
5.) Save image slide
From the menu bar, go to File > Save for Web (keyboard shortcut: Alt+Shift+Ctrl/Cmd+S) In the Save window, set image type to JPEG and image quality to High, and then click the Save button. That’s it! You can now upload your newly created slide to your website. Related tutorials: