I have a logo that I want to layer on top of a background image that will together act as the header for the webpage.
The easy thing to do would be to create an image on photoshop layering the background image and the logo, with the logo blend effect, and then save and upload. Problem is that I want the background image to resize with the browser window - without resizing the logo.
Therefore, I figured I could save the background image and logo files separately, and then layer them using HTML and CSS. For it to look comparable therefore, I want to keep the background of the logo transparent. I would also like to set the blend mode of the logo to linear dodge (add) - so that whatever size the background image is scaled to, the logo remains the same size, with the same blend mode. The problem is that when I save the logo as a transparent png file (24-bit), it is not maintaining the blend mode.
What am I doing wrong?
You're doing nothing wrong. The PNG file does not store a blending mode. Maybe CSS3 will allow you to specify linear dodge (add).
Blending modes are algorithms in the rendering device/ application (Photoshop, other image editors, browsers), not data. there is no way to retain them just by saving to a specific format. if you dumbed down PS and removed all belnding modes, it would behave just the same as your browser.