Advertisement

There's no such thing as a stupid question, but they're the easiest to answer.
Login
Search

Advertisement

Web Design & Development Web Design & Development
Search Search
Search for:
Tech Support Guy > > >

Illustrator to HTML


(!)

Randog's Avatar
Randog Randog is offline
Junior Member with 2 posts.
THREAD STARTER
 
Join Date: Jan 2009
Experience: Beginner
30-Jan-2009, 05:45 PM #1
Red face Illustrator to HTML
Hello, Is it possible to use Illustrator CS3 to create a simple signature file to use in your email so that your email address (in your graphic signature) is clickable?

I've read something in this forum about slicing it, but that seemed more for a web page because you end up with several GIF (or other graphic) files that make sense when your are assembling the slices into a table or something.

I'm assuming I'm looking for a single file that I can imbed after an email.

Thanks for any help and yes I am a newbie.
tomdkat's Avatar
Computer Specs
Trusted Advisor with 7,141 posts.
 
Join Date: May 2006
Location: S.F. Bay Area, CA
Experience: Intermediate
30-Jan-2009, 06:41 PM #2
Yep, you can do this as long as the e-mail client you use supports HTML message composition and can attach images in a signature.

It might take some effort on your part to make it work but I think it's possible.

Peace...
Randog's Avatar
Randog Randog is offline
Junior Member with 2 posts.
THREAD STARTER
 
Join Date: Jan 2009
Experience: Beginner
30-Jan-2009, 06:52 PM #3
Well, that's an encouraging start, but now for the real tough question,...how do I do it? With slices? If so, how to I put them together to make 1 file that I can insert after my email?

I think a good example of what I might be trying to do is like if you get an email from some catalog company or something and you can click in the graphic to go to their website or something. Not sure if that's the same thing or not but I just have a simple signature created in Illustrator with an email address that I would like to make clickable. It seems like it should be simple for someone other than me. Hmmmmm....
tomdkat's Avatar
Computer Specs
Trusted Advisor with 7,141 posts.
 
Join Date: May 2006
Location: S.F. Bay Area, CA
Experience: Intermediate
30-Jan-2009, 07:04 PM #4
I can't guide you through each step but at a high level, this is the kind of process you're looking at:
  • Create the signature image using Illustrator. This will be a one-time thing. Once the signature image is created, it's "done" and will remain static. Save it as a GIF or a JPEG and keep the file size as small as possible. It will be a relatively small image (dimensions wise) so there's no need to "slice 'n dice" it.
  • Configure your e-mail client to compose HTML messages. You need to send HTML e-mail in order for the hyperlink to work.
  • Configure your e-mail client to attach the image as the signature. This should be fairly straightforward depending on the e-mail client you're using.
  • The tricky part: getting the hyperlink into the signature. If your e-mail client can accept an HTML signature, it should be easy. Simply code an anchor with the image as a child element (e.g. <a href="http://www.thx.com/"><img src="signature.jpg"></a>) and the signature should be clickable. Since you're dealing with an image, you might have problems with the image not automatically getting attached, etc., but that will depend on the e-mail client you're using.
Try doing some Google searches on "embedding clickable image signatures in e-mail messages" and see if someone has posted a step-by-step guide you can follow.

EDIT: Ok, I just created a signature image as a hyperlink in Outlook Express and it appears to get inserted as a link just fine. I can't test sending the message but it appears to do what is needed.

Peace...

Last edited by tomdkat; 30-Jan-2009 at 07:14 PM..
Eriksrocks's Avatar
Computer Specs
Member with 2,183 posts.
 
Join Date: Aug 2005
Location: Minnesota
Experience: Advanced
01-Feb-2009, 01:53 AM #5
If you have Photoshop as well, it would probably be easiest to drag the illustration in Illustrator over to a new image in Photoshop and then go to File > Save For Web... (or something like that) and export it in a web-optimized file format like GIF. If you don't know what you're doing I imagine that Illustrator could save an overly large image for you.
tomdkat's Avatar
Computer Specs
Trusted Advisor with 7,141 posts.
 
Join Date: May 2006
Location: S.F. Bay Area, CA
Experience: Intermediate
02-Feb-2009, 04:27 PM #6
Great point.

Peace...
Masta Squidge's Avatar
Masta Squidge Masta Squidge is offline
Member with 697 posts.
 
Join Date: Jul 2007
Experience: Intermediate
02-Feb-2009, 04:31 PM #7
BUT what if you want more than one link in the sig?

There are ways to overlay links onto an image using positional requirements, but its much simpler to slice the image into several pieces and use a simple table.

In that case you have say, a row of "links" lets say 4. Then you have a one column, top row that contains the top half of the image, then a second row with 4 columns that contain each of the "link" images using an image link.

Its also possible to do this without using a table as well, but only if the email program will align the images properly only by putting them in order and using a line break to start the next "row" of images one after another.
tomdkat's Avatar
Computer Specs
Trusted Advisor with 7,141 posts.
 
Join Date: May 2006
Location: S.F. Bay Area, CA
Experience: Intermediate
02-Feb-2009, 04:38 PM #8
Quote:
Originally Posted by Masta Squidge View Post
BUT what if you want more than one link in the sig?
In this case, I would go with an image map instead of using a "sliced" image to keep the number of images that have to be maintained as low as possible. If the signature content will be stored on a web server somewhere that will be served "on demand", going with a table and multiple images is something I would consider. If the signature will be used in a traditional POP3 mail client, I would stick with one image and use an image map.

Actually, that's not true. In BOTH cases, I wouldn't use a graphic for a signature at all and would stick with plain text e-mail to minimize getting flagged as spam.

Peace...
As Seen On

BBC, Reader's Digest, PC Magazine, Today Show, Money Magazine
WELCOME TO TECH SUPPORT GUY!

Are you looking for the solution to your computer problem? Join our site today to ask your question. This site is completely free -- paid for by advertisers and donations.

If you're not already familiar with forums, watch our Welcome Guide to get started.


(clock)
THIS THREAD HAS EXPIRED.
Are you having the same problem? We have volunteers ready to answer your question, but first you'll have to join for free. Need help getting started? Check out our Welcome Guide.

Search Tech Support Guy

Find the solution to your
computer problem!




Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools


WELCOME
You Are Using: Server ID
Trusted Website Back to the Top ↑