A white vector object with drop shadow displaying the way it is intended to.

Every once in a blue moon I run into a problem in Adobe Illustrator when using Save for Web. The issue occurs when saving a transparent PNG file that consists of a white vector object with a drop shadow. For some reason the white vector registers as 100% transparent in the save for web dialog box. Unfortunately, it isn’t just a display glitch. The file actually saves this way making the object, in this case a logo, useless.

The Adobe Illustrator Save For Web Menu displaying a PNG file with a transparency issue involving a White Vector object and Drop Shadow

The problem always seems to take me 5 or 10 minutes to resolve and drives me crazy. Usually I end up opening the AI file in Photoshop and then create a drop shadow and save it for web there. Today, I came up with a new solution. Simply enter the color editor and add 1% Black (K) to the white object. The human eye cannot detect such a small percentage of gray (at least mine can’t) so the vector object still appears white. When you save your slice for web, the white vector objects magically are no longer transparent. Thus saving you the step of opening the file in Photoshop.

Adding 1% Black in the color editor to the White Vector Object in Adobe Illustrator corrects the issue.

Hopefully this solution saves you some time also. If you know what the actual cause of the problem is I please feel free to explain it to me below.

The Adobe Illustrator Save For Web Dialog box with the vector object transparency issue corrected.

The Rock of Gibraltar became the driving force behind the company’s brand identity in 1896. The Rock was first used in an ad placed in Leslie’s Weekly with the text, “The Prudential Has the Strength of Gibraltar.” The inspiration behind this slogan is said to have come from an ad man’s commute as he past volcanic Laurel Hill in Seacaucus, NJ on the train into New York City. Prudential continued to innovate the world of marketing in 1955 when it became the first company to sponsor a television program with “Prudential Family Playhouse.” In 1970 the company unleashed one of the most powerful taglines in the history of advertising with, “Get A Piece of the Rock”. The Rock of Gilbraltar mark was changed to a stylized graphic translation in 1985. However, in 1989, a more refined illustrative version of the Rock of Gilbraltar was created. The Prudential logo’s text was designed by Doyald Young utilizing Century Schoolbook typeface as its base.

The following example is an interesting look at The Rock’s historical journey. I spent a few hours trying to determine what the year was for each version by doing several image searches for vintage Prudential Print Ads. In the process I found it interesting that up until about 1970 there really was very little consistency between the logos used. Even the shapes of the logo seemed to change indiscriminately.  I’m chocking it up to the artistic whimsy of the various illustrators. As you can see, I’m still missing a few dates. If you can determine any of the missing dates or feel that I am mistaken in the ones that I have found be sure and Let me know.