New_Title.gif (5716 bytes)
 
What is Artizen
Compare Artizen
Awards
Tutorials
Gallery
Updates
Plugins
User Login

  _

 

Artizen >> Tutorials >> Image Slicing & Dicing

     Image slicing tools have become a must have for every web developer. This is not because it can't be done any other way, but when you are under pressure to get your work done, any shortcut seems like the yellow brick road. Image slicing is the process of slicing and dicing an image into small pieces, so web surfers don't have to wait until one large image has been downloaded to view your web page. There is another reason to slice and dice your image. Once it's sliced you can create Rollovers and Hyperlinks to really give your site the professional touch. Now, thanks to programs like Artizen HDR not only do they slice and dice your images but they also create Javascript for your Image Rollovers.

     Assuming that we have already created our web page, we get started by going to File | Save for Web. The concept of image slicing seems to work well in design programs. The Web Export is divided in separate sections clearly labeled, indicating their purpose. The "Create HTML PAGE?" allows you to decide if you want to just slice an image or slice and generate a web page. Now if you choose to create a web page you can add basic web page information like the page's Title, Keywords, and Description (used by search engines to categorize your site and page). In addition the "Interactive" and "ICC Profile" sections become enabled. The ICC Profile is used to for Advanced Color Correction. The Interactive section is used to add Hyperlinks and Rollovers to selected slices (Indicated by Red Box).

     Now that we got the basics of the Web page out of the way, we have the "Image Slicing" section. Here we can save, load, and delete pre-created slices or we can use either the Knife or the Vertical and Horizontal tools to slice up your image. The Knife makes custom slices, use the Left mouse click to create vertical slices and Right mouse click to create horizontal slices. Once you have sliced your image to pieces, use the Arrow to select your individual slices to assign its Interactive properties, and at any point you can select and move your slices around to fit better.

 

Copyright © 2008 Supporting Computers Inc. All rights reserved except for images provided by independent artists and photographers.