Home
Home - www.slicingguide.com
Home Home Contact Us Add to Favorites

LESSON SECTIONS

Lesson 1 - Introduction to the Slicing Guide
Lesson 2 - Developing Your Slicing Strategy
Lesson 3 - Setting the Stage
Lesson 4 - Preparing the HTML Document
Lesson 5 - Main Tables and Images
Lesson 6a - Setting up the Borders
Lesson 6b - Lesson Recap With Basic Diagrams
Lesson 6c - Setting the Final Alignments
Lesson 7a - Slicing and Coding the Header Banner
Lesson 7b - Slicing and Coding the Header Nav Menu
Lesson 8 - Slicing and Coding the Main Menu
Lesson 9 - Creating an Ad Banner Box Area
Lesson 10 - Slicing and Coding the Member Login Menu
Lesson 11a - Basic Content Box Tables and Measurements
Lesson 11b - Slice and Code the Small Content Column
Lesson 11c - Slice and Code the Main Content Column
Lesson 12 - Slice and Code the Footer
Lesson 13 - Finishing Touches
Lesson 14 - Final Notes and Support
Support :
Our Banner:
Welcome to SlicingGuide.com

Welcome to SlicingGuide.com, the online tutorial written by Dan (Faken) of Pixel2life.com. This tutorial is designed to teach you how to slice a complex website layout using Corel Photopaint and Macromedia Dreamweaver. You can use any 2D graphic application such as Photoshop if you do not use Photopaint.

In order to properly slice a website, I HIGHLY recommend that you do so completely by hand rather than use a quick slicing tool such as Fireworks. These programs often generate a sliced layout that looks great until it comes time for those content boxes to start stretching.

[ Previous Lesson ]

Website Layout Slicing!
 
Tutorial Support and Comments
If you have any comments or questions about this tutorial, or if you see a typo or a broken image link, please be sure to post in the official support forum located at the Pixel2life.com Forums!
 
Special Thanks
I'd like to thank Donna (owner of www.13dots.com) for listening to my ranting about how long this tutorial was taking and providing encouragement to keep going. I'd also like to thank Jay for pointing out any coding booboos on SlicingGuide.com and for going through the whole thing and XHTML validating it. Finally, I want to thank my bro Elvio (owner of www.coolcommands.com)for the final proof reading and sending me a scary list of corrections! I should also thank Rush for the great tunes that kept me going for the last month or so that I've been working on this.
 
Final Notes
Remember, the trick to intelligently slicing tutorials is practice and not getting stuck on a single method of doing things. There are many ways to slice, not to mention MUCH more to web design than slicing a layout, so never be afraid to experiment and to keep learning.
 
About the Author
Dan (aka Faken) is the owner and designer of Pixel2life.com, the internet's largest tutorial search engine catering to graphic designers and programmers, and has been a graphic design professional for 12 years.

Thanks for Reading!

I REALLY hope you've been able to learn from this tutorial! This was actually a fun project although a bit longer than I expected, and it's especially worth it if you folks get something from it. Thanks again for reading and all my best on your future projects!

 

[ Previous Lesson ]