logo-dw

Go Back   Dreamweaver Club Forums > Graphic Design > Photoshop
Register FAQ Members List Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Display Modes
Old 06-12-2007, 01:57 PM   #1
paispais
paispais's Avatar
 
Join Date: Apr 2007
Location: Barcelona, ES
Posts: 24
Default Font with transparency bg gif

There's a unpopular font I want to use on a site. I'm using photoshop to create the text and placing it on a transparent background so it can be placed on the web page in a <img> tag. I've tried to save it in multiple formats(gif, png) but there's problems with both. With the png image the text looks crisp, excellent and then when viewed in ie the background isn't transparent. The gif image makes the text look jagged along with a white stoke around some parts of each character. Is there a way around this situation? Can I create type in Photoshop using a transparent background that can be viewed in multiple browsers without any problems?
paispais is offline   Reply With Quote
Old 06-13-2007, 04:46 AM   #2
L3XXY
 
Join Date: Jun 2007
Location: Sydney Australia
Posts: 14
Default

Welcome to the world of "It came free with my PC, so it must be good!" IE is a really bad browser, there is no doubt.

I say - Use the .png so you get a nice crisp image with a transparent BG. Go and Download Fire fox 2. People who use IE should be use to seeing white space around transparent images on the net.
If you really want to fix it for those pesky ie users, drop the .png into image ready, save as a .gif (But click on the matte button and select the BG colour of your site, export as optimised 2. This should fix your outline problem & will work in ALL browsers.

Post your site addy and the .png and I will fix it up for you if you like
__________________
I pitty the noob http://www.nextgg.com
L3XXY is offline   Reply With Quote
Old 06-13-2007, 01:03 PM   #3
domedia
Administrator
domedia's Avatar
 
Join Date: Dec 2003
Posts: 9,730
Default

Feel free to use PNG with transparency. Event hough IE does not support alpha channel in PNG's yet, this website explains how you can make this happen with the addition of a javascript.
http://homepage.ntlworld.com/bobosola/pnghowto.htm
domedia is offline   Reply With Quote
Old 06-14-2007, 06:56 PM   #4
paispais
paispais's Avatar
 
Join Date: Apr 2007
Location: Barcelona, ES
Posts: 24
Default

Quote:
Originally Posted by domedia View Post
Feel free to use PNG with transparency. Event hough IE does not support alpha channel in PNG's yet, this website explains how you can make this happen with the addition of a javascript.
http://homepage.ntlworld.com/bobosola/pnghowto.htm
Thank you domedia. This info is very helpful.
paispais is offline   Reply With Quote
Old 06-14-2007, 07:04 PM   #5
paispais
paispais's Avatar
 
Join Date: Apr 2007
Location: Barcelona, ES
Posts: 24
Default

Quote:
Originally Posted by L3XXY View Post
Welcome to the world of "It came free with my PC, so it must be good!" IE is a really bad browser, there is no doubt.

I say - Use the .png so you get a nice crisp image with a transparent BG. Go and Download Fire fox 2. People who use IE should be use to seeing white space around transparent images on the net.
If you really want to fix it for those pesky ie users, drop the .png into image ready, save as a .gif (But click on the matte button and select the BG colour of your site, export as optimised 2. This should fix your outline problem & will work in ALL browsers.

Post your site addy and the .png and I will fix it up for you if you like
I use firefox on a mac. I'll agree with you about ie being a horrible browser, but the majority of the public uses it. Thank you for your advice.
paispais is offline   Reply With Quote
Old 06-14-2007, 07:23 PM   #6
domedia
Administrator
domedia's Avatar
 
Join Date: Dec 2003
Posts: 9,730
Default

Quote:
Originally Posted by paispais View Post
but the majority of the public uses it.
And that is often all that matters.
domedia is offline   Reply With Quote
Old 06-15-2007, 03:15 AM   #7
d a v e
 
Join Date: Feb 2006
Location: finland
Posts: 1,684
Default

if you're using a simple background to set the text against then all you need is a gif. only use a png (unless you mean 8 bit png) if you have a background that has many different colours/gradients
d a v e is offline   Reply With Quote
Old 06-15-2007, 03:48 AM   #8
L3XXY
 
Join Date: Jun 2007
Location: Sydney Australia
Posts: 14
Default

Quote:
Originally Posted by domedia View Post
Feel free to use PNG with transparency. Event hough IE does not support alpha channel in PNG's yet, this website explains how you can make this happen with the addition of a javascript.
http://homepage.ntlworld.com/bobosola/pnghowto.htm

nice mate, cheers
__________________
I pitty the noob http://www.nextgg.com
L3XXY is offline   Reply With Quote
Old 06-18-2007, 08:04 PM   #9
guitardave
 
Join Date: May 2007
Location: Chicago
Posts: 5
Default

There is also this solution to transparent pngs in IE6:
An IE6 bug which causes a great deal of hassle is that it doesn’t support transparent PNG images.
You will need to use a filter which overrides the CSS.
Code:
    * html #image-style {
            background-image: none;
         filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="filename.png", sizingMethod="scale");
            }
guitardave is offline   Reply With Quote
Old 06-18-2007, 08:12 PM   #10
domedia
Administrator
domedia's Avatar
 
Join Date: Dec 2003
Posts: 9,730
Default

Great snippet dave.
Does it do the same as the javascript in the link?

If it does, I guess a one line in CSS is better than having to add another js file to your pages.
domedia is offline   Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 06:11 AM.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Copyright 2006 DreamweaverClub.com