Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 166
  • Last Modified:

Sending HTML Emails

I occassionaly have the need to send html emails to subscribers.  They have a way to "open in web browser" which gives a nice look but I want to improve the look when in their email client.  right now it looks like this in my outlook:
HTML email in outlook
Here is what it looks like online

Is there a way to bridge the gap between the way the email renders and the way the web version renders.  I know I get some better html emails from other vendors.

Bob Schneider
Bob Schneider
  • 5
  • 3
  • 2
  • +1
9 Solutions
Big MontySenior Web Developer / CEO of ExchangeTree.org Commented:
are the cut off edges just from the screen shot, or is that really how it looks in outlook?
Big MontySenior Web Developer / CEO of ExchangeTree.org Commented:
validating your html version, there were only 2 errors, which is good, however, email clients can be very picky, and that could be leading to some of the issues you're seeing.

of course, this is assuming you're using the EXACT html code in your emails that you provided with the link
Big MontySenior Web Developer / CEO of ExchangeTree.org Commented:
you may also want to consider use a third party tool to build your html email and it'll make it "email-friendly" for you.

Premailer - http://premailer.dialect.ca/
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Scott Fell, EE MVEDeveloperCommented:
I use ink and it is a great base for emails.  It will auto configure based on the phone size just as a responsive site.  Because email needs to be a bit more primitive in set up, it takes some work but you will love the results!


Scott Fell, EE MVEDeveloperCommented:
fyi, zurb is a great resource and they have a few articles about using outlook such as static widths and conditionals

Scott Fell, EE MVEDeveloperCommented:
I just saw your link. The width should be narrower. Try maxing out at 500 or 600px.
Bob SchneiderCo-OwnerAuthor Commented:
Ok...can I do this with Mandrill or one of these utilities?  I have a classic asp page that I use for this.
Scott Fell, EE MVEDeveloperCommented:
Of course.

Mandrill is just the 3rd party smtp service.

The way I set up mail is to have a function for both the template and sending.  In mandrill if you are using the newsletter feature, you would just use the updated html.
Scott Fell, EE MVEDeveloperCommented:
Here is a sample of old code for mandril I use

do until rs.eof
' replace data with recordset
theBody = template(firstName,lastName, variableData1,varialbeData2)

sendMail theFirstName, theLastName, theAddress, theSubject,  theBody


Sub SendMail(theFirstName, theLastName, theAddress, theSubject,  theBody)

' Set stuff up here
Const cdoSendUsingPickup = 1 'Send message using the local SMTP service pickup directory. 
Const cdoSendUsingPort = 2 'Send the message using the network (SMTP over the network). 
Const cdoAnonymous = 0 'Do not authenticate
Const cdoBasic = 1 'basic (clear-text) authentication
Const cdoNTLM = 2 'NTLM
'SMTP userinfo

Rcpt = Chr(34) & theFirstName &" "&theLastName & Chr(34) & "<" & TheAddress & ">" 

Set objMessage = CreateObject("CDO.Message") 
objMessage.Subject = theSubject 
objMessage.From = "first last <address@mydomain.com>" 
objMessage.To = ""&theFirstName&" "&theLastName&" <"&TheAddress&">" 'Rcpt
objMessage.HTMLBody =  theHTML(theSubject,theBody) ' runs sub EmailBody

'==This section provides the configuration information for the remote SMTP server.
objMessage.Configuration.Fields.Item _
("http://schemas.microsoft.com/cdo/configuration/sendusing") = 2 
'Name or IP of Remote SMTP Server
objMessage.Configuration.Fields.Item _
("http://schemas.microsoft.com/cdo/configuration/smtpserver") =  "smtp.mandrillapp.com" 
'Type of authentication, NONE, Basic (Base64 encoded), NTLM
objMessage.Configuration.Fields.Item _
("http://schemas.microsoft.com/cdo/configuration/smtpauthenticate") = cdoBasic
'Your UserID on the SMTP server
objMessage.Configuration.Fields.Item _
("http://schemas.microsoft.com/cdo/configuration/sendusername") = smtpUser
'Your password on the SMTP server
objMessage.Configuration.Fields.Item _
("http://schemas.microsoft.com/cdo/configuration/sendpassword") = smtpPass
'Server port (typically 25)
objMessage.Configuration.Fields.Item _
("http://schemas.microsoft.com/cdo/configuration/smtpserverport") = 465 
'Use SSL for the connection (False or True)
objMessage.Configuration.Fields.Item _
("http://schemas.microsoft.com/cdo/configuration/smtpusessl") = true
'Connection Timeout in seconds (the maximum time CDO will try to establish a connection to the SMTP server)
objMessage.Configuration.Fields.Item _
("http://schemas.microsoft.com/cdo/configuration/smtpconnectiontimeout") = 60

'==End remote SMTP server configuration section==


End Sub

function template(firstName,lastName, variableData1,varialbeData2)
    mailHTML =""
    mailHTML=mailHTML&"<tr><td>Hello "&firstName&" "&lastName&"</td></tr>"
end function.

Open in new window

RobOwner (Aidellio)Commented:
I'll throw my 2c in.  We've all had different experiences so you should take what suits you.

Campaign Monitor
One of the best and easiest to use.  Allows you to easily create a template via their WYSIWYG or you can upload your own html template to use.  Last time I checked, it's free for a minimum of recipients that may fit your requirements.

What you may find useful regardless of Campaign Montior is they also have built the "bible" when it comes to using CSS in your emails and what email clients are compatible with what (https://www.campaignmonitor.com/css/).  Use it as your reference to get a good idea about how the emails look in the client.

IMHO and my experience when it comes to email marketing, the email itself should be more of a teaser with a very basic but clean layout.  Enticed to have the user click to either view the actual email online or view the specific contents of the email online such as a product or article.  The more complicated you make the email the worse it's going to look in most clients.  Email software just isn't designed for displaying HTML (well not the programs most businesses use... i.e. Outlook)
Bob SchneiderCo-OwnerAuthor Commented:
Such good advice!

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

  • 5
  • 3
  • 2
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now