Discussion on:
View:
Show:
I found the png file type to be the clearest.I think that when magazines ship their magazine to the printer it's in the PDF format.
In PS CS3, go to File, then "save for web and devices".
Use the window that pops up to find a happy balance between quality and file size, then save.
Use the window that pops up to find a happy balance between quality and file size, then save.
And a lot of it stays in that format all the way to the digital press (or digital plate setter).
1) PDFs encapsulate image and textual data all into one file. Generally the best type of images to put into it are tiff files. PNG fail as they don't support CMYK.
2) PNGs look better than gifs and jpegs as they're lossless, and are really the only solution for transparency anymore, but they're also large if you use them incorrectly. It's important to pick the best format for the job.
3) magazines generally ship one of three filetypes:
1) Indesign
2) Quark Xpress
3) PDF
PDFs are convenient, but if you want perfect results, you also include the source files, as it may be neccessary to adjust for different equipment (I.E., an image press will respond well to pdfs, and handle most errors without a problem, but a heidelberg QMDI will falter on some transparency issues). For the record on any who want to nitpick, ryobi and heidelberg autoplaters are the same thing.
*IMPORTANT: Do not use save for web for print work, ever.
2) PNGs look better than gifs and jpegs as they're lossless, and are really the only solution for transparency anymore, but they're also large if you use them incorrectly. It's important to pick the best format for the job.
3) magazines generally ship one of three filetypes:
1) Indesign
2) Quark Xpress
3) PDF
PDFs are convenient, but if you want perfect results, you also include the source files, as it may be neccessary to adjust for different equipment (I.E., an image press will respond well to pdfs, and handle most errors without a problem, but a heidelberg QMDI will falter on some transparency issues). For the record on any who want to nitpick, ryobi and heidelberg autoplaters are the same thing.
*IMPORTANT: Do not use save for web for print work, ever.
pls mail me this comment.
I am new on cs3 photoshop
pls mail me some ideas.
how i use photoshop cs3
my email id is groupavm@yahoo.com
I am new on cs3 photoshop
pls mail me some ideas.
how i use photoshop cs3
my email id is groupavm@yahoo.com
Thank you very much for your very clear explanation of basic concepts of image handling..
Very useful article
Keep it up.
Very useful article
Keep it up.
This was very helpful as I use a lot of images for the web. You have equiped me with more wisdom...
Thanks
Thanks
Is "Save For Web & Devices" what's left of it in PS CS3 extended?
Not just compression quality, but color depth can adjust the size of the file. 32-bit, 24-bit, 16-bit, and even 8-bit color can be used on jpgs. Gifs are automatically converted to 8-bit color upon export. The differences are hundreds of colors to millions+.
When trying to decide what to use, think of an 8 count box of crayola crayons. If the graphic is made up of primary colors, go with GIF, PNG preferred. If you are looking at a 64 count box of crayons, go with JPG.
When trying to decide what to use, think of an 8 count box of crayola crayons. If the graphic is made up of primary colors, go with GIF, PNG preferred. If you are looking at a 64 count box of crayons, go with JPG.
Among the variations of the GIF format, not always supported by all graphic authoring tools, are the palette selection.
Think of the standard palette for a GIF with 16 colors (not 16 bit color!) as being a selection of the 16 crayons from a 256 crayon box which let you best approximate any of the 256 crayons in the box. This leaves no room for subtle shades or gradients of any particular color.
16 colors with a chosen palette allows the compression program to choose any 16 of the crayons from the box of 256 to best fit the particular graphic that is being compressed.
This adds a few more bytes to the GIF for the color table, but allows a much better presentation for an image which uses only a few distinct colors, giving you a finer range of shades for those few colors.
In some cases, you can even use a 16 or 256 color GIF in which the individual colors in the palette can be chosen from the full range of 16 or 24 bit colors instead of being limited to the standard 256 colors of 8 bit color. This amounts to custom manufacture your own personal set of 16 or 256 crayons customized just to allow you to best draw this particular image.
Think of the standard palette for a GIF with 16 colors (not 16 bit color!) as being a selection of the 16 crayons from a 256 crayon box which let you best approximate any of the 256 crayons in the box. This leaves no room for subtle shades or gradients of any particular color.
16 colors with a chosen palette allows the compression program to choose any 16 of the crayons from the box of 256 to best fit the particular graphic that is being compressed.
This adds a few more bytes to the GIF for the color table, but allows a much better presentation for an image which uses only a few distinct colors, giving you a finer range of shades for those few colors.
In some cases, you can even use a 16 or 256 color GIF in which the individual colors in the palette can be chosen from the full range of 16 or 24 bit colors instead of being limited to the standard 256 colors of 8 bit color. This amounts to custom manufacture your own personal set of 16 or 256 crayons customized just to allow you to best draw this particular image.
Imageready got folded into Photoshop, and since Adobe acquired Macromedia, apparently Fireworks is gone too (that was M's web-graphics knock-off of Photoshop). The landscape is always shifting....
Still exists, and is in production. They split half of image ready's functionality to Photoshop, and recommend using fireworks for the other half.
Imageready was integrated into Photoshop CS3 Extended. You can still create Animations and compress as you used to be able to, it's just not as clear-cut as it used to be with ImageReady.
Nice information, thanks!
Thank you, I've recently been hooked up with Photoshop and this came at the right time!
Is there any reason not to use PNG files if you need various levels of transparency? I know the file size is a little larger but it seems to be vital if you're using a logo in front of a background image (unless you include that secion of the background in the foreground image... this only works if the image will be in the exact same location all the time). Are there any concerns I should be aware of (browsers not supporting png, for example)? Thanks.
Png's with alpha transparency will only work in IE7. There are some fixes but i never got any that worked...
That's the same reason I am avoiding PNG at the moment. The idea of having a transparent background on a JPEG is good but only if it works universally.
1) Only reason not to use PNGs is they get huge. Small alpha images, icons and the like are fine.
2) IE 6 is a non-issue as it's been deprecated. If someone is still on it, that's their problem.
If you really want to fix this, append the following markup to your containing object:
style="background-color: red; style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader (src='image.png', sizing Method='scale');"
-- example image
Note: this also works if you want to use a .NET image control, _
2) IE 6 is a non-issue as it's been deprecated. If someone is still on it, that's their problem.
If you really want to fix this, append the following markup to your containing object:
style="background-color: red; style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader (src='image.png', sizing Method='scale');"
-- example image
Note: this also works if you want to use a .NET image control, _
The save for web tool is also available in Photoshop Elements versions 3 and later, if you don't want to pay for CS. Also, Irfanview will allow you to compress and/or resize photos for the web and it handles and converts just about any image file type. Irfanview is a free download.
I've used Fireworks for years and I think is one of the best when it's about compressing Image files to publish on the web, it has had that 'web tool' of CS3 for years.. but oh well.. now they all belong to the same company.. also there's plenty of freeware sw that do this job really simple (for those who dont care about perfection on the detail), specially for photos (digital ones).. I use PixResizer.. it gives you plenty of choices on what format you want to compress or reduce your image to.
Cheers
Cheers
John Lee. Great. Well spoken and easy to follow. Thank you. Keep these tips a com'n! Rather "mini-turorials". I use CS3 and it's more powerful than a speeding locomotive and I'm in an open boxcar a mile down from the engine with no clue. Can you go over the layers again? You know, putting your client in front of nationl monument with a catch phrase (I know; Real Estate agents and their buy the Brooklyn Bridge thing, sheesh). Thanks again! Linda McFadden
How tautologically obnoxious this Mark Kaelin is when he panders his knowledge as useful. This is a perfect example. He appears to go into detail regarding the quality of a Web page graphic without even mentioning the resolution as the first consideration. After avoiding the meat (and he doesn't look like he would normally), he goes right for the potatoes using plenty of sour cream to make it look appealing and complete, but misses an opportunity to be a truly informative resource by not even mentioning the word "lossy" in regard to JPG, or the PNG file format at all. Of course, if you came to this forum for valuable information, relying on this writer's "knowledge" to enlighten you, and you, in fact, purchased a $500 graphics app for manipulating Web graphics without even knowing about resolution or PNG, than you deserve what you get.
Huh! The title of the article that I read was "How do I....Compress a GIF or a JPEG graphic in Photoshop CS3?", not "Everything you should know about graphics on the web."
I'd be interested in reading any article that you have written with a title along the lines of the latter. Please give me a link to it so that I may learn more about web graphics. I certainly didn't click the link that I received in my email thinking that, after reading the article, I would know all there is to know. If you know so much about the subject, please pass your knowledge along to those who need it. You could probably make some money doing it.
Not everyone that wants to learn about a subject can just jump right in to learn everything immediately. Some need to learn a bit, work with it themselves, and then learn some more.
Mr. Kaelin, please continue to write your informational articles, there are those of us that appreciate, and learn from them.
I'd be interested in reading any article that you have written with a title along the lines of the latter. Please give me a link to it so that I may learn more about web graphics. I certainly didn't click the link that I received in my email thinking that, after reading the article, I would know all there is to know. If you know so much about the subject, please pass your knowledge along to those who need it. You could probably make some money doing it.
Not everyone that wants to learn about a subject can just jump right in to learn everything immediately. Some need to learn a bit, work with it themselves, and then learn some more.
Mr. Kaelin, please continue to write your informational articles, there are those of us that appreciate, and learn from them.
Lossy/lossless isn't related to "resolution" (either ppi or pixel dimensions). The main point of the article is that images with continuous color are suited to jpeg, images with flat color and sharp edges are suited to gif. Keeping an image 100ppi and at the pixel dimensions required by the web page, isn't relevant (or rocket science) - nor, for that matter, is the fact that jpeg is lossy and gif is lossless. Knowing a bit about how one removes high frequencies, and the other uses redundancy, would be interesting, but hardly essential.
Hey Rambrandt1234, I still understood the point of the article even without a technical explanation of JPEG lossiness.
I was a product manager for Adobe for several years, have been a Photoshop user since Adobe acquired the product and I **still** didn't know this four-up trick.
So, chill.
I was a product manager for Adobe for several years, have been a Photoshop user since Adobe acquired the product and I **still** didn't know this four-up trick.
So, chill.
Keep in mind who he's talking to here. If you start throwing out print and rendering terms, people get glossy eyed. It's not useful at all, but it's basics for low end people.
That said, resolution doesn't matter on the web, as you're going to murder it to begin with. So long as you start at 72dpi, you're fine, and even then, still doesn't make more than a few pixel's difference.
That said, resolution doesn't matter on the web, as you're going to murder it to begin with. So long as you start at 72dpi, you're fine, and even then, still doesn't make more than a few pixel's difference.
First, I want to make it clear I did NOT write this article. I am merely your humble host.
John Lee wrote this How do I for us. He is a professional artist and knows what he is talking about.
The point of the How do I is to show members how to do a particular thing in about 1000 words or so -- some details have to be sacrificed for readability.
I cannot fathom what you find obnoxious, but to each his own.
John Lee wrote this How do I for us. He is a professional artist and knows what he is talking about.
The point of the How do I is to show members how to do a particular thing in about 1000 words or so -- some details have to be sacrificed for readability.
I cannot fathom what you find obnoxious, but to each his own.
Thank you for understanding and appreciating what we are doing here. I am not sure what has rambrandy1234 so upset, but I do enjoy his use of big words.
Mr. Kaelin,
Thanks very much for the information!
It's concise, and on target for a specific item. One I just happened to need. We're starting up a web site for our small retail business, so graphics are a fairly new thing for us. I compressed a few images that I was having issues with, following the instructions, and it worked great!
Thanks again.
Thanks very much for the information!
It's concise, and on target for a specific item. One I just happened to need. We're starting up a web site for our small retail business, so graphics are a fairly new thing for us. I compressed a few images that I was having issues with, following the instructions, and it worked great!
Thanks again.
Maybe he hates Mr. Peabody.
The way the web site's headers are laid out, it does appear at first glance that the hosts are the authors of TechRepublic's content.
The way the web site's headers are laid out, it does appear at first glance that the hosts are the authors of TechRepublic's content.
A 50% compression setting is referenced; see this excellent article that points out if you're going to do it at about that level, at least make it 51%. http://www.smashingmagazine.com/2009/07/01/clever-jpeg-optimization-techniques/
- Keyboard Shortcuts:
- Prev
- Next
- Toggle
