Image Slicing

Here I will show you a very fast and simple way to slice an image designed in Photoshop.

Ok – when you have finished the work on your design in Photoshop you have to drag out some Guidelines to show where you want to slice your image.

To do this you have to have the “Show Rulers” option active (View – Show Rulers).

Activate the Move Tool and then just click on the horisontal/vertical rular and drag out the guidelines and position them where you want them.Now click on the “Jump to Image Ready” button .

Once your image has opened up in Image Ready go to Slices – Create Slices from Guides.

Your image should now have a number on each slice.

Then choose if you want to save your images as jpg or gif – and how much you want to compress the images in the save window:

Now you’re actually ready to save all your slices at once in just one step!

Go to File – Save Optimized As – and then choose if you want just the images saved, the HTML + images saved or just the HTML.

If you choose the HTML + images option Image Ready takes care of putting it in a table for you.

A quick tip on the way:

Plain text and very simple graphics: save as gif.
Photographs and beveled images: save as jpg.

Related Posts

1. 10 MooTools Image and Content Sliders
2. Creating a Smoke Shaped Image in Photoshop
3. How to Create Roads and Rail Tracks on a Path
4. 20 Handy Photoshop Tips For a Faster Workflow
5. Create a Shiny Earth with Photoshop 3D Layers