BF Internet - Established 1996 BF Internet - Established 1996

Call us for a quotation:
0845 519 4727

FAQ's - your first stop for answers

FAQ's

Your first stop for answers

Adobe Photoshop, The Basics

November 28th, 2008, by Thomas Milligan

This guide will show you the steps involved for basic image editing, using Adobe Photoshop.

  1. Open Adobe Photoshop
  2. Click to enlarge

    Click to enlarge

    Click on the ‘File’ menu, then select ‘Open’ and browse for the image file you wish to work on.

Cropping an Image

  1. Using the Rectangular Marquee Tool (Square dashed line) in the top left of the Tools Palette draw a box around the area of image you would like to keep.
  2. Click on the ‘Image’ menu and select ‘Crop’ to remove the unwanted area from the picture.
  3. Click to enlarge

    Click to enlarge

    If you are unhappy with the result you can click on the ‘Edit’ menu and select the ‘Undo’ option to go back a step. Ctrl+Alt+Z will take you back further steps.

Resizing an Image

  1. Click to enlarge

    Click to enlarge

    With the appropriate image open and cropped (if necessary) you can resize the image by clicking on the ‘Image’ menu and selecting ‘Image Size’ to open up the image size window.

  2. Click to enlarge

    Click to enlarge

    Here you can choose the new size for your image, in pixels, for use on your website. Keep the ‘Constrain Proportions’ option ticked to stop your image becoming stretched. Click ‘OK’ to resize your image once you have chosen your size.

  3. To preview how your image will look on-screen, select the ‘Zoom Tool’ (Magnifying Glass Symbol) in the tools palette and click the ‘Actual Pixels’ button in the top toolbar under the menus. This will set the Zoom level to 100% so your image will be show at the same size as it will appear in a web browser.Again, if you are unhappy with the result you can click on the ‘Edit’ menu and select the ‘Undo’ option to go back a step.

Saving an Image

  1. Click to enlarge

    Click to enlarge

    Once you have prepared your image, to save it click on the ‘File’ menu and select ‘Save for web.’

  2. Click to enlarge

    Click to enlarge

    The ‘save for web’ preview window will open, where you can select the optimisation settings for your image and preview the result (under the ‘optimised’ tab.For the majority of photographs, using the preset settings ‘JPEG High’ or ‘JPEG medium’ will be fine. You can select a preset from the drop-down menu located under the ‘OK’ ’Cancel’ and ‘Output Settings’ buttons on the right hand side.

  3. As you change the settings, the image in the preview window will change. The higher the quality setting, the larger your file size will be, taking longer to download. Smaller files however, will lead to poor quality, blocky images if too low a quality is chosen.
  4. Click to enlarge

    Click to enlarge

    Once you have selected the optimisation settings that you are happy with, click ‘OK’ to save your file under a suitable filename. This command is similar to using ‘Save As’ and will not overwrite your original file as long as a different name or
    folder is used.

  5. If you are creating product images for your online store, it is always best to resize and save your product image first, then prepare your product thumbnail.

Want to use this FAQ on another website?

Feel free to do so, but in return for the hard work involved in writing this article, please reproduce the article exactly as it appears here and include the following information box in full:-

About the author:

Established in 1996, BF Internet are a UK Web Design company offering creative design and online solutions for business start-ups, SMEs, corporate clients & major high street brands. See www.bfinternet.co.uk for portfolio, more details and a free consultation.

Bookmark and Share

BF Internet, 7 Shoreline Business Park, Sandside, Milnthorpe, Cumbria, LA7 7BF, UK

Tel: 0845 519 4727 - Fax: 015395 64580 - Email:

1996 - 2010 Big Fish Internet Ltd t/a BF Internet

Our terms & conditions