Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    Senior Coder
    Join Date
    Nov 2003
    Location
    Minneapolis, MN
    Posts
    2,879
    Thanks
    2
    Thanked 65 Times in 56 Posts

    How do you slice in Photoshop?

    …I mean, how do you, personally, do it? I know there are a bunch of techniques out there.

    My personal favorite for web design is Fireworks…I find it much faster when designing comps and it makes slicing so easy. I'm trying to use PS more in my workflow, but I still haven't found a decent way to slice anything. So far I've tried the select tool and re-opening/saving each piece (time-consuming), ImageReady (maddening) and at the moment I'm just saving as a flat file and bringing it into FW for slicing.

    I know FS9 is supposed to integrate better with PS but it's serious dough at the moment. How do you slice your images when it's CSS time?

  • #2
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    I just use the slice tool in Photoshop. I slice only what I need. I think in terms of layout. For example I know the background is the same so no need to cut out a 500x500 background image when I can just cut out a 500x1 background image.

    After using the slice tool I use the save for web feature. I only generate the images then I code the html by hand.
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #3
    Senior Coder
    Join Date
    Nov 2003
    Location
    Minneapolis, MN
    Posts
    2,879
    Thanks
    2
    Thanked 65 Times in 56 Posts
    Quote Originally Posted by _Aerospace_Eng_ View Post
    After using the slice tool I use the save for web feature.
    Any tips on how to work with that? Everytime I use it, it a) saves the images in a folder I don't want; b) renames the slices to something I don't want. I can get around the code generation part so far.

  • #4
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    After slicing the section you want, right click on the section and go to slice properties. Here you will be able to name the slice to something more meaningful. When you go to save for web you get some options on how to save. Its setup to put the images in an images folder by default, what you want is custom. After choosing custom the options dialog will come up and you can choose to save the images in an images folder or not.
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #5
    Regular Coder croatiankid's Avatar
    Join Date
    Jan 2006
    Posts
    665
    Thanks
    1
    Thanked 12 Times in 12 Posts
    I've always manually sliced images (in Fireworks, I tried PS, but I'm much more used to FW so I'll stick to it for now). I flatten the stuff I need sliced and then use the marquee tool, copy, new file, paste, and modify its format to what I want.

  • #6
    Senior Coder
    Join Date
    Nov 2003
    Location
    Minneapolis, MN
    Posts
    2,879
    Thanks
    2
    Thanked 65 Times in 56 Posts
    @Aero: Thanks for the tips…man, PS just does not make slicing easy. But knowing there's no really quick way to do it I'm just going to start getting used to it.

    @croationkid: If your using FW you should really try the slice tool…it makes it very easy, much easier than using the marquee.

  • #7
    Senior Coder
    Join Date
    Mar 2003
    Location
    Atlanta
    Posts
    1,037
    Thanks
    14
    Thanked 30 Times in 28 Posts
    Wow? PS is difficult? I might want to check out FW to see how its done there. I follow the same approach as _Aero in Photoshop. Slicing only what can not be duplicated in HTML. I think in terms of divs and not actual image(if that makes any sense). I tend to slice according to how I would code the HTML div layout and what pictures would be used as background and what will not.
    Most of my questions/posts are fairly straightforward and simple. I post long verbose messages in an attempt to be thorough.

  • #8
    New Coder
    Join Date
    Aug 2007
    Location
    Minnesota
    Posts
    21
    Thanks
    0
    Thanked 1 Time in 1 Post
    I personally prefer PS for slicing. I slice all my images in PS, then save for web. the thing I like about the save for web feature is the ability to just click on any slice I want and optimize that image. It's a fast and easy tool IMO.

  • #9
    Senior Coder
    Join Date
    Nov 2003
    Location
    Minneapolis, MN
    Posts
    2,879
    Thanks
    2
    Thanked 65 Times in 56 Posts
    Quote Originally Posted by StupidRalph View Post
    Wow? PS is difficult? I might want to check out FW to see how its done there.
    What makes FW so easy for slicing are a bunch of things:

    * toggle view with a keystroke
    * at-a-glance dimensions of the slice (vs. right-click > edit slice options)
    * save filenames to be whatever you want (i.e., no needing to name a slice)
    * adjust slice boundaries and positions with the Move tool, and transform the same as you would a vector

    I'm sure you can do the same with PS, but it's the ease of the workflow in FW that make it so much faster, especially when doing things like image sprite navigation and tweaking slice sizes to try different layouts. I'm getting used to PS's way of working slowly.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •