Logo For Web

   I created a logo using Illustrator CS (Yes - that old).  I exported file to JPEG but my customer wants to use logo for website and needs logo to be transparent for the obvious web needs.  After a little research I found that JPEG can't be transparent and I need to export Illy file to PNG with transparent box checked - I also customed ppi to 600.  It looked good and I tested the file against a couple of backgrounds and it really looked great.  I just sent it to my guy and I am hoping it works for him.  I know next to nothing about creating files for web design.  I've included the following link to show him what I did...

http://www.sitepoint.com/gif-png-jpg-which-one-to-use/

I guess I am looking for reassurance/advice from you guys that are much more versed in this than me.  I don't want to appear to my customer as I don't know what I am doing but detailing what I did using Illy CS did I do the right thing?  Any helpful tips?  I will post his feedback when I receive word.  Much thanks to you guys!

Author	Message Share Topic Printable Version Delicious Digg Facebook Furl Google MySpace Newsvine reddit StumbleUpon Translate Twitter Windows Live Yahoo Bookmarks Topic Search Topic Options Post Reply Create New Topic
papascribble Members Profile Send Private Message Find Members Posts Add to Buddy List VP Senior Member Joined: 26/Sep/2008 Online Status: Offline Posts: 560	Post Options Post Reply Quote papascribble Report Post Quote Reply Topic: Logo For Web Posted: 14/Apr/2012 at 10:59am
	I created a logo using Illustrator CS (Yes - that old). I exported file to JPEG but my customer wants to use logo for website and needs logo to be transparent for the obvious web needs. After a little research I found that JPEG can't be transparent and I need to export Illy file to PNG with transparent box checked - I also customed ppi to 600. It looked good and I tested the file against a couple of backgrounds and it really looked great. I just sent it to my guy and I am hoping it works for him. I know next to nothing about creating files for web design. I've included the following link to show him what I did... http://www.sitepoint.com/gif-png-jpg-which-one-to-use/ I guess I am looking for reassurance/advice from you guys that are much more versed in this than me. I don't want to appear to my customer as I don't know what I am doing but detailing what I did using Illy CS did I do the right thing? Any helpful tips? I will post his feedback when I receive word. Much thanks to you guys!
	"Be Generous with Your Time, Talent and Treasure."

papascribble Members Profile Send Private Message Find Members Posts Add to Buddy List VP Senior Member Joined: 26/Sep/2008 Online Status: Offline Posts: 560	Post Options Post Reply Quote papascribble Report Post Quote Reply Posted: 15/Apr/2012 at 1:47pm
	Can anybody give me any advice?
	"Be Generous with Your Time, Talent and Treasure."

The Fan Members Profile Send Private Message Find Members Posts Visit Members Homepage Add to Buddy List Senior Member Joined: 01/Feb/2007 Location: United States Online Status: Offline Posts: 371	Post Options Post Reply Quote The Fan Report Post Quote Reply Posted: 15/Apr/2012 at 10:26pm
	gif is ideal if you are using solid color and I have found that PNG is good for if you have effects like drop shadows, etc. I do know that you only need 72dpi for the end result. To see which result is better, I may go with the Save for Web feature which is reliable or just export as a JPEG. 600ppi may be too high or unnecessary but if it works then don't beat your head over it.
	Ken Laas \| Freelance Graphic Designer Sketchpad Graphics

The Fan Members Profile Send Private Message Find Members Posts Visit Members Homepage Add to Buddy List Senior Member Joined: 01/Feb/2007 Location: United States Online Status: Offline Posts: 371	Post Options Post Reply Quote The Fan Report Post Quote Reply Posted: 15/Apr/2012 at 10:28pm
	Case in point, I know that I have seen facebook timeline covers are about 315x815 (pixels) at 300dpi. So going higher isn't needed generally but then again FB is a whole different animal.
	Ken Laas \| Freelance Graphic Designer Sketchpad Graphics

papascribble Members Profile Send Private Message Find Members Posts Add to Buddy List VP Senior Member Joined: 26/Sep/2008 Online Status: Offline Posts: 560	Post Options Post Reply Quote papascribble Report Post Quote Reply Posted: 16/Apr/2012 at 7:41am
	Thanks, Ken. I still have not heard anything from my guy yet but hopefully soon. There were screens & drop shadows on my logo that is why I went png. I went 600 dpi because I find that images usually look much better when scaling down from a larger original. They may be too large. I really appreciate the help. Question: when I sent him the original exported jpegs, I should have "saved for web" - that is why those jpegs were not transparent?
	"Be Generous with Your Time, Talent and Treasure."

JBHoke Members Profile Send Private Message Find Members Posts Add to Buddy List VP Senior Member Joined: 22/Jan/2007 Online Status: Offline Posts: 577	Post Options Post Reply Quote JBHoke Report Post Quote Reply Posted: 16/Apr/2012 at 12:32pm
	Um, just throwing it out there, but everything on the internet displays at 72dpi. Your dpi doesn't matter what you create, only its pixel dimensions, so when it comes to the web, dpi is moot.

The Fan Members Profile Send Private Message Find Members Posts Visit Members Homepage Add to Buddy List Senior Member Joined: 01/Feb/2007 Location: United States Online Status: Offline Posts: 371	Post Options Post Reply Quote The Fan Report Post Quote Reply Posted: 16/Apr/2012 at 9:31pm
	JPEG's are meant for photographic quality. I was probably redundant in my posts but your link you posted explained perfectly. JB your are correct as well--the point I was trying to make it that you don't necessarily have to use a high dpi for the web.
	Ken Laas \| Freelance Graphic Designer Sketchpad Graphics

papascribble Members Profile Send Private Message Find Members Posts Add to Buddy List VP Senior Member Joined: 26/Sep/2008 Online Status: Offline Posts: 560	Post Options Post Reply Quote papascribble Report Post Quote Reply Posted: 17/Apr/2012 at 7:25am
	All great feedback - thanks! Still have not heard from my guy. Hoping no news is good news? Will update... Just heard from my guy and he says that the backgrounds are now black. I am frustrated now. My next step is to go back to my original Illy CS file and start over. Edited by papascribble - 17/Apr/2012 at 8:57am
	"Be Generous with Your Time, Talent and Treasure."

papascribble Members Profile Send Private Message Find Members Posts Add to Buddy List VP Senior Member Joined: 26/Sep/2008 Online Status: Offline Posts: 560	Post Options Post Reply Quote papascribble Report Post Quote Reply Posted: 17/Apr/2012 at 10:15am
	Okay, this is what I did to (hopefully) rectify this issue and provide my customer with logos to upload to his website... 1. Original Illy CS Art EPS file>save for web. 2. Chose PNG-24 (There are drop shadows) & Checked Transparency Box. 3. I changed image size to 200% and saved. I sent to my customer and I am anxiously waiting if he has success. If this does not work for him, what else could I do? Thanks a lot, guys.
	"Be Generous with Your Time, Talent and Treasure."

joshrodgers Members Profile Send Private Message Find Members Posts Add to Buddy List Admin Group Joined: 29/Dec/2006 Online Status: Offline Posts: 385	Post Options Post Reply Quote joshrodgers Report Post Quote Reply Posted: 17/Apr/2012 at 11:22am
	Hey man, You're going way out of your way...I code websites all the time. All I would do is export the graphic using AI's default settings. PNG is definitely the way to go, especially with the shadows and transparency. When sending logos to a client I usually size them to be about the size of a sheet of paper...that way the client can use them on any form of electronic media like cover-sheets, flyers, brochures, and even websites. Every web developer is different, but most try and keep their websites at 1000px...some use 960px, some use 900px, some use 1200px...it just depends on how the site is being developed, the kind of content it has, and what special requests are given by the client, if any. Having said that...just take a stroll through Google...99.9% of websites do not have very big logos...I think the largest one, from the sites I have developed, is 500px wide, and that's only because it's on a splash page (which is like a coming soon page...so there isn't alot of content). I hope this helps. Thanks, Josh Edited by joshrodgers - 17/Apr/2012 at 11:27am


papascribble Members Profile Send Private Message Find Members Posts Add to Buddy List VP Senior Member Joined: 26/Sep/2008 Online Status: Offline Posts: 560	Post Options Post Reply Quote papascribble Report Post Quote Reply Posted: 17/Apr/2012 at 11:35am
	Thanks, Josh - it is appreciated. I am still waiting for my guy's feedback to see if what i did earlier will work... 1. Original Illy CS Art EPS file>save for web. 2. Chose PNG-24 (There are drop shadows) & Checked Transparency Box. 3. I changed image size to 200% and saved. In your opinion, will what I did above work for him?
	"Be Generous with Your Time, Talent and Treasure."

arteephact Members Profile Send Private Message Find Members Posts Add to Buddy List Senior Member Joined: 20/Aug/2010 Online Status: Offline Posts: 231	Post Options Post Reply Quote arteephact Report Post Quote Reply Posted: 17/Apr/2012 at 12:14pm
	The Black Background he is seeing may be dependent on what Graphics Program he is trying to view the .PNG file in as well. Some older versions of Paint Shop Pro show the Transparent areas of PNG files as all black instead of actual transparent. If he is opening it in Photoshop or newer versions of Paint Shop Pro it should show correctly. Another option may be to export to Photoshop PSD format as a flattened layer which may behave better for him and still allow him to resize the image as needed.
	arteephact@aol.com