Adobe
Tutorials
Jazz up e-mail messages
E-mail messages a little dry? Newsletters, invitations, and sales flyers can be much more interesting with images, color, and stylized text—all available in HTML e-mail. And it's no harder to create than the Web pages you design in Adobe® GoLive® 6.0. Give your readers a choice; some e-mail applications can't read HTML, and some people prefer not to receive it. Then wow the people who opt in with graphic designs that make your point with style.
main
1. Create a folder for the HTML page and images.
Choose File > New Site. GoLive opens the GoLive Site Wizard. Use the wizard to create and name a blank site. Be sure to select Create Project Folder when you name the site. Double-click the Index.html file in the site window to open it; use this page for your HTML e-mail design. Alternatively, you can create a folder within a larger site. What's important is that the files be together—don't create a separate folder for the images.
   
 
step01_int
2. Design the page.
Design the HTML page with e-mail client applications in mind. Keep the design simple; avoid GoLive features that e-mail applications don't understand, such as layout grids, components, actions, floating boxes, DHTML, rollovers, JavaScript, SWF (Flash), frame sets, and nested tables. Use standard fonts. Include images only when they serve a purpose, and optimize them using an application such as Adobe ImageReady®. Include full paths to links in the text for e-mail applications that don't recognize HTML. You can't control the window size of the reader's e-mail application, but you can construct the page so that it flows according to the window size. Try using tables that line up beneath each other and setting their widths to a percentage. For example, if you center a table and set its width to 80%, it occupies 80% of the window, leaving a 10% border on each side, in a window of any size.
   
 
step02_int
3. Use fully qualified URLs for links.
Select a text link or an image. Choose Edit from the pop-up menu next to the URL in the Text Inspector, or next to the Source URL in the Image Inspector. Then, enter the fully qualified URL for the link (for example, http://www.yourdomain.com/sitename/imagename). Repeat this step for each additional text link or image on the page. When you enter a fully qualified URL for an image, the image is replaced with a placeholder. When you send an HTML e-mail message, the message is on the recipient's computer, but the images and pages it references are on your Web server. For the e-mail application to find the images, or even other pages on your Web site, you must use fully qualified URLs. Images linked with fully qualified URLs don't appear in layout or preview mode in GoLive, so it's easier to complete your design before you modify the links.
   
 
step03_int
4. Upload the images to your Web server.
Click the FTP Server Connect/Disconnect button on the toolbar. (If you haven't set up access to an FTP server, first click the Site Settings button on the toolbar, and complete the connection information for the server you want to use.) Click the Files tab in the site window, then select the images to upload. Choose Site > FTP Server > Upload Selection. Make changes in the Upload Options dialog box if necessary. You don't need to upload the HTML page to your Web server. However, if you do upload the page, readers whose e-mail applications don't support HTML can use a browser to view the message online.
   
 
step04_int
5. Configure your e-mail application to send HTML e-mail.
Set the option in your e-mail application to send HTML e-mail. If you use Outlook Express, choose Tools > Options, click the Send tab, and set the Mail sending format to HTML. If you use Netscape 6.2, choose Edit > Preferences, click Mail & Newsgroups, click Send Format, and then specify a format for e-mail applications that don't read HTML. If you use a different e-mail application, check its documentation for instructions. In most cases, if you're sending the message to fewer than fifty people and don't expect to send HTML e-mail messages frequently, you can send directly from an e-mail application. However, if you expect to send HTML e-mail frequently or to a large group whose addresses are collected in a database, consider using a proprietary batch e-mail merge application or online service.
   
6. Test the HTML e-mail message.
Send the message to yourself to see how it appears in an e-mail application window. Correct any problems. To send the message from Outlook Express in Windows, choose File > Select Stationery, and select the HTML page. To send it from Outlook Express or Entourage in Mac OS, use "Send Complex HTML," a free script available on Apple's Web site. To send the message from Netscape 6.2, open the page in Netscape Composer, copy the contents of the page, and then paste it into the body of a new message window.
   
 
step06_int
7. Send the HTML e-mail message.
With the HTML page set up in your e-mail application, add a subject line and insert the addresses in the To: field. If you're sending to a large group of people, it's easiest to create a group in the e-mail application's address book and use that group. To keep the identities of the recipients hidden from each other, type their addresses or the group name in the Bcc: field. Then, leave the To: field blank or type your own address in it.
   
 
step07_int