Yahoo Mail, Keyword and text Color override Causes Problems for Email Designers

Yahoo Mail Re-colors Links and Keywords in HTML Based Emails To Sell Advertising

Gmail Recolors Telephone Numbers in Emails to Blue to pitch their Google Voice service

Recent changes at Yahoo Mail and Gmail creates email design problems by recoloring links and prime keywords in users' emails, causing problems for email designers

Overview Of The Recoloring Text Problem

Yahoo and other web-based email companies often change the standard colors of text that they decide are links or keywords in recipients' HTML email, overriding the color settings that the email designer has prescribed. Yahoo has done this to sell some inbox advertising to email recipients that was not intended by the originator or designer of the email. Google has made the Gmail color change when it spots a phone number in the email and tries to sell it IP telephony service by coloring the phone number blue, regardless of whether the background is blue too - efectively making the phone number disappear. This change can cause many other types of logistical issues with sending an email.

Although it's easy to figure out what links are affected and plan accordingly, it's much harder to figure out the keywords that Yahoo will be re-coloring. This is because the keywords come from an internal ad list at Yahoo, and they change every day according to what advertisers are willing to buy. At this time, Yahoo is only 15% of the web-based email market, so up until now, most marketers and email designers have ignored the problem - but as other email companies are threatening to do the same thing in order to create ad revenue, it's time to get in front of the problem in a pro-active stance. Carol Bartz Discusses Yahoo Mail Link Color Override

Carol Bartz, CEO Yahoo Inc. Responds To Questions About the Yahoo Text Color Override

At a recent conference, Yahoo's chief executive, Carol Bartz, was asked about the dreaded link and text keyword color override problem and responded:

“Yahoo will continue to explore any areas that can provide our advertisers opportunities to insert their brand into a social conversation, email being the very original social network that is still alive and kicking." ... "The text color override and subsequent ad placement is one of those areas that provides us with an excellent return on investment, even though some people may find it a little obtrusive, they will happily suffer with it to allow the Yahoo email service to remain free". She added, "Google has been busy putting up side-ads based on the email content; we have taken it one step further, albeit an aggressive one at that, but a move that shows our passion for our clients and our shareholders.”

The Specifics: What text in an email does Yahoo actually change?

Telephone Number
Yahoo changes the color of the text to #336699 blue and brings up the Yahoo shortcuts bubble so the user can add this contact to their calendar.

Yahoo changes the color of the text to #336699 blue and brings up the Yahoo shortcuts bubble so the user can see it on a map

Yahoo changes the color of the text to #336699 blue and brings up the Yahoo shortcuts bubble so the user can add the date to their Yahoo calendar

Yahoo Mail recolors the link, and if you hover over the link will bring up a list of advertisers not actually associated with the word

Any text-based word in the email can be picked up and treated as a keyword; Yahoo changes the color of the word to a mid-blue, and if you hover over the word it will open up a pop up with a list of advertisers who paid for their advertisement to be associated with the word

The Gmail Problem

Gmail has begun changing the colors on all phone numbers that are received in Gmail email accounts to the color blue known as #0000CC. The telephone number will now be clickable and will link to the Gmail phone system.

Possible Solutions:

Generally avoid the use of blue backgrounds that may contain keywords like telephone number, address, dates etc.

Link Solution

For every link use the class “yshortcuts” within an inline div tag like so: <a href=“#“ style=“color:#456456; text-decoration:none;“><span style=“color:#456456;“>Link</span></a>
This is a little repetitive, but it’s a sure-fire way of preventing your links from turning up #336699 blue in Yahoo.

Keyword Solution

We don't have a working solution other than to take this problem into consideration when designing an email, i.e. don't use a mid-blue or a mid-gray color anywhere in the email and absolutely don't use the color #336699 blue anywhere is the email, because it's identical to the color Yahoo will turn the text to, making words invisible.


This is another quirk to add to the HTML email testing checklist, but when other web-based email services start overriding the color on the links, keywords and any other items in the email, we will start to find that no consistent email design can be achieved across the various email environments, rendering the medium of email quirky and unreliable to marketers.