Alert icon
We're changing our privacy policy. This stuff matters.  Learn more  Dismiss

Learn Adobe Photoshop - Save to Web & Devices

Loading...

Sign in or sign up now!
Alert icon
Upgrade to the latest Flash Player for improved playback performance. Upgrade now or more info.
1,719
Loading...
Alert icon
Sign in or sign up now!
Alert icon

Uploaded by on Mar 4, 2011

Free Apps for a limited time! http://bit.ly/xFGID5
In this video, Mahalo expert Justin Z. explains how to save your image for the web and mobile devices using Adobe Photoshop CS5.

About Save to Web & Devices
---------------------------------------------------------------------

Save for Web and Devices is a very handy option for preparing images for use on the web. Its range in changing your images is wide and varying.

How to Save to Web & Devices
---------------------------------------------------------------------

1. In the top menu bar click File -- Save for Web & Devices.
2. When you click, a new large dialogue box will open. At first, it can seem a little overwhelming, but there is plenty to do here.
3. The first thing you can see are a series of tabs with a set of windows. These windows allow you to look at the before and after versions of the photo you are going to convert.

1. 4. Original shows what the image looks like normally without any changes.

2. 5. Optimized shows what it looks like after changes.

3. 6. 2-Up will show you a split-screen view of the image, both before and after.

4. 7. 4-Up will show the original, plus 3 versions of the optimized picture so you can see differences in quality.

8. Go back to 2-Up and click on the optimized version of the picture. On the left, you have a few tools to control the image.

1. 9. The Hand tool moves the image around.

2. 10. The Slice tool allows for separation of pieces of the image for web design.

3. 11. Zoom simply zooms in or out of the picture.

4. 12. The Eyedropper allows for color sampling, which can be looked at in the color sampling window.

5. 13. Right below that is the Slice Window for further options on slicing.

14. On the right are options for customizing the image.

1. 15. You can choose between Presets, but mostly you'll be customizing from scratch.

2. 16. Each Image Type selection you choose will allow for different options, but it is generally divided into three sections.

3. 17. Image Set Up allows you to change the type of image, amount of colors, transparency and other options.

4. 18. Color Set Up allows you to make changes to the available colors.

5. 19. Image Size allows you to change the image size by pixels or by percentage.

With each image type you will be given a few extra options, but the essential sections remain the same. On the lower left hand side you get a couple of extra options.

1. Device Central will open a new window to save your picture for different mobile devices.
2. Preview will show you what an image looks like in a web browser. There is a small option right next to it that allows you to choose between the different web browsers.
3. Finally, you can choose to Save, Cancel or press Done (which will save the settings you have created if you want to come back to it later.

Take advantage of what this tool can do for you. If you're involved in web design, it will prove very valuable to your needs.

Read more by visiting our page at:
http://www.mahalo.com/learn-adobe-photoshop-save-to-web-and-devices/

Category:

Howto & Style

Tags:

License:

Standard YouTube License

  • likes, 1 dislikes

Link to this comment:

Share to:
see all

All Comments (4)

Sign In or Sign Up now to post a comment!
  • thnx alol

  • excellent tutorial thank

  • what if you cant do that!

    

  • i just got laid but im first. what now bitches!

Loading...

Alert icon
0 / 00Unsaved Playlist Return to active list
    1. Your queue is empty. Add videos to your queue using this button:
      or sign in to load a different list.
    Loading...Loading...Saving...
    • Clear all videos from this list
    • Learn more