Post by Dr. Althea Lannsman on Jan 6, 2008 16:42:44 GMT -5
Saving images for the web in Photoshop CS2
Photoshop has a convenient built in tool that allows you to save your images for the web with ease. It is called “Save for Web…” it is located in the File menu.
1) When you open a new document in Photoshop (ctrl+N or apple+N on a Mac) it asks you the size and the resolution. In the case of making avatars and signatures, I like to set up my document in the actual size it’s going to be. In this case I’m making a signature. My document will be 550 pixels by 150 pixels. (The largest allowed by TSOM). When creating images that are for the web or computer screens the resolution is ALWAYS 72 dpi. Set your image to be 550 X 150 @ 72 dpi. Click ok, or press enter.
Note: If you work big and then shrink down your image (or vice versa) you will loose image quality and you can pretty much guarantee it will look horrible. So don’t to it!
2) Be as creative as you like and create your signature. There are plenty of Photoshop tutorials out there showing you cool special effects. I recommend www.tutorialzied.com for tips and tricks on making your signature pretty.
3) Do not merge your layers. When you are happy with it, save it as a *.psd (Photoshop file). (ctrl+S or apple+S on a Mac) This is not the image that will be used as your signature. This is just your “rough work” sort of speak. Personally, I like to keep layered Photoshop files of all my digital work in case I want to go back and edit something later on.
4) Now you are ready to save it for the Web. Go to File >> Save for Web… You will get a pop-up box containing your signature and some options along the side. Click the 2-up tab. You will be able to see your original signature and the Web-Optimized one next to it. Select “JPEG High” from the drop down box and set the quality for 60%. Note the difference in file size between your original signature and the optimized one. Huge difference isn’t it? You will also notice that you hardly loose any image quality @ 60%. If you find it looks bad, you can increase the quality up to 80%. Keep an eye on how big your file size is, however. The maximum allowed for TSOM site is 75 Kb, so don’t go past that. When you have found the sweet spot between quality and file size click save.
5) Save your image as a *.jpg and you are ready to upload it to your image hosting site of your choice!
This image started out as 242 Kb, now after saving it for web, it is only 24 Kb and it still looks good.
Photoshop has a convenient built in tool that allows you to save your images for the web with ease. It is called “Save for Web…” it is located in the File menu.
1) When you open a new document in Photoshop (ctrl+N or apple+N on a Mac) it asks you the size and the resolution. In the case of making avatars and signatures, I like to set up my document in the actual size it’s going to be. In this case I’m making a signature. My document will be 550 pixels by 150 pixels. (The largest allowed by TSOM). When creating images that are for the web or computer screens the resolution is ALWAYS 72 dpi. Set your image to be 550 X 150 @ 72 dpi. Click ok, or press enter.
Note: If you work big and then shrink down your image (or vice versa) you will loose image quality and you can pretty much guarantee it will look horrible. So don’t to it!
2) Be as creative as you like and create your signature. There are plenty of Photoshop tutorials out there showing you cool special effects. I recommend www.tutorialzied.com for tips and tricks on making your signature pretty.
3) Do not merge your layers. When you are happy with it, save it as a *.psd (Photoshop file). (ctrl+S or apple+S on a Mac) This is not the image that will be used as your signature. This is just your “rough work” sort of speak. Personally, I like to keep layered Photoshop files of all my digital work in case I want to go back and edit something later on.
4) Now you are ready to save it for the Web. Go to File >> Save for Web… You will get a pop-up box containing your signature and some options along the side. Click the 2-up tab. You will be able to see your original signature and the Web-Optimized one next to it. Select “JPEG High” from the drop down box and set the quality for 60%. Note the difference in file size between your original signature and the optimized one. Huge difference isn’t it? You will also notice that you hardly loose any image quality @ 60%. If you find it looks bad, you can increase the quality up to 80%. Keep an eye on how big your file size is, however. The maximum allowed for TSOM site is 75 Kb, so don’t go past that. When you have found the sweet spot between quality and file size click save.
5) Save your image as a *.jpg and you are ready to upload it to your image hosting site of your choice!
This image started out as 242 Kb, now after saving it for web, it is only 24 Kb and it still looks good.