transparent backgrounds (webforumz logo)

This is a discussion on "transparent backgrounds (webforumz logo)" within the Graphics and 3D section. This forum, and the thread "transparent backgrounds (webforumz logo) are both part of the Design Your Website category.


 Subscribe in a reader

Go Back   Webforumz.com > Main Forums > Design Your Website > Graphics and 3D
Reload this Page transparent backgrounds (webforumz logo)

Notices
Please Register!
Webforumz.com is an education based community supporting web designers, developers and those who are new and learning. If you are a designer, developer, learning web design or are thinking about a career in web design then you have come to the right place. Register for free now to access more information and to participate in discussion and debate.




Reply
 
LinkBack Thread Tools
  #1  
Old Oct 24th, 2007, 10:33
Reputable Member
Join Date: Oct 2007
Location: UK
Posts: 266
Thanks: 0
Thanked 0 Times in 0 Posts
transparent backgrounds (webforumz logo)
Hi all

Ive noticed on this website the logo (top left) has a transparent background, how is such a clean/crisp picture achieved because when i set background to transparent in photoshop and save it as a jpeg/gif, once i put it on the website its really pixelated.

Thanks
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote

  #2  
Old Oct 24th, 2007, 10:36
Marc's Avatar
Staff Manager

SuperMember
Join Date: Apr 2007
Location: Scotland, UK
Posts: 1,795
Thanks: 0
Thanked 17 Times in 17 Posts
Re: transparent backgrounds (webforumz logo)
Thats because the Webforumz logo is a PNG that supports transparency and it isnt 256 limited to 256 colours like GIF. JPEG doesnt support transparency.
__________________
Marc
Staff Manager - Webforumz.com

Want to be a moderator? PM me.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #3  
Old Oct 24th, 2007, 10:41
Most Reputable Member
Join Date: May 2007
Location: UK
Age: 27
Posts: 1,111
Thanks: 0
Thanked 0 Times in 0 Posts
Re: transparent backgrounds (webforumz logo)
GIF is limited to single colour transparency: either a pixel is 100% transparent, or 100% opaque.

PNG allows alpha channel transparency: a pixel can be partially transparent. This allows for a smooth blend, without aliasing.

You can think of it as "anti-aliasing for transparencies", if you like.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #4  
Old Oct 24th, 2007, 10:42
Marc's Avatar
Staff Manager

SuperMember
Join Date: Apr 2007
Location: Scotland, UK
Posts: 1,795
Thanks: 0
Thanked 17 Times in 17 Posts
Re: transparent backgrounds (webforumz logo)
Also for PNG's to work in IE 6 you need a hack...
__________________
Marc
Staff Manager - Webforumz.com

Want to be a moderator? PM me.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #5  
Old Oct 24th, 2007, 10:54
Most Reputable Member
Join Date: May 2007
Location: UK
Age: 27
Posts: 1,111
Thanks: 0
Thanked 0 Times in 0 Posts
Re: transparent backgrounds (webforumz logo)
Quote:
Originally Posted by Marc View Post
Also for PNG's to work in IE 6 you need a hack...
Not again! It's the second time today.

PNGs work fine in IE6. Really they do.*

* Okay, you need a hack for alpha-transparent PNGs. But if you're not using the transparency, you can use PNGs with no hacks whatsoever.

Even if you are using transparency, the PNG will still display in IE6 -- but with grey bits where there should be transparency.
Last edited by MikeHopley; Oct 24th, 2007 at 10:57.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #6  
Old Oct 24th, 2007, 13:20
Elite Veteran
Join Date: Jan 2007
Location: You know where
Age: 31
Posts: 4,617
Thanks: 0
Thanked 0 Times in 0 Posts
Re: transparent backgrounds (webforumz logo)
Like Mike said, PNG work fine... it's the transparency that causes problems in IE6.

To get the transparent PNG to work on the forum I use the method from the first link in this thread

How to deal with PNG transparency in IE6
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #7  
Old Oct 24th, 2007, 13:50
Most Reputable Member
Join Date: May 2007
Location: UK
Age: 27
Posts: 1,111
Thanks: 0
Thanked 0 Times in 0 Posts
Re: transparent backgrounds (webforumz logo)
Quote:
Originally Posted by karinne View Post
To get the transparent PNG to work on the forum I use the method from the first link in this thread

How to deal with PNG transparency in IE6
That method is good, but it won't work on CSS background images.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #8  
Old Oct 24th, 2007, 13:52
Elite Veteran
Join Date: Jan 2007
Location: You know where
Age: 31
Posts: 4,617
Thanks: 0
Thanked 0 Times in 0 Posts
Re: transparent backgrounds (webforumz logo)
How do you mean? The logo in this forum for instance is showing up through an <img> tag.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #9  
Old Oct 24th, 2007, 13:54
Marc's Avatar
Staff Manager

SuperMember
Join Date: Apr 2007
Location: Scotland, UK
Posts: 1,795
Thanks: 0
Thanked 17 Times in 17 Posts
Re: transparent backgrounds (webforumz logo)
Lol.. Sorry, thats what i mean Mike.. I am in the habit of saying that PNG's dont work in IE 6!!
__________________
Marc
Staff Manager - Webforumz.com

Want to be a moderator? PM me.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #10  
Old Oct 24th, 2007, 14:11
Most Reputable Member
Join Date: May 2007
Location: UK
Age: 27
Posts: 1,111
Thanks: 0
Thanked 0 Times in 0 Posts
Re: transparent backgrounds (webforumz logo)
Quote:
Originally Posted by karinne View Post
How do you mean? The logo in this forum for instance is showing up through an <img> tag.
Yes. An <img> tag is not a CSS background image!

Let's say you want:
  • A CSS background image
  • With alpha transparency
  • Works in IE6
Your hack won't work. This hack will. It's my current favourite IE PNG fix. Maybe you could add it to your list?
Last edited by MikeHopley; Oct 24th, 2007 at 14:14.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #11  
Old Oct 24th, 2007, 14:17
Elite Veteran
Join Date: Jan 2007
Location: You know where
Age: 31
Posts: 4,617
Thanks: 0
Thanked 0 Times in 0 Posts
Re: transparent backgrounds (webforumz logo)
I get it ... I was just pulling your leg

I have had problems with some PNG Transparency hacks in the past and that one was the only one I could ever get working. I haven't seen the one you linked tho and I will be trying it. Thanks.

I have added it to the list.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #12  
Old Oct 24th, 2007, 14:21
Most Reputable Member
Join Date: May 2007
Location: UK
Age: 27
Posts: 1,111
Thanks: 0
Thanked 0 Times in 0 Posts
Re: transparent backgrounds (webforumz logo)
Quote:
Originally Posted by karinne View Post
I get it ... I was just pulling your leg
Evil, evil woman.

Quote:
I have had problems with some PNG Transparency hacks in the past and that one was the only one I could ever get working.
Yes, I've had the same problem. Many of them either don't work, or they do work but have some really annoying gotchas.

The only real limitation on this one is that you can't set the background to repeat (in IE6). Apparently this is a fundamental limitation of the IE filter. You can read all about it here.
Last edited by MikeHopley; Oct 24th, 2007 at 14:24.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #13  
Old Dec 3rd, 2007, 11:40
Reputable Member
Join Date: Oct 2007
Location: UK
Posts: 266
Thanks: 0
Thanked 0 Times in 0 Posts
Re: transparent backgrounds (webforumz logo)
Does anyone have any good tutorials on creating transparent gifs without losing quality?
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #14  
Old Dec 3rd, 2007, 12:33
Elite Veteran
Join Date: Sep 2006
Location: Pink House
Posts: 3,946
Thanks: 0
Thanked 0 Times in 0 Posts
Re: transparent backgrounds (webforumz logo)
What graphics program are you using?

.gif lose quality... png's are crisp and nice!
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #15  
Old Dec 3rd, 2007, 12:55
Reputable Member
Join Date: Oct 2007
Location: UK
Posts: 266
Thanks: 0
Thanked 0 Times in 0 Posts
Re: transparent backgrounds (webforumz logo)
well i use photoshop lchad, but what i want to do is make some nice curved boxes for my website without having to worry about what background its going on to (if you get me)
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #16  
Old Dec 3rd, 2007, 14:06
Elite Veteran
Join Date: Jan 2007
Location: You know where
Age: 31
Posts: 4,617
Thanks: 0
Thanked 0 Times in 0 Posts
Re: transparent backgrounds (webforumz logo)
24ways started up again and there's a an article on Transparent PNGs in Internet Explorer 6
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #17  
Old Dec 3rd, 2007, 15:30
alexgeek's Avatar
Moderator

SuperMember
Join Date: Jul 2007
Location: Webforumz 24/7
Age: 15
Posts: 3,812
Blog Entries: 9
Thanks: 2
Thanked 2 Times in 2 Posts
Re: transparent backgrounds (webforumz logo)
Use pngcrush to cut down the size of the PNGs also.
Last Blog Entry: 3D Chess in your browser! (Mar 14th, 2008)
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
Reply

« Need mac test for PNG on site | Ridge Social »
Thread Tools

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
Trackbacks are On
Pingbacks are On
Refbacks are On

Similar Threads
Thread Thread Starter Forum Replies Last Post
Webforumz Logo Competition JacobHaug Graphics and 3D 3 Jun 17th, 2007 04:17
Webforumz WOTM Logo JacobHaug Graphics and 3D 6 Dec 10th, 2006 03:34