IE7 Transparent PNG Implementation


My name is Sam Fortiner and I’m a developer on the Internet Explorer team here at Microsoft.  I joined the company about a year ago when I was given the opportunity to work on IE.  Since then I’ve worked on several aspects of IE and recently settled down into the layout and display team.  As part of my work in this team, I implemented support for per-pixel alpha in PNGs.

Support for per-pixel alpha in PNGs in IE, or transparent PNGs as I’ll refer to them going forward, has been called many things over the last few years.  You can find places around the web where it was called:

  • A simple bug-fix
  • A missing and promised feature
  • An optional feature per the PNG spec
  • Impossible without a re-write of the display engine in IE
  • Etc. 

As the dev who implemented the support, I can state that it was neither a bug-fix nor did it require a re-write of the display engine.  Instead, it ended up being somewhere in-between the two and required what I would call ‘feature work.’  Implementing transparency support for PNG images required a significant amount of modification to the image decoding and display pipeline in IE along with a significant amount of new functionality added to the PNG decoder. 

The modifications to IE’s image pipeline were required because transparency in IE has historically only included palette based transparency or binary transparency.  The data structures and image formats necessary to pass around more complex transparency information were not available.  Adding this information to the pipeline involved touching how all of the image decoders worked and were displayed.  Additionally, functionality to perform the alpha blending needed to be hooked in.

The PNG decoder itself required a significant amount of work as well.  For example, paletized images with per-index alpha would lose their transparency information and wouldn’t even display in IE.  Progressive display using Adam7 interlacing was only minimally implemented and needed to be fleshed out.  New functionality needed to be added to perform format conversions that previously hadn’t been required.  Addressing these types of issues in the PNG decoder was part of the work that needed to be done to fully support transparent PNGs.

To help validate the feature work I was doing, I frequently referred to the following web pages to check the rendering behavior:

Shortly after checking in the feature, Dave Massy experimented with a couple other tests such as playing a video underneath a transparent PNG.  Overall, transparent PNG support is looking quite solid in IE7, based on our tests.

There are a couple points I feel are worth mentioning before wrapping this posting up.  First, the type of PNG images that IE can render has been improved as a result of the work done.  Previously, paletized PNG images with alpha would not render in IE.  Now, these types of images should render correctly.  Second, it’s worth noting that the AlphaImageLoader should work in IE7 the same way that it worked in previous versions of IE.  The changes necessary to implement transparent PNG support should not have impacted the ability to use this filter in any way.  This should help with backwards-compatibility scenarios.

There are also a couple of limitations worth mentioning:

  • Certain filters may not behave as expected due to how filters are implemented.  Filters work by rendering the content of their attached element to their work surface and then modifying that surface before compositing it to the output surface.  Because of this, alpha blending of a transparent PNG with non-binary transparency may lead to unexpected results.  For example, applying a BasicImage filter with an opacity attribute to an IMG element with a transparent PNG will fill the work surface with the transparent PNG alpha alpha blended with a solid gray background.  The work surface will then be alpha blended at the specified opacity level with whatever is under the filter.
  • MSTime does not support non-binary transparency for PNGs.  This is because MSTime doesn’t understand anything other than binary index-based alpha.  Because of this, transparent PNGs in MSTime elements are expected to continue to render as they do in previous versions of IE.

I’m very interested in providing the most robust transparent PNG implementation possible.  If there are specific scenarios of interest to you or if you know of other test pages that you would like to bring to my attention, please do so by posting a comment below.

– Sam

Comments (147)

  1. Anonymous says:

    Test-URL

    Drag (transparent icons of) apps to download them: http://panic.com/

  2. Anonymous says:

    Alpha fixed in Beta. Time for Gamma :)

    You might make PNG with Gamma equal to native system Gamma match colors of HTML/CSS.

    http://hsivonen.iki.fi/png-gamma/

    Or maybe support MNG, if you feel creative? :)

  3. Anonymous says:

    I’ve got a few questions…

    * Your description of your work suggests that you are not using the PNG image support in GDI+. Beside the fact that IE predates GDI+, is there a fundamental reason for this (e.g. performance considerations, or special requirements for image rendering in IE), or is it possible, in your opinion, that IE will someday start to use GDI+?

    * "MSTime doesn’t understand anything other than binary index-based alpha" — It looks like the previous situation in the rest of IE. Is there a special reason for excluding MSTime, or do you consider implementing it now? (I ask this out of curiosity, I’m not asking specially for it).

    * Is it possible that your work will be used for CSS transparency? Other parts of the CSS support in IE?

    * Can you talk about the impact on performances, now that it is done?

    And thank you for implementing it, of course!

  4. Anonymous says:

    Great work, I really can’t think of any PNG suggestions.

    Would it be possible to implement full MNG and SVG support into IE?

  5. Anonymous says:

    First off good job Sam, this will be well recieved.

    Second, considering this didn’t require a complete re-write, as you put it, would it be possible to perhaps release PNG alpha-transpancy as a patch to other versions of IE, notably 6 and 5.5? (Assuming of course that IE7 isn’t released as a manditory patch as it is.)

    This would help us devs in a large way, knowing that more of our audience could take advantage of PNG.

  6. Anonymous says:

    It is (1) wonderful to hear that this got implemented, and (2) wonderful to see such a detailed and informative blog entry about it.

    Congratulations, and thank you very much!

  7. Anonymous says:

    I’m guessing that IE7 will be released on WindowsUpdate. It would be a very effective way to rapidly get everyone on the same version. Otherwise we’ll have to hold off using the new features in IE7 for several years while people upgrade.

  8. Anonymous says:

    I have some web pages with PNG’s loaded using the AlphaImageLoader filter, everything seems to work ok until I view them on a display with the DPI set to say 120. With the DPI set to 120 the PNG displays with an ugly black background. I also have the MSN premium client on my machine which seems to render the PNG files ok when the DPI is set to 120 (although the PNG’s are still the "original" size and not scaled up with the rest of the items on the screen).

  9. Anonymous says:

    Sam, thank you truly for these good news and this enlightening post.

    Seeing this kind of posts actually gives me much hope that IE7 *could* be on par with the current bests, with some luck.

    Now, because i’m after all part of the MSIE Basha Crew ©:

    1- Do you plan on implementing Gamma-correction into PNGs?

    2- Will the HTML support be completed (there are quite a lot of tags missing)?

    3- Will IE7 support and handle XHTML at least up to 1.1, with the correct MIME types and behaviours?

    4- Will IE7 stop switching to quirks when I feed it a XML prologue?

    5- Will IE7 render Acid2 when in standard mode? (aka will it be fully CSS2 compliant)

    6- Last, but not the least, will IE7 be avaible on Windows 2000 (come on, guys)

  10. Anonymous says:

    Sam,

    Does PNG support work with https:// URI’s? AlphaImageLoader is currently broken with when served up via SSL.

  11. Anonymous says:

    Some very cool PNG demos there… Fascinating.

  12. Anonymous says:

    In <a href="http://blogs.msdn.com/ie/archive/2005/4/22.aspx">Chris Wilson’s last post</a> he stated that <em>"We’ve actually had this on our radar for a long time, and have had it supported in the code for a while now."</em>

    Does "a while" mean just the past few months?

  13. Anonymous says:

    Firstly, thank you so very, very much for implementing proper PNG support in the last remaining major browser – web developers all over the world will be breathing a sigh of relief!

    However, I have a comment and a question:

    The comment is about gamma-correction on PNGs – despite the various requests above to implement gamma-correction on PNGs, I would urge you *not* to implement it – at least, not unless you can gamma-correct everything else on the webpage as well. For more information, read "The Sad Story of PNG Gamma ‘Correction’", http://hsivonen.iki.fi/png-gamma/ (written by a Mozilla contributor)

    As for the question, does per-pixel alpha work for images loaded with the "background-image" css attribute? For example, if I have ‘<div style="width: 100px; height: 100px; background: url(example-image-with-alpha.png) #FF0;"></div>’ will the image be properly composited against yellow?

  14. Anonymous says:

    Thank you very much. This will have a big impact on the Web.

  15. Anonymous says:

    Do not add MNG or SVG (even Tiny), as suggested by Shining Arcanine. Both are examples of unnecessary bloat and security concerns diverting resources away from UI, purely at the whim of whiny ‘experimental’ webmasters.

    UI is everything. If the IE7 UI is compelling enough, then once the autoupdate is pushed out making itself the default browser, most switchers will have no reason to change back to Firefox. Rendering is irrelevant if it is "good enough".

  16. Anonymous says:

    Sounds great. I know web designers have been crying for a correct per-pixel alpha implementation for several years now. We’ll finally have an IE that isn’t lagging behind Firefox in png support, and a lot of people are going to be very happy about this!

  17. Anonymous says:

    Chloe: People won’t switch browser just because some update does what it shouldn’t and changes their default browser. They’ll use the browser that still has all their buttons in the same place and their bookmarks saved the way they left them.

    In a more general sense, I don’t think the internet’s ‘power users’ are going to even think about switching back to Internet Explorer until there is more capable CSS support and higher degree of compliance to the proper standards. This is a good start, however. :)

  18. Anonymous says:

    QUOTE: ‘UI is everything. If the IE7 UI is compelling enough, then once the autoupdate is pushed out making itself the default browser, most switchers will have no reason to change back to Firefox. Rendering is irrelevant if it is "good enough".’

    Partially correct. UI *should* be everything. That’s all a browser is, after all – a user agent nagivating the internet. Unfortunately, for this to be true the rendering component must be generic across all browsers (or, in other words, standard).

    So, if you are such a fan of a great UI, you should be in support of standards now so that the developers of the browser of tomorrow can focus exclusively on the UI.

    As for switching browsers, highly unlikely. A user should have the option of multiple browsers, making their choice based on user-interface features rather than standards support.

  19. Anonymous says:

    Chloe, MNG is required by webmasters who want to have animations with the benefits of PNG and SVG is a vector graphic specification that is necessary if you want to prevent image pixelization when the resolution of a image is increased.

    Both of them would be parsers activated by file extensions which pose no more of a security risk than the GIF or JPEG parsers. SVG is is already avaliable as a third party plugin from adobe and all other major web browsers are implementing support for it. So much for it being experimental.

  20. Anonymous says:

    SVG is huge and it is pure bloat promoted only by the open standards fanatics. There is nothing wrong with Flash.

    There will always be security concerns even in content parsers. Microsoft had security flaws in their image handling. One of the recent Firefox vulnerabilities was invoked by favicons!

  21. Anonymous says:

    @Chloe: "Do not add MNG or SVG (even Tiny), as suggested by Shining Arcanine. Both are examples of unnecessary bloat and security concerns diverting resources away from UI, purely at the whim of whiny ‘experimental’ webmasters."

    Mozilla is working on XBL (still just a W3C proposal I believe) which should allow us to couple SVG to, say, XFORMS so that it would be possible to create new UI widgets. With SVG it should be possible for instance to develop range sliders which can go far beyond what is possible with current (html)form widgets.

    Imagine interactive 3d graphs or circular sliders, which might be more intuitive for certain specific cases.

    Please allow UI designers the use of creative tools to be innovative and create more intuitive, goal-oriented, efficient and powerfull webapplications.

    And Sam, thanks for the post. Most apprciated. The gamma thing worries me though, but I don’t have a good perspective on that subject.

  22. Anonymous says:

    Great article. The only real question I have is that lots of people use a filter hack to emulate transparency. If this hack gets applied in Internet Explorer 7 as well, then something that is intended to have 50% opacity could have 25% opacity (as the 50% would be applied twice).

    The core of the issue here is whether or not any updates will be made that will break CSS hacks. Obviously to break the hacks (i.e. implement selectors and fix parsing bugs) without implementing the rest of CSS would be a disaster for us web developers. But if you don’t break any of the hacks, a lot of people will end up with the wrong opacity because they are catering to Internet Explorer 6 and older with the filter hack.

    > 4- Will IE7 stop switching to quirks when I feed it a XML prologue?

    In my opinion this is correct behaviour. Internet Explorer only handles text/html documents. RFC 2854 states that the only form of XHTML suitable to be labelled as text/html is XHTML 1.0 following the HTML comptability profile. Appendix C of the XHTML 1.0 specification (the compatibility profile) section one states that XML declarations should be avoided.

    By including an XML declaration in a document and sending it to Internet Explorer as text/html, you are going out of spec. – user agents should therefore assume that, since you are not following the specifications, your documents should be subject to the bug compatibility mode rather than the standards compliant mode.

    > MNG is required by webmasters who want to have animations with the benefits of PNG

    APNG is an alternative and is also backwards-compatible with PNG.

    > SVG is a vector graphic specification that is necessary if you want to prevent image pixelization when the resolution of a image is increased.

    It’s also subject to a crazy amount of feature bloat. Did you know that they have added file uploads to the latest SVG drafts? It’s utterly crazy for an image format to have features like this.

    http://www.w3.org/TR/2004/WD-SVG12-20041027/api.html#fileupload

    SVG Tiny is possibly a better choice than full SVG.

    > Both of them would be parsers activated by file extensions

    The web doesn’t care about file extensions, it cares about media types. That kind of confusion has led to long-standing bugs and security holes in Internet Explorer.

  23. Anonymous says:

    Thank you for finally clearing up all those misconceptions about .png support in IE. I got tired of hearing from people that all MS had to do was recompile and link to GDI+ to get it to work. This should finally put them in their place.

  24. Anonymous says:

    Have you looked at PNG’s on top of other PNG’s? Does it work? I can think of some designs that would do this. Typical designers produce photoshop files with tons of layers each with per-pixel alpha. You can bet that someone will write a photoshop exporter as soon as the beta goes public. Hope you’re ready for a real stress test.

    One nice thing would be to also support the XP .ico format within IE. It already has per-pixel alpha.

    – Greg Raiz

    (Former MS XP PM)

  25. Anonymous says:

    > One nice thing would be to also support the XP .ico format within IE.

    > It already has per-pixel alpha.

    Why would you want to add support for a platformspecific (in this case even a specific-version-of-a-platform-specific) format to a by-definition platform-independent system such as the Web? Do you also use .bmp files on your webpages like I sometimes see beginners do?

  26. Anonymous says:

    Next you should make the SELECT no longer be a windowed control. It’s quite annoying that you can’t position elements over it properly.

  27. Anonymous says:

    Sam, do you mean "Transparent PNG Implementation" in HTML or CSS?

  28. Anonymous says:

    @ Chloe : I don’t agree. Flash is just a pain. You need to rely on third party plugin to be able to see a flash movie.

    SVG is built on XML, so you may include plain SVG in an XHTML file, I think it is a real benefit.

  29. Anonymous says:

    Glad to see PNG will be well supported in IE7. No reason for people to complain about it.

    MNG may be the next complaint, so if possible, supporting it would be good.

  30. Anonymous says:

    Speaking about SVG, Opera 8 (http://opera.com/) supports SVG Tiny 😉

  31. Anonymous says:

    Nice work…and thank you guys for a (much) more open communication channel than anything else I’ve ever seen from Microsoft…You deserve much credit for both!

    A slight bit off-topic: is the IE team aiming to make sure that IE7 passes the Acid2 test at http://webstandards.org/act/acid2/ ?

    Just another "benchmark" to aim for–thanks again.

  32. Anonymous says:

    Great news Sam. I have a follow up question. Did you add the alpha bits to the entire rendering pipeline or only to the image decoders. I would love to see rgba() and hsla() support in IE7 as well.

  33. Anonymous says:

    1- Do you plan on implementing Gamma-correction into PNGs?

    I second that.

    2- Will the HTML support be completed (there are quite a lot of tags missing)?

    Not really a lot. I only know about abbr and object. But IE definately need to correct its support of the object element. The current implementation is not usable.

    3- Will IE7 support and handle XHTML at least up to 1.1, with the correct MIME types and behaviours?

    Definately. Can’t support application/xhtml+xml means can’t support XHTML correctly.

    4- Will IE7 stop switching to quirks when I feed it a XML prologue?

    Yup, that’s stupid.

    5- Will IE7 render Acid2 when in standard mode? (aka will it be fully CSS2 compliant)

    I don’t think so. There are only a few months left.

    6- Last, but not the least, will IE7 be avaible on Windows 2000 (come on, guys)

    Definately not. Be serious: switch to <a href="http://spreadfirefox.com/community/?q=affiliates&id=83&t=85">Firefox</a&gt;. 😉

  34. Anonymous says:

    Fantastic news – and thankyou for the explanation about what had to be done to implement it.

    I don’t hold up too much hope for major improvements in IE7 – the timescale is too small and the codebase is likely to be too antiquated.

    Maybe IE8 will see a big step up, but these incremental steps in IE7 will help a lot.

  35. Anonymous says:

    Anybody that got beyond the second paragraph is a real geek. It’s amazing how implementation details excite geeks.

  36. Anonymous says:

    Says the person commenting on a web browser development blog 😉 It’s all relative.

  37. Anonymous says:

    Well done. It’s also interesting to see a little bit of background given as to what refactoring was required.

    I particularly hope that the IE team will do likewise in giving a bit of background to their refactoring for some of the CSS issues as they get tackled, particularly the bug fixes mentioned in the previous post which have always seemed bizarre!

  38. Anonymous says:

    First, I wanted to thank everyone who has posted a comment. I appreciate it!

    Before I answer specific questions, I wanted to get a few general responses out of the way:

    – Gamma correction – The implementation of transparent PNG support was not intended to change gamma correction. Any work on gamma correction would be treated as a separate feature and thus I can’t comment on it beyond this.

    – Non-transparent PNG feature questions – I will not be responding to off-topic questions/comments posted under this topic. For the purpose of this post, this will include anything that doesn’t directly have to do with PNG images and transparency. However, I’d encourage you to post your feedback on the IE Channel 9 Wiki (http://channel9.msdn.com/wiki/default.aspx/Channel9.InternetExplorerFeedback).

    – Downlevel support – There are currently no plans to bring to bring this feature downlevel to previous versions of IE.

    WebMac, panic.com works after modifying the script to use the pngs instead of gifs when the web browser is IE.

    porneL, MNG support is outside the scope of transparent PNG work so I won’t be able to respond to this.

    Lionel Fourquaux:

    – The implementation doesn’t use GDI+. If IE will use GDI+ someday is unknown.

    – There are technical challenges around updating MSTime to have this functionality and we feel that it is better that we focus our efforts on other more important work and requests.

    – The work with transparent PNG doesn’t overlap much with the work necessary to implement CSS transparency.

    – Regarding performance . . . first, it’s important to understand that any image with transparency is more expensive than an image without transparency. This cost is measurable in both memory requirements and drawing speed. Regarding memory requirements, images with transparency typically require more memory as they need to retain the transparency information along with the color information. Regarding drawing speed, alpha blending is a computationally expensive operation when compared to simply copying an image. If your webpage doesn’t use any PNGs with transparency, then there is no measurable difference between versions of IE with vs. without support for transparent PNGs. If your webpage does use images with transparency, then the performance difference will depend on how many of those images are present, what size they are, and how they are drawn. These are the same factors that one must take into consideration when working with any image. With that said, I haven’t seen any performance issues specific to transparent PNGs that would significantly impact their usability under common scenarios.

    Ripter, I haven’t seen any issues with black backgrounds caused by switching to a 120 DPI. If you want to post a specific example, I’ll test it on IE7 and see if any issues come up.

    Nico, the page you listed requires fixed positioning to work properly. The PNG image itself renders correctly.

    Masklinn, see my comments at the start of this reply.

    Adam Hill, native transparent PNG support in IE7 works thru SSL.

    Neil Cadsawan, transparent PNG support has been implemented for a few months. It was not implemented before XPSP2 shipped if that is what you’re wondering about.

    Tim Allen, transparent PNGs specified via background-image in IE7 are correctly alpha blended against the background color.

    Jim, the AlphaImageLoader filter should work as before. This is what has been used to enable transparent PNG support in IE in the past. The BasicImage filter should continue to work as expected on any image with binary transparency. I don’t know of any issues with existing CSS hacks for transparent PNG support not working in IE7 as well.

    Greg Raiz, overlapping transparent PNGs work correctly. One of the pages listed as a test page demonstrates that very behavior.

    Aukcje, transparent PNG in this post is referring to the ability to alpha blend an image with what is underneath it, based on per-pixel alpha values. It is neither a HTML nor a CSS feature.

    Vitaly Harisov, the page you mentioned requires fixed positioning for the diver to be properly positioned. I modified the CSS to serve PNGs instead of GIFs to IE and all of the PNGs were correctly alpha blending.

    Erik Arvidsson, the work I did was just to add alpha to the image pipeline.

    Thanks again for all your comments!

    -Sam

  39. Anonymous says:

    I’m glad to hear somebody is fully commited to proper and extensive PNG support. I was afraid it was going to be a project some random IE developer was going to do, and when it worked "good enough" the project would be done.

    I’m glad every possible scenario is being tested and looked into such as PNG over video, (over flash too? and other major plugins) and the rarely used IE filters.

  40. Anonymous says:

    Travis,

    Thanks for your post. I wanted to bring out that all of the work in IE7 is being done by developers who committed to their features. Each one of them is going thru the same type of extensive problem exploration and testing that I’ve gone thru with a big focus on the quality of our work. I think that the results of that focus will be visible to you when have a chance to see IE7 in action.

    -Sam

  41. Anonymous says:

    Good luck with the thing.

  42. Anonymous says:

    Awesome news. This will have a dramatic positive effect on web developers in the near future.

    <i>Nico, the page you listed requires fixed positioning to work properly. The PNG image itself renders correctly.</i>

    <i>Vitaly Harisov, the page you mentioned requires fixed positioning for the diver to be properly positioned. I modified the CSS to serve PNGs instead of GIFs to IE and all of the PNGs were correctly alpha blending.</i>

    Does that mean the IE7 won’t support fixed positioning? :(

  43. Anonymous says:

    Perhaps being a bit hopeful here, but would this support allow you to have a transparency effect when using hosting the web browser control in a layered window? ie, Ive been wanting to use the web browser control in a non-rectangle window with alpha etc, but this doesn’t seem possible. It would be great if you could set the background image for the page to a alpha png and have the control itself blend with the windows behind it (in a layered window of course).

  44. Anonymous says:

    Outstanding work Sam! Looking forward to seeing more detailed posts from developers working on other features.

  45. Anonymous says:

    >> 2- Will the HTML support be completed (there are quite a lot of tags missing)?

    > Not really a lot. I only know about abbr and object. But IE definately need to correct its support of the object element. The current implementation is not usable.

    Tables’s CAPTION element also isn’t handled by MSIE, and I’m sure you can find some more easily.

    BTW, would the ability to use & display the <title> element in a page be considered a markup or a CSS problem? (I guess the way it’s implemented in MSIE would decide on that one)

    >> 6- Last, but not the least, will IE7 be avaible on Windows 2000 (come on, guys)

    > Definately not. Be serious: switch to <a href="http://spreadfirefox.com/community/?q=affiliates&id=83&t=85">Firefox</a&gt;. 😉

    I’m not asking for a surfing browser, but I’ll be really annoyed when I won’t be able to check my page’s renderings under IE7

  46. Anonymous says:

    Great news, thank you!

  47. Anonymous says:

    I just wanted to say that stuff like this is why I bookmarked this blog. Haven’t seen much of it so far, but this gives me a bit of hope (for the web, for this blog as a useful and open communication medium, etc…) :) Thanks for the hard work.

  48. Anonymous says:

    "Vitaly Harisov, the page you mentioned requires fixed positioning for the diver to be properly positioned. I modified the CSS to serve PNGs instead of GIFs to IE and all of the PNGs were correctly alpha blending."

    Hmmmm… So fixed positionning will not be implemented in IE 7 ?

  49. Anonymous says:

    Sam,

    Thanks for your work on getting this implemented in IE7. Also, thanks for clarifying what "a while" meant in the previous post on PNG transparency handling. It made it seem like this capability has been around for a much longer time, but simply wasn’t included in any updates and has been sitting around.

  50. Anonymous says:

    Please make sure that the seminal PNG test page renders properly at:

    http://www.libpng.org/pub/png/pngs-img.html

  51. Anonymous says:

    Sam,

    Good work, this is how I believe the IE blog is supposed to run.

    Great information, good dialog with other posters.

    Thanks for everything

  52. Anonymous says:

    > As for switching browsers, highly unlikely. A user should have the option of multiple browsers, making their choice based on user-interface features rather than standards support.

    Totally agree with this! It’s great that you guys/gals are listening and being so open about this. Maybe next you need a bug-tracking system like bugzilla 😉

  53. Anonymous says:

    Andrew and FlorentG, I mentioned the fixed elements because they don’t show up for those browsing with IE6 and most people aren’t aware that they’re even there. I wasn’t intending to imply anything about fixed positioning in IE7. I won’t be saying anything else about it as it’s off-topic for this post.

    Shane, I haven’t tried that myself, but I believe you could do it. I’ll give it a try early next week and let you know what my results are.

    RichB, that was one of the test pages I’ve used and I accidently left that page off the list at the top. Thanks for mentioning it.

    -Sam

  54. linus says:

    Yummy! 8-bits of alpha is going to make the web a tastier place. Many thanks! Any chance you can improve IE’s image scaling while you’re in there? So many pictures on people’s blogs are jaggied down or blocked up because the native size doesn’t make the width/height in the IMG tag. It would be great if you could help them out with a quick bicubic interpolation.

    Thanks,

    Linus

  55. Anonymous says:

    Greetings. Thank you for your work. I look forward to seeing IE7.

    My question relates to the impact on rendering speed. I may be wrong in thinking that this will be an issue, but has the new PNG support had any negative impact on speed? My dhtml games currently display very well on IE6. I am concerned about the possibility of performance drop with changes being made to rendering in IE7.

    If you are interested, please feel free to test IE7 dhtml rendering speed with any of the dhtml games on: http://www.def-logic.com/games.html

    These games are entirely dhtml and consist in moving many gifs around the screen, using image clipping for animation.

    Keep up the good work,

    Brent Silby.

  56. Anonymous says:

    This is good to hear and will save time (skip creating a seperate ie.css that uses filters).

    Can you make comments on "multiple classes" for an element, and if each one of those classes can have it’s positioned background image? This would be very nice for rounded corners or shadows.

    Thank You,

    Elias Asfaw-Kirby

  57. Anonymous says:

    Elias > IE6 can already use multiple class for a single element.

    This basically mean that you use whitespace-separated class identifiers in the class field, such as

    <span class="chocolate walnut"></span>, which would associate my <span> with both the styles from the .chocolate class and the .walnut one.

    Now, both these classes can have different backgrounds, but that doesn’t mean that the element will have both, because the background is the ELEMENT’s background, the class’s CSS styling being only a definition.

    The CSS rules will kick in, and the background associated with the element will be the last defined one (if CSS walnut rules were written after the .chocolate properties, then it’ll use .walnut’s background).

    And this is how it’s supposed to behave.

  58. Anonymous says:

    Agreed with Masklinn.

    And for questions like "[can] each one of those classes have it’s positioned background image?", you can refer to the CSS2.1 recommandation, it will answer everything.

    Don’t ask the IE Team to implement features that are not part of the recommandation. It is more important to fix bugs in the current CSS implementation than introduce break-the-web features.

  59. Anonymous says:

    Usability and user experience must go #1, even in what MS considers corner cases. For these webmasters wanting fancy animation, vectors etc I suggest they look for Avalon.

    The inflexible security zone model must be thought over or vastly improved.

    There are more than 2 types of sites (trusted, internet zone). Currently I have to keep switching the security settings constantly to get experience where web sites work but do not hammer my user experience with Active Scripting.

    I am also very disappointed to how the Information Bar is misleading constantly. If the security settings are set to not allow activex on internet zone and web site has activex, the Information Bar pops and says Press here to install activex (or something like that). When I click the i-bar, it only offers 1 option – to open help! How crappy experience is that! I want to use the information bar to define that for this particular page/path/site/domain I want to allow/download activex, without putting the site to trusted zone where a whole lot of other things are allowed as well which I do not want to allow for this particular site. Its the minimum trust concept. Allow it to run only this activex, perhaps only this time and do not let the activex do any permanent system changes.

  60. Anonymous says:

    "For these webmasters wanting fancy animation, vectors etc I suggest they look for Avalon. "

    Heh. Only Avalon will never be cross-platform.

  61. Anonymous says:

    >> Allow it to run only this activex, perhaps only this time and do not let the activex do any permanent system changes.

    And first and foremost remove from ActiveX implementation everything that shouldn’t be handled by ActiveX in the first place (<object> and XMLHttpRequest come to mind)

  62. Anonymous says:

    "It would be great if you could set the background image for the page to a alpha png and have the control itself blend with the windows behind it (in a layered window of course)."

    Although Sam said that he thought this was possible, I think it’s not:

    * When a background image contains transparency, what shows through is the background color.

    * IE currently only supports solid background colors.

    * Erik Arvidsson inquired about transparent background colors but was told that what was implemented by Sam, at least, only included alpha when rendering images – thusly no transparent colors.

    I welcome these new reports on progress, but I wish there’d be more of them so that you’d be allowed to go into more features.

  63. Anonymous says:

    Thanks Jesper, I guess you are right. It would only make sense to have an alpha channel in the background if the window is a layered window anyway, or rendered on top of something else. It would be nice if the web browser control had a way of setting the background to "none" or otherwise telling it to not render it. I can see how this might be abused or at least lead to confusion if it were to be used in the main IE window, but maybe pages which host the web browser control within might have a use for transparent renderings of the control (ie non-rectangular).

  64. Anonymous says:

    shane, I did some investigation and it appears that Jesper is correct. You can use iframes with the allowtransparency flag to blend transparent PNG images with the parent’s background. However, it doesn’t appear that there’s any way to make the WebBrowser control’s background transparent.

    Brent Silby, I didn’t see any measurable performance cost from transparent PNG with the games.

    Thanks again everyone for your comments.

    -Sam

  65. Anonymous says:

    Wow! Thank you so much!!!!

    Why aren’t there more webdesigners saying thanks? It seems people are quite happy to pour out vitriol on Microsoft for lack of HTML/CSS standards (and yes, I do feel it’s an issue) but why aren’t we more willing to say thanks when something goes RIGHT. Well done, Microsoft.

  66. Anonymous says:

    I saw Firefox at the flicks when I was a kid with my older brother. It was a great movie and I’ve always been a bit of a Clint Eastwood fan. What does this have to do with a great web browser like Internet Explorer though?

    Tee hee!

    Well done sam.. one less thing for ‘them’ to go on and on about!

  67. Anonymous says:

    "Well done sam.. one less thing for ‘them’ to go on and on about!"

    I agree that alpha channel PNG support, while long overdue, is still very welcomed. Thank you, Sam. Thank you, Microsoft. Yet the other part of the above quote saddens me, as a web developer.

    Do people seriously think "we" go on and on about Firefox because it’s open source? I know that when I go on and on about it, it’s because of a competent interface, which IE already has, and because of a competent support for standards, which IE currently hasn’t.

    Until IE catches up – which I hope they do – IE will continue to get crap for its rendering engine. The fact remains that on the whole it’s a much worse rendering engine than most other recent rendering engines because it lacks support for standards that are not even new anymore. CSS2 was introduced 7 years ago, and the only detail I’ve heard about CSS2 in IE officially is that Microsoft isn’t planning full support for it!

    When "we" rag on IE, know that it isn’t because it’s a Microsoft product. It’s because its rendering engine is wildly outdated, and it puts hurdles in the road of people like me who do web design for a living and want to leverage new technologies in all browsers. I for one am willing to switch back to IE come 7 should it be competent enough.

  68. Anonymous says:

    PNG Alpha Transparency in IE55, IE6 is already supported when used in VML (Vector Markup Language Elements).

    Instead of

    <img src="alphatranaparentPNG.png">

    use

    <v:image src="alphatranaparentPNG.png"/>

    With the xmlns and behavior in the html/style sections.

    The URL links to a demo.

    As well as below link.

    http://members.home.nl/cybarber/PNG-IE-VML-SAPI4.htm

    Wim A SLabbekoorn(alias Cybarber)

  69. Anonymous says:

    http://members.home.nl/cybarber/PNGalphaTransparencyIE6expressedByVMLcontainer.htm

    HTML page template:

    <html xmlns:v = "urn:schemas-microsoft-com:vml">

    <head>

    <title>Basic template for PNG alpha transparency expression through VML

    images in IE6</title>

    <style>

    v : * { behavior: url(#default#vml); }

    </style>

    </head>

    <body>

    <v:image src="tincup-rosequartz.png" style="position:absolute; left:25%;

    top:25%; width: 468px; height: 434px"/>

    </body></html>

  70. Anonymous says:

    Oh Yeh,

    Another thing on VML images:

    (would be nice if this would end up natively in IE7 on HTML img.)

    One can set the blacklevel(brightness) and gain (color-hue) and contrast.

    Adding HTML-TIME(SMIL) to the page one can then animate these properties of the image.

    As can be seen on above mentioned PNG demo page.

    William A Slabbekoorn

  71. Anonymous says:

    When in a stylesheet, AlphaImageLoader() will load image from a path that is relative to the *containing html page* – NOT from a path relative to the stylesheet as is normally done with the background-image property!

    That is quite ill, on top of AlphaImageLoader() disabling links when img has certain dimensions…

    Please make sure that the ie7 implementation of png conforms to the standard of image being loaded relative to its stylesheet as well as fixing to other problems concerning image dimensions and links.

    <rant>

    Just scraped half an hour discovering that weird path behavior. Plus some more hours to go for rethinking how png images will be loaded from common stylesheets used on my site. That cumulates to how many zillion hours lost on our small planet?

    </rant>

  72. Anonymous says:

    I am the author of the PNG gamma page that has been referenced in the earlier comments.

    The most important test case on the gamma matter is http://www.libpng.org/pub/png/colorcube/colorcube-pngs-nogamma-CSS.html

    I would be great if you added that test to your regression test suite to make sure CSS colors and colors in unlabeled PNGs continue to match after the modifications to the PNG code.

  73. Anonymous says:

    Hi Sam,

    My name is Hakan Bilgin and I have a couple of questions:

    – Which filters, besides BasicImage, will result in unexpected behaviour attached to PNG’s?

    – Will there be support of SVG? (if not, why and when?)

    – I have noticed that IE doesn’t free up the memory usage of a filter allocates, even though the element/object its attached to is "deleted"/removed dynamically. This should be taken care of. Otherwise, single-page-navigation-pages allocates very much memory fast.

    – A change of css-properties will cause IE to re-download any background-images it has attached to the element, event though the background property isn’t affected. The "event" bubbles to parent elements as well, which causes additional download. I think this has to be fixed soon, obtain a high priority.

    Sincerely,

    Hakan Bilgin

  74. Anonymous says:

    Sam,

    There was an issue using AlphaImageLoader and pNG’s over HTTPS (they didn’t display).

    Is this fixed in IE7, and have you tested the new implementation of PNG’s over https?

    Many thanks

    mark

  75. Anonymous says:

    It’s trivial to prevent spamming like the previous comment, by the way. You just have to count the number of links – virtually no non-spam comment will have more than five, and those that do can split their comment up.

  76. Anonymous says:

    Sam,

    Thanks heaps for checking the improvements against my existing games. I really appreciate the fact that you took the time to do that, and to post a comment back on May 2nd (I’ve only just read it).

    I’m please to hear that there is no performance drop.

    Keep up the good work.

    Cheers,

    Brent Silby.

  77. Anonymous says:

    En kjapp gjennomgang av hvordan man kan lage de moderne skr&#229;b&#229;ndene som mange pryder hjemmesidene sine med n&#229; om dagen.

  78. Anonymous says:

    En kjapp gjennomgang av hvordan man kan lage de moderne skr&#229;b&#229;ndene som mange pryder hjemmesidene sine med n&#229; om dagen.

  79. Anonymous says:

    En kjapp gjennomgang av hvordan man kan lage de moderne skr&#229;b&#229;ndene som mange pryder hjemmesidene sine med n&#229; om dagen.

  80. Anonymous says:

    A few months ago someone at google created something called GoogleX (the original was taken down: mirror…

  81. Anonymous says:

    A few months ago someone at google created something called GoogleX (the original was taken down: mirror…

  82. Anonymous says:

    公開した伏魔殿のコンテンツは、今まで公開した癲狂院と素材工房のコンテンツよりもさらにトリッキーなことをしています。アルファチャンネルPNGを背景画像にして、ページ全体の背景画像が透けるように見せる事…

  83. Anonymous says:

    A few months ago someone at google created something called GoogleX (the original was taken down: mirror…

  84. Today, Microsoft released Internet Explorer 7 Beta 2. I recommend you to download it in order to test…

  85. IE7 was released yesterday. If you’re a web site owner, developer or designer, and find that your site or application is encountering problems, fret not. Here is a list of resources for you: Read the Checklists Download the IE7 Readiness…

  86. IE7 was released yesterday. If you’re a web site owner, developer or designer, and find that your site or application is encountering problems, fret not. Here is a list of resources for you: 1. Checklists 2. Download the IE7…

  87. iDeas wHizz says:

    From now on, we have to test our web application on another version of browser. Source: http://dotnet.csdn.net/n/20061019/96467.html Microsoft IE7已于今日正式发布。微软在网站上公布了开发者和Web制作人员要注意的一些事项。翻译如下: 确认你的程序中关

  88. Microsoft Internet Explorer 7 сега поддържа правилното визуализиране на прозрачни PNG файлове

  89. Afin d’être totalement transparent (et pas que dans les PNG), ce texte comporte du Microsoft-bashing rétrograde (concernant leurs produits avant 2006). Faut reconnaitre qu’ils ont fait des efforts, et qu’il est temps de moderniser les… visiteurs.