Start learning with our library of video tutorials taught by experts. Get started
Viewed by members. in countries. members currently watching.
Mordy Golding demonstrates how to be more productive, efficient, and creative by taking advantage of Adobe Illustrator to create pixel-perfect web graphics and interactive Flash content. Illustrator CS4 for the Web investigates the pros and cons of pixel- and vector-based web graphics, demonstrates efficient workflows, and explores the creative options available in Illustrator. Mordy also covers design techniques, such as creating typography that works well on screen, adding reflections, and making Flash animations. He discusses new Illustrator CS4 features, including using multiple artboards, bringing art into Dreamweaver, and utilizing Flash Catalyst. Exercise files accompany the course.
Admittedly, working with the Slice tool can be somewhat of a frustrating experience. Besides struggling to get all of your slices to match up precisely and be just the right size, the slices that you create are really additional objects, which means if you ever really want to go back and change some of your grid settings, you then have to return to the Slice Select tool and readjust all of your slices. And besides in general, I always believe that the computer is there to kind of help you as a designer, not make life more difficult for you. That's why when it comes to slices inside of Illustrator I like to use something called Object-Based Slicing. An Object-Based Slice is really a simple concept. It's simply an attribute that's applied to an existing path. For example, on this document we already created a grid of objects. I can see that by going to my Slices layer and turning that on. In fact, what I will do is turn off all the other layers right now. By the way you can do that by just clicking and dragging straight down across all those particular layers.
And remember that when I created this particular grid I was really careful about using the Transform panel to perfectly size and align each of these shapes as well. And none of them have those strokes so when it comes to the anti-aliasing part of the Illustrator with web graphics everything really fits perfectly with each other. So rather than try to duplicate all that perfection using the Slice tool, I will simply tell Illustrator, hey, all those objects that I created, go ahead and turn them into slices for me. So I will press Command+A on my keyboard or Ctrl+A if you are on a PC to go ahead and select all of my objects. Next, I will go over to the Object menu and I will choose Slice and then I will choose Make. In doing so all my objects now automatically turn into slices. But sure it's a lot faster than working with a Slice tool and drawing out all those other shapes.
But more importantly these slices are now attributes of these rectangles themselves. Which means that at any time if I want to make a change to my grid layout, all I need to do is to select that rectangle and modify its setting. Let me go ahead and deselect everything right there and click on just this one shape. Notice the Transform panel says now the Width is 100 pixels and the Height is 100 pixels. I will set my reference point to the top in the middle. And just as an example, I will go ahead and change the height to 150 pixels instead of 100. Notice that the slice automatically grows and updates. So what's great about working with Object-Based Slices is that once you go ahead and you create your grid and then you turn them into slices. As you modify your grid the slices just seem to update by themselves. What does that mean for you? Well, once you create your slices you never have to back and modify them anymore. So you set your slices up once and then you take the rest of your time and you focus purely on your design.
At any time if you decide that you want to remove a slice from an object, simply go back to the Object menu with that object selected, choose Slice and then choose Release, and that object will no longer be a slice.
There are currently no FAQs about Illustrator CS4 for the Web.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.