|
HTML - Opinions On Html Email Strategy
Wondering everyone's thoughts on HTML email best practices.
Does anyone else like the idea of one large background image behind the layout table? It sure makes the process faster (going from design to HTML). Any drawbacks? I haven't found any email readers that ignore background images. Any advantages to chunking the table up into cell-based background images or IMG images (instead of the one large background image)? Do you generally try to include all text as HTML unless the style/design dictates a non-standard font? Lately I've been trying to keep text near the top of the email as HTML if at all possible so that it renders even if graphics are turned off on the client email reader. Also, I have found no alternative to hacking through inline CSS styles as gmail strips out any styling above the body tag. I wish Dreamweaver CS3 would allow you to toggle between stylesheet and inline styles...for now it seems I'm stuck typing inline styles manually. As for layout, I like one container table at 100% width with one row that contains a content table, usually around 700-800px, with a span of as many columns as is necessary to accommodate the design. Any other thoughts/best practices are appreciated. Similar TutorialsPlease take the time to help me out here it seems really minor but im completly lost on what to do right now, i have 3 ideas stick with the 1st design, stick with the 2nd or scrap them both and go for a php template or find a real nice html template and buy it... i think i like this one the thing i cant decide here is i dont like the flash menu being as the table is on the side with it, plus i know more links will be added later and the top table will only hold 8 links... http://www.freewebs.com/fallingrain11/22.html this layout i like but i feel looks to plain from outside prespective... http://www.freewebs.com/fallingrain1...rrrrrrrrr.html and well im looking @ php templates right now and theres some rediclous looking templates out there i just dont trust they will work properlly for every visiting user... has any1 used php templates and or can offer some advice on there reliability as far as the average viewer being able to view them? thank you all very much ... First of all, I have only just started this site, and it's only ever going to be a very basic HTML site. It's going to be a ground guide for Non-League football. Here is one of the completed ground pages so far. Most of the links don't actually take you to anything in perticular, so don't shout! I'd just like a couple of ideas on how to improve the general look of the site. Thanks! Code: http://79.170.43.200/adp-design-demos.com/nlgg/wadham_lodge.html Don't worry about the ugly domain, it's only going to be like that during testing Hi, so I'm trying to make this e-mail newsletter. It's entirely images, tables and text. So no javascript, just plain stuff. I tried attaching it as a signiture file and I had trouble sending it. It also didn't come out right. I'm trying to avoid using a software. Its basically just a block of HTML I need to show up as the only content in an email. If you just put HTML into a email text field, it just shows the HTML code in the email as text. Any ideas? I'm having trouble using html email. Everything works fine except the link I put in it. I need to have a link parents will click on which will take them to a webpage which will automatically register them. When I test it (on my Mac - sorry ... a real computer) it works great, but the parents of my students say the link doesn't work. I tested the email again by sending it to one of my fake yahoo.com email accounts, and sure enough, the link was NOT active. Here is what it looked like: <a href="register.php?id=1712">click here</a> Can someone tell me what I might be doing wrong. Hi Everyone, I just created an email template that i want to send out and i am getting lots of errors when I'm testing it. All my images are showing up as attatchments, Can i prevent this? My page doesn't work across all browsers, spacing issues in gmail, hotmail is giving me and extended height in a few places. I have a search box as well that I want to include- is that a bad idea? How can avoid this / fix these problems. If requested i will include my code. Thanks Hi, I am using an email newsletter system, wherein I can create HTML templates and then send mails. I would like to know in the email that I send, I need the html to pick up some dynamic content from another website and when the email is being displayed, it needs to show that dynamic content I could have used iframe in the html template - but that would work on websites, but not on emails. Is there a way anyone can suggest wherein I can achieve this? Thanks I have to send an HTML email, but I'm missing something. I have my HTML page encoded, and I put Outlook on HTML mode, but when I send the email, the receiver still only gets a bunch of code, not the nice-looking HTML Layout we've worked so hard on. I'm opening the HTML's source code, copy/pasting it in the body of the email. Obviously this is wrong. Can someone please tell me how it's supposed to be done? And yes I know HTML emails are evil, no I'm not a spammer, and I know I'm facing an army of filters. But if someone could point me in the right direction, I would really appreciate it. hi all, something I thought would be simple is, well, not so simple for me!! all that I want to do is send a complete html web page as an ordinary email so that people viewing it can click on the existing links and buttons.(for payments etc) I have tried sending it several times and on aol none of the headings/gif's n jpg's are displayed, using squirrel mail, some of the links are highlighted, however, some are missing. using outlook, well, no comment!!! surely there is an easy (hehe) way to send a whole hyml web page as an email? many thanks for all help, Ed can anyone help me with this, it looks ok but it wont email Code: <form action="mailto:byp_webmaster@hotmail.co.uk" method="POST" enctype="multipart/form-data" name="Website contact form"> <table border="1" align="center"> <td> <center>Your Name:</center><input type="text" align="center" size="40" maxlength="50" name="name"> <br><br> <center>Your Email:</center><input type="text" align="center" size="40" maxlength="50" name="Email"> <br><br> <center>Message:</center><textarea cols="50" rows="4" name="Message" align="center"></textarea><br> <center><input type="submit" value="Send Email" ></center> </td> </table> </form> hey guys im after some simple help i think. i have created a .psd for a html email i wish to send. i have sliced it up to how i would like it and i created the automated html. It all show ok in all web browsers and most email clients but not outlook 2007, i know there is a lot of issues with this email client but just wondered if you guys know any way to work around it. If i keep all the slices horizontal then it all fits fine but on the vertical ones which i need it kinds shifts them over the right so there the while vertical lines running through the page. i have attached the code any help would be more then appreciated. Code: <html> <head> <title>newnew</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <!-- Save for Web Slices (newnew.psd) --> <table id="Table_01" width="800" height="601" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="5"> <img src="http://www.designtwenty1.com/emailimages/skyblue_02.jpg" width="327" height="44" alt=""></td> <td colspan="6"> <img src="http://www.designtwenty1.com/emailimages/skyblue_03.jpg" width="280" height="44" alt=""></td> </tr> <tr> <td colspan="11"> <img src="http://www.designtwenty1.com/emailimages/skyblue_04.jpg" width="607" height="28" alt=""></td> </tr> <tr> <td colspan="12"> <img src="http://www.designtwenty1.com/emailimages/skyblue_05.jpg" width="790" height="44" alt=""></td> <td> <img src="http://www.designtwenty1.com/emailimages/skyblue_06.jpg" width="10" height="44" alt=""></td> </tr> <tr> <td colspan="3"> <img src="http://www.designtwenty1.com/emailimages/skyblue_07.jpg" width="311" height="77" alt=""></td> <td colspan="10"> <img src="http://www.designtwenty1.com/emailimages/skyblue_08.jpg" width="489" height="77" alt=""></td> </tr> <tr> <td colspan="13"> <img src="http://www.designtwenty1.com/emailimages/skyblue_09.jpg" width="800" height="37" alt=""></td> </tr> <tr> <td> <img src="http://www.designtwenty1.com/emailimages/skyblue_10.jpg" width="141" height="121" alt=""></td> <td colspan="3"> <img src="http://www.designtwenty1.com/emailimages/skyblue_11.jpg" width="221" height="121" alt=""></td> <td colspan="6"> <img src="http://www.designtwenty1.com/emailimages/skyblue_12.jpg" width="279" height="121" alt=""></td> <td colspan="3"> <img src="http://www.designtwenty1.com/emailimages/skyblue_13.jpg" width="159" height="121" alt=""></td> </tr> <tr> <td colspan="13"> <img src="http://www.designtwenty1.com/emailimages/skyblue_14.jpg" width="800" height="41" alt=""></td> </tr> <tr> <td colspan="6"> <img src="http://www.designtwenty1.com/emailimages/skyblue_15.jpg" width="397" height="54" alt=""></td> <td colspan="7"> <img src="http://www.designtwenty1.com/emailimages/skyblue_16.jpg" width="403" height="54" alt=""></td> </tr> <tr> <td colspan="2" rowspan="3"> <img src="http://www.designtwenty1.com/emailimages/skyblue_17.jpg" width="193" height="154" alt=""></td> <td colspan="3" rowspan="3"> <img src="http://www.designtwenty1.com/emailimages/skyblue_18.jpg" width="187" height="154" alt=""></td> <td colspan="3" rowspan="3"> <img src="http://www.designtwenty1.com/emailimages/skyblue_19.jpg" width="223" height="154" alt=""></td> <td colspan="5"> <img src="http://www.designtwenty1.com/emailimages/skyblue_20.jpg" width="197" height="115" alt=""></td> </tr> <tr> <td rowspan="2"> <img src="http://www.designtwenty1.com/emailimages/skyblue_21.jpg" width="18" height="39" alt=""></td> <td colspan="2"> <img src="http://www.designtwenty1.com/emailimages/skyblue_22.jpg" width="162" height="26" alt=""></td> <td colspan="2" rowspan="2"> <img src="http://www.designtwenty1.com/emailimages/skyblue_23.jpg" width="17" height="39" alt=""></td> </tr> <tr> <td colspan="2"> <img src="http://www.designtwenty1.com/emailimages/skyblue_24.jpg" width="162" height="13" alt=""></td> </tr> <tr> <td> <img src="http://www.designtwenty1.com/emailimages/spacer.gif" width="141" height="1" alt=""></td> <td> <img src="http://www.designtwenty1.com/emailimages/spacer.gif" width="52" height="1" alt=""></td> <td> <img src="http://www.designtwenty1.com/emailimages/spacer.gif" width="118" height="1" alt=""></td> <td> <img src="http://www.designtwenty1.com/emailimages/spacer.gif" width="51" height="1" alt=""></td> <td> <img src="http://www.designtwenty1.com/emailimages/spacer.gif" width="18" height="1" alt=""></td> <td> <img src="http://www.designtwenty1.com/emailimages/spacer.gif" width="17" height="1" alt=""></td> <td> <img src="http://www.designtwenty1.com/emailimages/spacer.gif" width="123" height="1" alt=""></td> <td> <img src="http://www.designtwenty1.com/emailimages/spacer.gif" width="83" height="1" alt=""></td> <td> <img src="http://www.designtwenty1.com/emailimages/spacer.gif" width="18" height="1" alt=""></td> <td> <img src="http://www.designtwenty1.com/emailimages/spacer.gif" width="20" height="1" alt=""></td> <td> <img src="http://www.designtwenty1.com/emailimages/spacer.gif" width="142" height="1" alt=""></td> <td> <img src="http://www.designtwenty1.com/emailimages/spacer.gif" width="7" height="1" alt=""></td> <td> <img src="http://www.designtwenty1.com/emailimages/spacer.gif" width="10" height="1" alt=""></td> </tr> </table> <!-- End Save for Web Slices --> </body> </html> thanks jamie hi im not sure if this is the right section but ive been looking around and cant find what i need so im asking for help. i have a html form like so Code: <form name="riskform" method="post" enctype="text/plain" > <div id="formtop">Name: <br> <input type="text" name="Name" /><br /><br /> Company: <br> <input type="text" name="Company" /><br /><br /> Location:<br /><input type="text" name="Location" /> <br><br /></div><br /> <h2>Risk Selection</h2> <div id="list"> <label><input type="checkbox" name="Extream Weather" />Extream Weather</label><br /><br /> <label><input type="checkbox" name="Confined Space" />Confined Space</label><br /><br /> <label><input type="checkbox" name="Traffic" />Traffic</label><br /><br /> <label><input type="checkbox" name="Slip/Trip" />Slip/Trip</label><br /><br /> <label><input type="checkbox" name="Noise" />Noise</label><br /><br /> <label><input type="checkbox" name="Falling Object" />Falling Objects</label><br /><br /> <label><input type="checkbox" name="Machinary" />Machinery</label><br /><br /> <label><input type="checkbox" name="Equiptment" />Equiptment</label><br /><br /> <label><input type="checkbox" name="Construction Work" />Construction Work</label><br /><br /> </div> <div id="sub"><input type='submit' name='Submit' value='Submit'/></div><br /><br /> </form> and what i want to happen is when the user clicks submit this form is emailed to my site admin, ive looked at mailto: but i want the page to be email as a page view the same as how it looks if you print the page. hope that makes sense Hi, I want to ask is there any way to send email form html?? like php mail() is there something in php. Or sending by smtp???? everytime i try to make this my html email, i get bad table padding and spacing but it looks good on webpages but not emails Code: <html>
<head>
<style>
.body {
background-color: #d6d6d6;
}
.content {
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
color: #D7D7D7;
}
A:link, a:visited, a:active {
color: #00BFFF;
}
a:hover {
color: #1AC8FF;
}
.simple {
width: 800px;
padding: 0px 0px 0px 0px;
margin-left: auto;
margin-right: auto;
margin-bottom: 0px;
margin-top: 0px;
height: 601px;
}</style>
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" bgcolor="#D8D8D8">
<table class=simple border=0 cellspacing=0 cellpadding=0 width="100%">
<tr>
<td colspan="5" width="800">
<img src="http://www.megatopics.com/emails/images/Email_01.png" width="800" height="38" alt=""></td>
</tr>
<tr>
<td colspan="2" width="253">
<img src="http://www.megatopics.com/emails/images/Email_02.png" width="253" height="178" alt=""></td>
<td width="267">
<img src="http://www.megatopics.com/emails/images/Email_03.png" width="267" height="178" alt=""></td>
<td colspan="2" width="280">
<img src="http://www.megatopics.com/emails/images/Email_04.png" width="280" height="178" alt=""></td>
</tr>
<tr>
<td rowspan="2">
<img src="http://www.megatopics.com/emails/images/Email_05.png" width="44" height="384" alt=""></td>
<td width="770" height="340" colspan="3" valign="top" background="http://www.megatopics.com/emails/images/Email_06.png" class="content"> {member_name},<br>
We have just launched a whole new system to MegaTopics, its Called The Reputation System! You can read more about it <a href="http://www.megatopics.com/Forum-Related-f1/Suggestions-Questions-FAQs-f2/Help-Files-f40/How-Do-I-Get-Repuation-t977.html">here</a>!<br>
<br>
Here is the breakdown of the reputation point trade-ins: (if you elect not to purchase one) <br>
Silver Membership: 50000 Request an upgrade <a href="http://www.megatopics.com/Forum-Related-f1/Suggestions-Questions-FAQs-f2/Request-New-Category-Membership-f3/Request-New-Category-Membership-f3.html">here</a><br>
50 USD: 100000 Request Money <a href="http://www.megatopics.com/Forum-Related-f1/Suggestions-Questions-FAQs-f2/Request-New-Category-Membership-f3/Request-New-Category-Membership-f3.html">here</a><br>
<br>
</a>There is a couple forums that allow the use of getting reputation on MT. Its obvious that people have to click the little green button plus sign to give you reputation to more or less thank you for the post. These are the forums that allow you to get reputation.
<br>
<br>
<a href="http://www.megatopics.com/Jus-Kickin-It-f134/Jus-Kickin-It-f134.html"><strong>Jus' Kickin It</strong></a>: All the forums under this category <br>
<a href="http://www.megatopics.com/Incognito-f122/Incognito-f122.html"><strong>Incognito</strong></a>: All the forums under this category<br>
<a href="http://www.megatopics.com/Champagne-Room-f162/Champagne-Room-f162.html"><strong>Champagne Room</strong></a>: All the forums under this category,<u><em>except</em></u> the General Forum<br>
<a href="http://www.megatopics.com/Special-Interests-Everything-Else-f4/Computer-GeekZ-FreakZ-f8/Computer-GeekZ-FreakZ-f8.html"><strong>Computer GeekZ & FreakZ</strong></a>: There is only one forum that allow reputation here, Tutorials<br>
<a href="http://www.megatopics.com/Special-Interests-Everything-Else-f4/Cooking-f78/Cooking-f78.html"><strong>Cooking</strong></a>: There is only one forum that allow reputation here, Recipes <br>
<a href="http://www.megatopics.com/Special-Interests-Everything-Else-f4/The-Juice-And-Liquor-Bar-f147/The-Juice-And-Liquor-Bar-f147.html"><strong>The Juice And Liquor Bar</strong></a>: There is only one forum that allow reputation here, Concoctions <br>
<a href="http://www.megatopics.com/Mega-Topics-Salon-f91/Mega-Topics-Salon-f91.html"><strong>Mega Topics Salon</strong></a>: There is only one forum that <u><em>does not allow</em></u> reputation here, Request A Graphic <br>
<br>
{board_name} Statistics: Registered Users: {reg_total} | Total Posts: {total_posts} | Busiest Time: {busy_count} users were online on {busy_time}<br>
<br>
Board Address: {board_url} Log In: {board_url}?app=core&module=global&section=login Lost Password Recovery: {board_url}?app=core&module=global&section=lostpass<br>
<br>
How to unsubscribe<br>
Visit your email preferences ({board_url}?app=core&module=usercp) and ensure that the box for 'Send me any updates sent by the board administrator' is unchecked and submit the form </td>
<td rowspan="2">
<img src="http://www.megatopics.com/emails/images/Email_07.png" width="49" height="384" alt=""></td>
</tr>
<tr>
<td colspan="3">
<img src="http://www.megatopics.com/emails/images/Email_08.png" width="707" height="44" alt=""></td>
</tr>
<tr>
<td>
<img src="images/spacer.gif" width="44" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="209" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="267" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="231" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="49" height="1" alt=""></td>
</tr>
</table>
</body>
</html>
Hi, does anyone know if it is possible to send an html email with yahoo? thanks I am trying to send out an email with html page attached. It an auto generated html page with small pieces of sliced images. All images are in tables. When I send out a test email, it doesn't work on hotmail with firefox. the table breaks down as it is. The original image is a perfect oval. It actually works well on gmail, yahoomail & outlook. It even works on hotmail with IE. But only not on hotmail with firefox. Anyone had the same problem before?? Please help~~~ Hi All, Does anyone know if a DOCTYPE declaration is necessary for HTML emails? I'm trying to improve our HTML email system and am wondering how this affects HTML email if at all, For example, all our emails state: <!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"> Should we switch to simply <html> to start the email? Or does it not matter? Just looking for some info on this... I've been working on a graphical html email recently, and it's working out great except for one annoying issue (especially since I encourage email forwarding) my email is separated into multiple <table> tags to accomodate different images - i switched to inline images to make sure it worked properly, and each section has its own graphics, but there's nothing embedded, just a set of tables. however whenever the email is forwarded from within MS Outlook, the table tags get large gaps between them - as if the spacing between them is ignored. Is there a workaround for this? Hi i am looking for a bit of help creating an email form. I would like it to contain a table with 4 columns per row - the middle two cells would contain a drop down menu each. the form would have a send button which would send the results in an easy to read format to a pre-defined address. ideally it would work on hotmail, yahoo etc. i would be really grateful for any hints and tips anyone could give many thanks Oh man.... I have had a hell of a FIRST time coding for an html email newsletter for a local band. I first had an idea of making the bottom section of this email with images and then using an image map for the links to the Amazon, Itunes, Store and etc... But then once I'm done coding the image maps I send a sample email and links don't work. So I do a little research and supposedly image maps are sketchy and rarely work especially in Gmail <---- which is what I am using. Soooo..... My other approach to this problem was to slice it up and make Photoshop CS4 do the work. Which works great when you view it in a browser, BUT once you send it as a e-mail it adds all sort of spacing around images, and even makes the images larger in size. So somebody have any thoughts on this? THanks! Here is the link to the email up on the server...Working perfectly until i send it as an email: http://gordonavenue.com/emails/tanta..._tuesdays.html Here is an image of what the sliced up part looks like when I send it as an email [IMG][/IMG] |
|||||||