Tuesday, October 5, 2010

Sending HTML formatted email

Last week I had to fix email sent from java code. The email was formatted as HTML. It worked fine in left-to-right languages but did not look good in Arabic (that uses right-to-left script).
The email that we sent was formatted as full HTML document like

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>مرحبا</title>
</head>
<body>
مرحبا ، العالم
<body> 
 
(I do not know Arabic, so the text is just a google’s translation of “Hello, world.” The original text was longer and contained some irrelevant and probably confidential details of company I worked for.)
I added attributes dir="rtl" lang="ar" to tag html, saw that now the text looks right-to-left in browser and event did not try to send it by email. I thought that issue is fixed.
But the bug was re-opened shortly. And really the text was adjusted to the left in both outlook and different web based email readers.
I spent a lot of time trying to understand the problem relatively to the complexity of the task.
To make the long story short all attempts to put anything to tags html, head, body failed.
because email clients ignore (or even remove in case of web based emails) all HTML heading tags of received message.
But all tags inside body work well. So the easiest (and I believe “right”) solution was to send HTML fragment wrapped with div tag instead of full document.
In our case the text looks like:

<div style="text-align:right;direction:rtl;">
مرحبا ، العالم
<br/>
שלום העולם
<div>

The second line is in Hebrew to show that it works well too.
Our email contained link. For better portability the text contains the same URL as HREF attribute, i.e.

<a href="http://www.mycompany.com">http://www.mycompany.com</a>

Embedding this link into HTML does not cause any problem. The link is left-to-right into right-to-left document:

<div style="text-align:right;direction:rtl;">
مرحبا ، العالم <a href="http://www.mycompany.com">http://www.mycompany.com</a>
<br/>
שלום העולם <a href="http://www.mycompany.com">http://www.mycompany.com</a>
<div> 
 
Unfortunately Hebrew and Arabic co-exist so easily only in HTML documents…

No comments:

Post a Comment