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.
As we have said many times before one of the most important things about web graphics, at least the final version that you deliver, is its file size. Now you may look at a certain file size and think it's not too big. For example, with a broadband connection, even downloading a file that several megabytes only takes a short amount of time. However, measuring bandwidth is incredibly important when working in web design and sites that get tons of traffic, things like Google for example or Yahoo, may have so many hits in a certain day that they put restrictions in the file sizes for the ad banners that appear on their website.
Because of that if you are creating an ad banner for a certain company, you may be asked to deliver that web banner at a specific file size or more likely you will be asked not to exceed a certain file size and therein lies the problem. What happens if you are working on a web banner and in order to get to a certain file size you really not happy with the way that your artwork looks? It may take a tremendous amount of time finding just the right settings to find a file size that works for you as well as the visual aspects of that file. One again, Save for Web comes to the rescue. It has certain functionality built in that allows you to dial in an exact file size of what you need and it will automatically try to find the settings to make it fit within that file size.
Let's take a look. I will click on this banner over here. This is the one that 728x90. Since I have now made this the active artboard, if I choose File and then choose Save for Web that ad banner and that ad banner alone appears inside of my dialog box. I have noticed by the way sometimes insides of Save for Web resizing the overall window helps you adjust how that appears inside of the dialog box. This can be especially helpful with ad banners that are always in this wide format. For example, if I choose 4-Up over here I can easily see four different versions of that banner. But let's say I click on this one right over here and I have been told that I need to get file size down to maybe 17K. Right now it set to 24K. Instead of me trying to mess or adjust those particular settings, I will come over here to the Fly-out menu which appears right here on the top right of the dialog box and from that menu I will choose Optimize to File Size.
This brings up a dialog box that lets me dial the exact size I need. So I will type in 17K. I could choose this Start With Current Settings and I could also have Save for Web Auto Select GIF/JPEG, which ever is the one that it feels going to be the best. I will choose OK and automatically Illustrator chose GIF format, came just under 17K and it looks great. I will be honest with you. I actually find it funny that such a useful feature inside of Save for Web is so cleverly hidden inside of that little tiny flyout menu. But the next time that you need it, now you know exactly where it is.
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.