Welcome to the official Ultimate Layout Slicing and Coding Guide official support forum.



After over 80 hours of writing, taking screenshots and finally designing a website to host this tutorial, the Ultimate Slicing Guide is finally released and ready for viewing! For those of you that missed this, I have been working on the largest online tutorial ever created on how to manually slice a layout with Corel Photopaint (Or any other graphics program) and then code it into an HTML page in Dreamweaver.

You can check out this HUGE tutorial (Over 60MB in screenshots and samples) at http://www.slicingguide.com (The entire website is 1 tutorial!) and learn how to slice a complicated layout by hand and completely code it using Dreamweaver! You'll never have your content boxes screwing up your site everytime they get too long or scratch your head on how to tile gradients.

The tutorial will show you how to:

• Create a slicing Strategy Guide
• Manually slice a layout with minimal image size
• Correct images for your layout
• Completely code your images to a webpage with Dreamweaver
• Create expanding content boxes
• Deal with tiling gradient backgrounds
• Stack tables to format your layout
• Apply techniques to any tutorial you slice
• Insert and pad text and images properly
• Organize your images and html documents
• Much more!

You'll never need another slicing tutorial ever again after reading this complete guide, so check it out now!

Please use this thread to post any questions or comments you may have! Otherwise, hope you enjoy the tutorial!

Faken

Okay....holy crap....this is the coolest thing ever!!! GREAT WORK cant WAIT to get started!

The site kinda scared me at first, a lot of information all of a sudden, but lookin at it for a second cleared everything up. WOW.....just....WOW

:bowtofaken:


great stuff dude, i cant say that enuf


---and congrats to Griffin again! awesome layout man!

Is there any fast and painless way to convert the final products code to css or is that a stupid question?

Donna missed a typo

Fixed

Faken

My eyes were going so buggy at the end, so yes I probably have missed some thats what young fresh eye balls are for

It's good but I dunno if it's good enough for P2L


Well done Faken!

Excellent work! *applauds* The best tutorial on slicing ever.

Hello,

Is that possible to download the tut in a pdf file ?

Or will you do that ?

Thanks

WIngslave

I dont know whether this is supposed to be like this but in lesson 9-10 there seems to be a lot of images missing, its says like figure 9.3 about the faint line in the red cirlce and i cant see an image. (there are a lot more i just picked that 1)

im in FF btw does that make a difference?

All the images are fine... there;s a small description error, but the image is there... 9.4 is the one with the line. Tested and works fine in FF. Mayb clear your cache?

Anyhow, fixing that error..

Faken

Worked fine for me.
Brilliant tut Dan.
I can finally make my website and thousands of goes.

erm iv tried FF cleared cache, tried IE and cleared cache but no joy, would screenshots help?

Hello Faken,

I must say brilliant tutorial, I have been searching for something this in depth for probably the last year or two. Well I am slicing the layout you provided and I am currently stuck. Everything was going perfect until I ran into this mess. I have finished doing the left content area, and started on the main content area to the right, and after finishing my right content area it seemed to mess up my left content area, just below the first content box on the left content area section. Below I have provided a link to view my progress. Thanks in Advance for all your help.

Progress: www.hybridmed.net/Slice/index3.html

Download My Files in Use: http://www.hybridmed.net/Slice/

Thanks,
Taylor Leach
Hybrid Media

uhm i got a few questions, sorry if i just didnt pay attention

when i create a table in dreamweaver, it doesnt place it at the top. it places it one break down.



second, when i split my table with a background image, the background image doesnt stay the same:

original:


after splitting:



and third, after i set the vertical size to 100%, it shows it correcly in dreamweaver, but not in my browser!

help!




edit: nvm it worked after copying your source code. weird it was the same only in a different shape

Hi . I registered here after reading this AWESOME TUTORIAL about slicing...I laready know how to slice ,but I was shocked how much effort u had to put into that.

BIG THUMBS UP !!!

great and very helpfull job u did !

Ok your problem is simple Back in Lesson 11a you create a table with two cells - one for your left column, and one for you right column (See Fig 11a.3). Now you did that all fine, but you made a booboo in Lesson 11b. If you scroll down to Fig 11b.24, that's there you paste additional copies of the first left column content box you made.

Here's the problem: You have to paste that content box under the first, but in the same table (The table you created in 11a.3). In your case, you pasted it under the table. That's why you have that huge gap under the first content box.

So just move the second and third content boxes you created into that main table that holds all the content boxes and you're all set.

Faken

Well you seem to be skipping steps... gotta make sure you read the entire tutorial or you get issues like this

For your first problem, it's because you didn't set your margins as per the instructions in Lesson 4.

For your second issue, it's because you set the image as the background for the cell, not for the table. Click inside the table then remove the background image you have set in the properties box. Then click on the tag to highlight the entire table and set the background in the table property box.

Your third issue is probably the same problem as #1.

Faken