Authentic voices. Remarkable stories. AOL On Originals showcase the passions that make the world a more interesting place.
Go behind the scenes with some of the biggest digital celebrities to see what life is like when the blogging and tweeting stops.
The story of punk rock singer Laura Jane Grace of Against Me! who came out as a woman in 2012, and other members of the trans community whose experiences are woefully underrepresented and misunderstood in the media.
Documentary shorts conceived of and directed by famous actors. Jeff Garlin, Katie Holmes, Alia Shawkat, Judy Greer, and James Purefoy
Park Bench is a new kind of "talking show" straight from the mind of born and bred New Yorker and host, Steve Buscemi.
Digital influencer Justine Ezarik (iJustine) is back. After covering the world of wearable tech last season, iJustine is expanding her coverage this year by profiling the hottest tech trends across the country.
Enter the graceful but competitive world of ballet through the eyes of executive producer, Sarah Jessica Parker. This behind-the-scenes docudrama reveals what it takes to perform on the ultimate stage, the New York City Ballet. Catch NYCB on stage at Lincoln Center.
Nicole Richie brings her unfiltered sense of humor and unique perspective to life in a new series based on her irreverent twitter feed. The show follows the outspoken celebrity as she shares her perspective on style, parenting, relationships and her journey to adulthood.
Explore what it means to be human as we rush head first into the future through the eyes, creativity, and mind of Tiffany Shlain, acclaimed filmmaker and speaker, founder of The Webby Awards, mother, constant pusher of boundaries and one of Newsweek’s “women shaping the 21st Century.”
Gwyneth Paltrow and Tracy Anderson spend time with women who've overcome hardship, injury, and setbacks to triumph in the face of adversity.
Hank Azaria’s touching, humorous, and often enlightening journey from a man who is not even sure he wants to have kids, to a father going through the joys, trials and tribulations of being a dad.
ACTING DISRUPTIVE takes viewers inside the businesses and passion projects of Hollywood’s top celebrities.
Follow Scott Schuman, the Sartorialist, from the streets of NYC to the capitals of Europe on his quest to photograph and document the best in culture and fashion.
Learn about saving GIFs and PNGs in Photoshop in this Adobe Dreamweaver CS3 Essentials training video series.
Tags:adobe,adobe dreamweaver cs3,essentials,gif,photoshop,png,save,total training
Grab video code:
I won't go into a lot of details in Photoshop in this lesson, but you can learn everything you would ever want to know about Photoshop in other Total Training videos. What I will show you is that once you have got that image reduced, you can easily use Photoshop, Save for Web option to optimize this for the Internet. If you are already using Fireworks, you can get to a very similar dialog by choosing File>Export.
One of the cool things about this dialog is that you can view four versions of your image, two versions of your image, the Optimized, or the Original. Let's start with two just so you get an idea of what's going on here.
This is my original image, its 571K in its original TIFF version. If I were to save it as a JPEG, I could quickly get it down to 24K; looks like it's compressed at 50%, but I would lose that transparent background, because JPEG doesn't support transparency. I also would not be using the best format for this image. Because this image only uses a few colors, like most cartoons and logos and other line art, it's going to be best saved as either a GIF or PNG file.
Let's just go to GIF so you can see how this works. Immediately when I get to GIF my transparency comes back, but you can turn that off on a GIF if you want to create a GIF without transparency; just make sure this is checked if you want to preserve transparency.
Notice too that as soon as I chose GIF I got this down to 24K, even without making any other changes. That's because the GIF format only supports 256 colors. So as soon as I chose GIF as the format for this image, I reduced it to 256 colors. But if you look at this image, you realize, there really aren't 256 colors being used in this image; at least not so you would notice. The more I reduce the colors in this image, the smaller I can get the file size.
So let's try taking it down to 64 colors. Now, you see I am using many fewer colors in this image, but the overall look of the image itself hasn't changed that much. But look at this. Now I am down to 16K.
Let me go back to that 4-Up option so we can try a couple of other changes. If I click on this one, now I make it the active image, and I could take this down; its already down to 32, and you see now at 64 colors, I have 16K, at 32 colors, I got down to 13K. Let's select this one and let's go down to 2 colors. I got all the way down to 2K, but look what happened to my image. Okay, too much of a good thing is not a good thing anymore.
So the ultimate thing to keep in mind as you are trying to optimize images for the web is that you want to reduce colors in a GIF or PNG file as much as you can stand and still have the image look as good as possible on the web. So if I look at this one I could say, at 13K, I have limited the colors to 32, but I still have a pretty good looking image, I think I can live with how this one appears. I think 13 K is a reasonable file size for an image like this. But at 2 colors, it's not worth it just to get down to 2K. At 64 colors, I am still making my user download more than they need to because it looks okay to me at 32.
So whichever one you think looks best and you can live with in terms of file size, you should select and make sure its the active one when you are ready to export it. When you are finished with all the settings, just choose Save, and notice now I have the option to save it wherever I want on my hard drive. I am going to go ahead and save it into this Lesson 04 folder. It's song-bird.gif automatically being saved as a GIF now. So it's not going to overwrite or replace my original image. This is another thing I really love about the Save for Web option in Photoshop.
So when I save this, Photoshop closes out of that dialog, saves the copy of that file as a GIF and returns me to my original TIFF image, which we resized at the beginning of this lesson. So let's go ahead and save the resized version, in case we ever want to come back to it and work with the origin version in its new size.
So I am going to choose Save As, and you see now I am saving a copy of my TIFF. I am going to call this song-bird350, just to remind myself this is the one I sized to 350 pixels wide.
Let's close out of that and let's go to Dreamweaver now and set up a page where we can insert this image and see how its going to look in the new GIF format.