opinion

Change is Good - Sort Of...

In my previous post, “A Long Awaited Update,” I hinted at another story to tell you that was related to my upgrading to MSIE 7. Well, since I was on a roll with this “let’s try new things” kick that led me to upgrading my workhorse browser, I decided that I’d try something else that’s new to me: PNG graphics.

Now before some of you start roaring that there’s nothing “new” about PNG graphics – which have been a W3C recommendation since 1996, the time when I first heard of them – you have to understand that one of the first lessons I learned as a web designer many years ago was not to use those new-fangled JPEG files; since most browsers only offered GIF support. This I learned after building my first website; with those stunning full-color images that relatively few users could see. Like I said, this was a long time ago.

That lesson left me being extremely conservative about adopting new technologies and techniques, since my goal has always been to support the widest customer base.

Having said that, my lovely wife Dawn wanted to give her website an extreme makeover, including a new design that more properly reflected her personality and that would make the user feel like they were in “her room.” This included a complex background instead of the solid colors it used to have, as well as a goal of minimizing the rectangular “boxes” that visually “confined” the previous design – replacing them with softer, more feminine boundaries. As part of this new design, she wanted to “float” a cutout image of herself on the page in place of the rectangular image that was previously there. This seemed like a great place to try a variable-transparency full-color PNG image.

While I would normally use a tried-and-true GIF image for such purposes, the limited color depth and graininess of the transparency with my target image left me unsatisfied; and the desire to float a cutout on a background that changed depending on screen size (it’s a fairly large tile that repeats irregularly depending upon the width of the screen) prevented me from using a JPEG that could easily be feathered to the underlying image.

A decade after the recommendation, PNG should be a safe bet, right? Let’s try it out!

The image looked stunning, but at close to 240kb, the size worried me. Still, when I laid it on the background and then checked it out at a variety of common screen resolutions and using MSIE 7, Firefox, Opera and Netscape, I was impressed and so was Dawn – that is, until she looked at the site on her laptop, which was still running MSIE 6. Rather than the wonderful transparency I was seeing, she was seeing grey boxes around the images.

What a surprise! While MSIE 6 natively “supported” the use of PNG files, it did not readily support their transparency. I’m glad I hadn’t upgraded both systems at the same time, or I would not have seen this major problem…

I dropped the PNG, not willing to lose the presentation for my many MSIE 4-6 users, and tried a few workarounds using GIF and JPEG files; but I wasn’t pleased at the huge loss of quality in doing so. Not willing to give up so easily, I turned to Google for a solution and sure enough, I found one.

This page details the problems and solutions for displaying variable transparency effects using PNG graphics in older versions of MSIE and while I won’t pretend to fully grasp the solution, I was able to make it work and was infinitely pleased with the results – until I noticed that some of my links no longer worked.

See, in my rush to try the solution, I hadn’t carefully read all the background information, and now my “background” was causing me problems. Not the main page background, but the table-cell background I was using to provide a nice, solid canvas for our text and other page elements. It seems that the transparency solution raises the z-level of the cell background to become the top element, “blocking” the hyperlink, even though you can “see” it. Adding an additional event handler ( position: relative; ) to the hyperlink solved the problem, but this too caused an unneeded spiking of my stress level – especially when I discovered that while text links could be globally addressed with this element through my CSS file, JavaScript and image links needed to have it individually added through inline styles. Talk about a never-ending series of pain-in-the-ass tasks!

This was a fairly frustrating exercise, but one which I’m glad we undertook. Now, where appropriate, I’ll include PNG graphics in my designs. Perhaps you can too!

Copyright © 2024 Adnet Media. All Rights Reserved. XBIZ is a trademark of Adnet Media.
Reproduction in whole or in part in any form or medium without express written permission is prohibited.

More Articles

opinion

Why BDSM Furniture and Sex Machines Make an Ideal Match

For BDSM enthusiasts and curious newbies alike, a big part of the fun is discovering and exploring exciting new sensations and scenarios. One way to level up is by combining or layering pleasures you already enjoy, and one surefire way to do that is with BDSM furniture.

Rebecca Weinberg ·
opinion

To Cloud or Not to Cloud, That Is the Question

Let’s be honest. It just sounds way cooler to say your business is “in the cloud,” right? Buzzwords make everything sound chic and relevant. In fact, someone uninformed might even assume that any hosting that is not in the cloud is inferior. So what’s the truth?

Brad Mitchell ·
opinion

Tips for Boosting Ecommerce Revenue With Behavioral Insights

At our marketing agency, we focus on using real data to make better decisions for our clients. We believe every action a visitor takes on a website can tell us something important. This helps us shape our strategies and assist our clients in turning casual website visitors into loyal customers.

Lauren Bailey ·
opinion

Upcoming Visa Price Changes to Registration, Transaction Fees

Visa is updating its fee structure. Effective April 1, both the card brand’s initial nonrefundable application fee and annual renewal fee will increase from $500 to $950. Visa is also introducing a fee of 10 cents for each transaction, and 10 basis points — 0.1% — on the payment volume of certain merchant accounts.

Jonathan Corona ·
opinion

Unpacking the New Digital Services Act

Do you hear the word “regulation” and get nervous? When it comes to the EU’s Digital Services Act (DSA), you shouldn’t worry. If you’re complying with the most up-to-date card brand regulations, you can breathe a sigh of relief.

Cathy Beardsley ·
opinion

A Look at the Do's and Don'ts of Gift-With-Purchase Promos

Imagine you’re at a store, deciding between two products with similar packaging, features and pricing. You’re not predisposed toward either brand and you haven’t seen any reviews — but one of them offers, “Free gift with purchase!” Does that win you over?

Vanessa Rose ·
opinion

The Perils of Relying on ChatGPT for Legal Advice

It surprised me how many people admitted that they had used ChatGPT or similar services either to draft legal documents or to provide legal advice. “Surprised” is probably an understatement of my reaction to learning about this, as “horrified” more accurately describes my emotional response.

Corey D. Silverstein ·
opinion

Tips for Navigating a Completely Remote Job in Sexual Wellness

Anyone working in the sexual wellness and pleasure sector has at some point had to deal with issues like bias against the industry, as well as limited marketing and advertising options.

Bryony Lees ·
opinion

Free Agent Auteur: Casey Calvert Expands Her Directing Horizon

Now, having brought that highly-awarded polyamory trilogy to a close, Calvert is concluding the exclusive Lust Cinema directing chapter of her career and charting a new course out into open creative waters as a free agent.

Alejandro Freixes ·
profile

Marina Valmont: From Beauty Queen to Naked News Anchor

Marina Valmont grew up in the suburbs of Toronto, spending a lot of time walking in nature and enjoying Canada’s beautiful parks and lakes. She describes her younger self as an avid reader who spent a lot of time at the library, as well as a girly girl with a deep love for Disney, fantasy movies and Barbie.

Alejandro Freixes ·
Show More