How to Crop Images and Optimize in Photoshop to Save Time

Previous Next 1 of 3

Ever wondered how to save time and make your site look consistent by cropping your images and optimize in Photoshop?

Ever needed to crop an image down to a certain size and save for web? This is something everyone who manages or populates content to the web needs to be able to do at some point to keep their site clean and organized. This simple tutorial will help you do this effortlessly using photoshop CS through CS6

I know photoshop to a lot of Small Business Owners can seem daunting, however like this tutorial on how to crop images and optimize in photoshop to save time, it can be quite simple.

1. Simply start by opening photoshop and clicking File>>>Open>>>then select the photo you which to work on.

Tip: One note, it is important to start with an image that is quite large, as cropping to a smaller size will produce a crisp image, however cropping to a larger size will create poor pixelation.

2. Once the photo is open in photoshop, click the crop button.

Tip: If you hover over each tool in photoshop it will tell you which tool it is. The crop tool looks a picture frame crossed over.

3. Once the crop tool is selected a bar appears at the top that asks you the pixel dimensions you want to crop the image to. See figure 2 above. You will notice the bar at the top of photoshop that says Width and Height and Resolution.

Tip: Most images for web need to be a screen resolution of 72 DPI (Dots Per Inch).

In this case I want to crop the image at 600px Width and 480px in Height.

Tip: make sure to type “px” at the end of the number if you want to crop to pixels. Type “in” if you want to crop to inches etc etc.

4. After you select the size and resolution for the crop, simply click hold and drag your crop tool over your image, release when it covers the part of the image you want to crop. The box that appears is the same size ratio as the numbers you crunched in. You can make it as big or small as you want but you cannot change the aspect ratio unless you change the numbers.

Tip: After you drag it out, you can move the crop box around to select the best crop for the image. Click enter once you release the box and the image will crop for the size you specified.

How to optimize and save the image for web.

5. Deselect the crop tool by clicking on the top arrow tool. Then go to File>>>and click “Save for Web and devices”. A save box appears like figure 5.

Tip: Jpeg will usually give you the best image quality for a normal photo or image so make sure Jpeg is selected. Next right under JPEG you will see a bar, in figure 5 this bar says “High”. This is referring to the image optimization quality. I usually select high as it is still a relatively small file and maintains good pixel depth. Medium and down will start to create poor pixelation, but for small images less than 300px this can be a good option.

6. Once you’re done choosing your optimization preferences it is time to save. At the bottom of the save for web and devices you will find three buttons, Save, Cancel, and Done.
If you want to save the image with the preferences you chose, click save. Your file directory will come up and then simply select the folder on your computer you wish to save the image file to.

And you’re done, you have successfully navigated Photoshop’s many features to create this simple how to task and make your images whatever size you want.

We appreciate you reading this post, and hope this makes your life a little bit easier as you benefit from photoshops many useful but simple tasks.

We look forward to posting some more How To photoshop tutorials to help you manage your webpage better.

Thanks for reading!

Kind Regards

Simon | CEO | Designer | Consultant

 

Simon Cox

About Simon Cox

After earning his BFA at world renowned Ringling School of Art and Design, Simon began his career with a bang, working for a variety of notable firms, on key projects and visualizations. Due to his drive for excellence he founded Matchwork Studio, based on the core elements of design, marketing and development. Simon saw the need to create a Studio that offered the best in creative design and practical functionality built with the sole purpose of supplying Matchwork Studio clients with results.

Comments (21)
  • 3ds emulator for android

    October 2, 2014

    However, a number of reasons make it impossible for a large numbers of
    lovers of the game to experience all the benefits on the console.
    If you aren’t aware, Usenet is actually older than the
    web and is the grand daddy of today’s current data sharing programs like limewire.

    This includes a hundred minutes and five hundred text messages.

  • Web Directory

    October 9, 2014

    The more links you have the better you rank with Google will be.
    Ask about the production process and their sourcing.

    If not, then you can move on to another web directory on the list.

  • camel scooters friends

    October 17, 2014

    I do not even know how I ended up here, but I thought this post was good.
    I do not know who you are but certainly you
    are going to a famous blogger if you aren’t already ;) Cheers!

  • hoodie fashion medium

    October 19, 2014

    It’s wonderful that you are getting thoughts from this piece of writing as well as from our argument made here.

  • chicken brown rice

    October 20, 2014

    I have been exploring for a bit for any high-quality articles or blog posts
    on this kind of house . Exploring in Yahoo I eventually stumbled upon this website.
    Reading this info So i’m glad to exhibit that I’ve an incredibly
    excellent uncanny feeling I found out just what I needed. I such a lot definitely will make sure to do
    not omit this website and provides it a look regularly.

  • hummingbird feeder woodlink

    October 23, 2014

    Wow, incredible blog structure! How long have you ever been blogging for?
    you make running a blog glance easy. The entire glance
    of your web site is excellent, let alone the content material!

  • cage platinum bird

    October 23, 2014

    I would like to thank you for the efforts you have put in writing this site.
    I’m hoping to view the same high-grade blog posts by you later on as well.
    In fact, your creative writing abilities has inspired
    me to get my own, personal site now ;)

  • ExxcelModel.com

    October 29, 2014

    Recently I have been searching Google for sites with articles on http://www.exxcelmodel.com and
    ended up on matchworkstudio.com. Thank you for providing this excellent info.
    I must say this is the most useful web page I came across with any helpful ideas about this topic.
    I just want to write thanks, this is just what I was looking for.

  • protection cover breaking case

    November 2, 2014

    I like the helpful information you provide in your articles.
    I’ll bookmark your blog and check again here regularly.
    I’m quite certain I will learn plenty of new stuff right
    here! Best of luck for the next!

  • pottery teriyaki bowl white

    November 5, 2014

    Its such as you learn my mind! You seem to know so much about this, such as you wrote
    the e-book in it or something. I feel that you could do with a few % to drive the message house a bit,
    but instead of that, this is wonderful blog. A great read.

    I’ll definitely be back.

  • disney christmas wreath

    November 5, 2014

    An impressive share! I’ve just forwarded this onto a coworker who has been conducting a little research on this.
    And he actually ordered me lunch because I discovered it for him…
    lol. So let me reword this…. Thanks for the meal!!
    But yeah, thanks for spending the time to talk about this topic here on your internet site.

  • 6pm coupons

    November 6, 2014

    If you desire to increase your knowledge simply keep visiting this web
    page and be updated with the newest news posted here.

  • universal holder motorola devour

    November 12, 2014

    Hi there! I’m at work surfing around your blog from my new iphone 4!
    Just wanted to say I love reading your blog and look forward to all your
    posts! Carry on the fantastic work!

  • mic ifrogz earpollution

    November 12, 2014

    Superb website you have here but I was curious about if you knew of
    any forums that cover the same topics discussed
    in this article? I’d really like to be a part of community where
    I can get comments from other knowledgeable people that share
    the same interest. If you have any suggestions, please
    let me know. Thank you!

  • wall calendar magnet steel

    November 16, 2014

    It’s going to be end of mine day, except before ending I am reading this wonderful article
    to improve my know-how.

  • comics avengers iphone anymode

    November 18, 2014

    I am really impressed together with your writing abilities as neatly as with the format on your blog.
    Is this a paid subject matter or did you customize it your self?
    Anyway keep up the nice high quality writing, it is rare to peer a nice blog like this
    one nowadays..

  • www.youtube.com

    November 23, 2014

    My partner and I stumbled over here from a different web page and thought I should check things out.
    I like what I see so now i am following you. Look forward to going over your web page again.

  • north face quantas

    November 23, 2014

    Hmm it looks like your blog ate my first comment (it
    was super long) so I guess I’ll just sum it up what I submitted and say, I’m thoroughly enjoying your blog.
    I too am an aspiring blog writer but I’m still new to everything.
    Do you have any helpful hints for newbie blog writers?

    I’d really appreciate it.

  • Edmundo

    November 26, 2014

    Hello site owner i see you put a lot of work in your blog,
    i know how to make your blogging easier, do you know that you can copy any content from any site, make
    it 100% unique and pass copyscape test? For more details , just search in google – masagaltas free content

  • http://patch.com/virginia/delray/elite-test-360-reviewed-warning-read-our-review

    December 14, 2014

    Hiya! Quick question that’s entirely off topic.
    Do you know how to make your site mobile friendly?
    My web site looks weird when browsing from my iphone 4.

    I’m trying to find a theme or plugin that might be able to resolve this issue.
    If you have any suggestions, please share. Thank you!

  • samsung note memory card

    December 14, 2014

    When someone writes an article he/she retains the plan of a user in his/her brain that how a user can know it.
    So that’s why this paragraph is great. Thanks!

Leave a Comment

* 2+0=?

* required