Image Slicing and Tables

How and Why

Image Slicing and Table Layout

Creating a web layout using tables and image slicing means basically that you are initially creating a website in an image editor such as Photoshop, Gimp, Firworks, and slicing it using the slice tool. What this does is it takes the whole image and divides it into smaller parts that can be save into different formats (jpeg, gif, png, etc), this is done so you can reduce the size of the images and make the page load faster.

Once the the image slicing is finished you can use html/css to position your images in the different table cells. Many image editors have the option of exporting your sliced image along with the html/css files.

Links and Other Resources to Image Slicing and Table Layout

Why Slice?

This article covers some of the pros and cons of image slicing and it gives you also some examples of image slicing.

Image Slicing in Photoshop CS3

Good tutorial on image slicing in Photoshop CS3.

Taking Image Slicing from Photoshop to Dreamweaver

Video tutorial on image slicing. Although the process is done in Photoshop and Dreamweaver, you still get a good idea on the basics of image slicing.

Roberto Becchetti | November 11 2009 | email me