Photoshop Slicing Rules

Posted on 2004-10-29
Last Modified: 2012-05-05
Dear All:

Is there some specific rules for slicing in Photoshop or ImageReady ??

I mean, are there some rules that was created by Web Designers to make the Slicing for a layout gives the best performance when converted to a Web Page or this just differ from one Layout to Another ??

I'm asking this because some times when i slice a layout and convert it to a Web Page i notice that if i try to extend my page down with a text or something, all the slices get miss up and the cells get out of my control !!

Is there a solution for this ???

Regards All  
Question by:ashkaat
    LVL 6

    Expert Comment

    I am not aware of any 'specific rules for slicing' but I suggest you keep your slices in a grid-like formation. That is, no overlapping columns as to make them fit in one HTML table.

    You may also have to edit the HTML for vertical and horizontal alignment (valign and align) and make some of the images as backgrounds for the cells or the tables.
    LVL 18

    Expert Comment

    I would suggest you don't slice images.  Unless you have to, which you usually don't.
    Especially since you said "all the slices get miss up and the cells get out of my control".

    Splicing images and positioning them with table cells is an old design technique, created when the techniques available today were not available.  They don't work well, but back then were the best there was.  Of course they've been around a while, so they are common and well known.  But not good.

    Modern layouts are designed using CSS (Cascading Style Sheets).  If you know table layouts, it can be difficult to learn to use CSS properly, but once you do you will see it's very powerful and flexible and allows some wonderfully elegant layouts.  I suggest you read web design sites like and to begin with.
    LVL 6

    Accepted Solution

    i use sliced images for my sites all of the time, and i wouldn't do anything else..  especially when you have a huge graphic spanning across all parts of the page..

    what i do in photoshop, is create guide lines on the graphic.   just click your mouse on the ruler in the window and drag the mouse to the middle of the window.  you'll see a line appear across it.  you can do this many times both horizontally and vertically.

    make sure that the settings are set to "Snap to: guides"

    then you can slice your image, snapping the slices to the guides, and you won't have any more problems with your slices..  or shouldn't..


    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    Threat Intelligence Starter Resources

    Integrating threat intelligence can be challenging, and not all companies are ready. These resources can help you build awareness and prepare for defense.

    Introduction HTML checkboxes provide the perfect way for a web developer to receive client input when the client's options might be none, one or many.  But the PHP code for processing the checkboxes can be confusing at first.  What if a checkbox is…
    Building “do-it-yourself” web sites has become an epidemic. There are so many blogs, web sites and even books that "teach" you how to build your web site in a few extremely simple and easy steps. Building a web site has become easier than boiling an…
    Any person in technology especially those working for big companies should at least know about the basics of web accessibility. Believe it or not there are even laws in place that require businesses to provide such means for the disabled and aging p…
    The viewer will get a basic understanding of what section 508 compliance can entail, learn about skip navigation links, alt text, transcripts, and font size controls.

    846 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    8 Experts available now in Live!

    Get 1:1 Help Now