Try Shutterstock Editor, the easy and efficient design application.
Create professional-looking social media posts, promotions, and more.
You are probably familiar with at least a few examples of web pages where a single image has been carved up in ways that let each part of it link to a separate page or resource. There are a few ways to accomplish that goal, and one of the simplest is the Photoshop Slice tool. Its parameters allow you to use a pre-determined pattern to carve up the images. You can also set an aspect ratio or manually move slices to create exactly the right cuts. Then, when you export the project, the images are saved separately, and the CSS and HTML needed to generate the result in a webpage is also created in its own file.
Need images for your project? Shutterstock’s flexible plans give you access to our entire library. Explore our plans today.
How to Use the Slice Tool
Slicing is easy, and it simplifies a common web design feature, so you can streamline your work time by focusing on the result instead of the complexities of the page’s code. When you are ready to export the slices as a functional page, Save for Web lets you optimize each slice and then save the entire package.