Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Design Photoshop Foundations Slices & Save for Web Introduction to Slicing

Florian Tönjes
.a{fill-rule:evenodd;}techdegree seal-36
Florian Tönjes
Full Stack JavaScript Techdegree Graduate 50,856 Points

Why to slice at all?

What is the purpose of slicing? Why would one design a website in Photoshop as one big image and then slice it up into small pieces?

Wouldn't one start with creating all the elements of the website separately and then just arranging them together? Then one would have all the single elements already and wouldn't have to do this slicing.

Am I missing something here?

Kind Regards, Florian

1 Answer

I think the benefit of having all your elements in one Photoshop file but on different layers is that you have your whole website design in one place. Therefore it's easier to move elements around or make changes to the design. Something that's a lot more difficult to do when all your elements are saved in separate files.

Then slicing and optimizing for web is there to help you export the elements that you need for your site in the right format (things like images or illustrations), while leaving your Photoshop mock-up intact.

Dominika Hołota
Dominika Hołota
4,936 Points

What about website elements on separate layers?