Last Updated: January 2011

OUTSIDE DESIGNER SPECS TABLE OF CONTENTS

LOOP COMPONENTS 04

VIEW ONCE COUPONS 14

POSTCARDS 16

ADVANCED FTF 18

NEWSLETTERS 20

LSM 22

Client 22

Local 23

Photo Upload 23

ANIMATION 24

SIGN UP SLIPS 25

OUTLOOK 2007 28

CUSTOM FACEBOOK JOIN FORMS 30

IMAGE BASE TEMPLATES 32

p - 2 p - 3 LOOP COMPONENTS

File Size Ideal < 200-300K (including html file and graphics)

Be very conscious of the quantity and type of graphics being used; the more photographs the larger the file size. While Production does the optimizing, design with optimization in mind! Average file size is 300KB.

Dimensions (as appears on screen) Design should fit within monitor (800x600 resolution) with minimal or no scrolling

Custom Email - Width - 500-600px; Height - 450-600px

Note: Remember that (1) the email browser will take up a certain amount of that space depending upon the email client (e.g. Outlook versus Yahoo versus Hotmail) and that (2) email-related links and the unsubscribe disclaimer will take up space beneath the design.

Colors Use RGB colors. Stay away from light color on dark backgrounds. This combination is hard to read and, especially for live text, poses some problems in terms of printing without backgrounds and in black and white.

Typeface Graphical versus Live Text: For Custom Email: (i) Using live text will save on file size plus put our emails in better standing in terms of spam filters and (ii) Using graphical text allows for more variety in the type of face and can make a better design overall.

Serif versus Sans-Serif: The preference is for sans-serif fonts for body copy for legibility.

Use universal fonts for HTML or dynamic text: For example, personalization (member’s name), expiration dates, store locations or just copy. Web safe fonts are: , , , Times- Roman, and , Arial Narrow, Arial Black, , MS, Impact, Console, Lucida Sans, and Trebuchet MS.

Note: While these fonts are commonly installed in most PC’s and MAC’s, keep in mind that when the email is programmed, a secondary basic font should be added in case one of these fonts is not available in the user’s computer.

Font size: Below is a rough comparison of web size to point size:

1 = 10 pt | 2 = 13 pt | 3 = 17 pt | 4 = 22 pt | 5 = 32 pt | 6 = 36 pt | 7 = 48 pt It’s rough because there is a variation in size between fonts on a Mac and on a PC; Mac fonts are smaller. Below is a sample of a the way a font tag should be written in HTML

p - 4 LOOP COMPONENTS [cont.]

LOOP MESSAGES DIAGRAM

Headline

Body Copy/

Offer

Closing Copy

Restrictions

Bottom Links

Powered by Unsubscribe Fishbowl Logo Language

Safe Sender Language

p - 5 LOOP COMPONENTS [cont.]

LOOP Naming Conventions

Welcome: save as – wlc Welcome message default copy - Welcome to our eClub. Thanks for Joining. To start your membership off on a good foot, bring this email in for a free (offer). Then get ready for more offers, promotions and announcements.

Birthday: save as – bdy Birthday message default copy – Happy Birthday. Celebrate your big day with a free (offer). Just print and bring this email to claim your special birthday treat. But hurry this offer expires xx/ xx/xx.

Belated Birthday: save as – bbdy Belated Birthday message default copy – Happy Belated Birthday. Sorry we missed your big day, but we still want to celebrate it with you by giving you a free (offer). Just print and bring this email to claim your special birthday treat. But hurry this offer expires xx/xx/xx.

Member Anniversary: save as – anv Anniversary message default copy – It’s been X years since you joined our eClub. And we want to celebrate this occasion by giving you a free (offer). Just print and bring this email the next time you visit us. But hurry this offer expires xx/xx/xx. Here’s to many more years together.

p - 6 LOOP COMPONENTS [cont.]

ALWAYS INCLUDED ON LOOP MESSAGES: 1) Safe Sender: To ensure delivery, add [email protected] to your address book.

2) Client Specific Links below the : ex.- visit us online | update your preferences | unsubscribe

3) Unsubscribe Language: This email was sent because you joined the [eMail Club Name] in one of our restaurants, online, or at one of our events. Personal information you provide is subject to our privacy policy. You can take your name out of the [eMail Club Name] at any time by clicking at the unsubscribe link on this email and you will be removed from our list immediately. Corporate Address.

4) Powered by Fishbowl Logo: This goes beside the Opt Out Language. Note: Some clients may opt out of having this logo. Check the LOF.

p - 7 LOOP COMPONENTS [cont.]

Online Join AND Preference FORMS Design the join page and the preference forms in one photoshop file and separate the layers with sub- folder. The width should be 800 pixels and the height around 600 pixels.

The design shell should be separated in sections below: Header - It should only include the logo and the name of your eClub. In this section you are allowed to add live text links, graphical rollovers driven by javascript or CSS and flash components, but this will require additional time for testing and it will be an additional cost.

Sub header- Two sub headers are needed. One with the title “Join our #Name of eClub#” and a second one with the title “Update Your Preferences”. These two titles should be in the same photoshop file in different group layers. These area should be part of the form area and not part of the header. If you have images in the sub headers DO NOT bleed them to either sides. A minimum of five pixels gap is needed on each side of the sub header.

Form area - This area needs to be expandable with a background color or a background image that tiles up. NO IMAGES are allowed this area and we do not support check boxes or radio buttons.

Footer - This section can contain pictures and/or text. Any language included in this area should be generic since, this footer will show for both your online join form and your member subscribe form. In this section you are allowed to add live text links, graphical rollovers driven by javascript or CSS and flash components, but this will require additional time for testing and it will be an additional cost.

All standard join pages must have the following fields: • First Name • Last Name • Email Address • Confirm Email Address • Date of Birth Month & Day • Zip • Favorite Location (design for 400 pixels wide drop down menu) If client has a lot of locations, we should suggest the client to add a zip locator.

p - 8 LOOP COMPONENTS [cont.]

ONLINE JOIN AND UPDATE YOUR INFORMATION PAGE DIAGRAM

800 pixels

HEADER (In this section we recommend to only add your logo and the name of your eClub)

SUB HEADER No image should bleed off to the edge. If you (You will need two sets of sub headers. One with the wording “Join Our eClub” do you will have to leave a 5 pixels gap. 5 PX 5 PX and the other one with the wording ”Update Your Preferences”)

This area needs to be expandable. You can FORM use a background color or a repeatable pattern. No other graphics allowed in this section.

FOOTER

p - 9 LOOP COMPONENTS [cont.]

Family join The Family Join form is an optional loop component which allows eclub members to add family mem- bers to their eclub account. The eclub member inserts the names and birthdays of family members, and on their birthday the family member will receive a birthday message.

Specifications See specifications for a standard join form. In addition, see template below. NOTE the family join is a separate component from the webjoin, but it uses the same design shell as the join form (header/ footer). However, a different design is possible as long as it uses the format below. FAMILY JOIN FORM

Header

Editable live text

{ Form

Minimum with of 500 pixels

Footer

Family Member Birthday message There are two ways a Birthday message can work. The same memeber message will be sent out for family members or a custom family member message can be created. This will be an additional cost.

One layout option is having the main message at the top and the offer spanning the width of the bottom. Another option is having the offer on the bottom right or left hand side. The reason for this is the offer area must be repeatable in case there are twins or family members who have the same birthday. Note that birthdays on the same day are the only way a member will receive multiple offers. See diagrams on next page.

p - 10 LOOP COMPONENTS [cont.]

FAMILY BIRTHDAY MESSAGE

HEADER Body of

message

Header Family Member Name #1

Repeatable

offer area Note: it is important to keep restrictions, expiration date and personalization within the offer area.

Family Member Name #2

Form

HEADER Footer

Dear Firstname, REPEATABLE INTRO TEXT OFFER AREA

REPEATABLE SOLID BG COLOR OFFER AREA

p - 11 LOOP COMPONENTS [cont.]

ZIP CODE LOCATOR If a zip code form is required, it will be added within this same design shell as the join and preference forms. Please be aware that a client with more than 50 locations will require a zip locator.

Each client can only have 1 store locator page. If they have 2 join pages (one for each concept), the zip locator page needs to be shared.

Each Zip Locator Page must have the following (Remember that this will have the same design shell as the join and preference page: • Header • Zip Code Field: and “try another zip code” copy • Go Button: • “Previous 5” and “Next 5” Buttons • 5 store locations with addresses • Select Buttons: Must say Select. No radio buttons!

p - 12 LOOP COMPONENTS [cont.]

Zip CODE LOCATOR DIAGRAM

Header

Please select your zip code

Select POTOMAC MILLS MALL 12.5 mi 2700 POTOMAC MILLS CIR STE 772 WOODBRIDGE, VA 22192

Select MONTGOMERY MALL 28.5 mi 7101 DEMOCRACY BLVD Zip Code Fields BETHESDA, MD 20817

Search again with a different zip:

SEARCH

Footer

p - 13 View Once Coupons

A view once coupon is a Fishbowl technology that can be applied to loop or monthly messages. This allows the user to view the message with the offer only once. If the user closes it and re-opens the message they will get an error message instead. Clients have the choice of two different view once coupons functionality and they are:

VIEW ONCE COUPON ON A JUMP PAGE (Most popular) The message is sent out with a click through a jump page that contains the coupon. The email should have language indicating that the user will only be able to see the coupon once and to have the printer ready before they click on it. The jump page should have the coupon, personalization, location information and a rolling expiration date. This is the most popular way to do view once.

VIEW ONCE COUPON WITHIN THE MESSAGE The message is sent out and the offer is within the email. The slice where the offer is located is the view once section and there is no need to click through anywhere to see it. The big benefit is that your computer will cache this view once image which will allow the user to close the message and re-open it as long as it’s open on the same computer. If you open the message on another computer, you will be able to see the message except for the slice that was coded as view once. You will instead get an empty image with an error indicating that you have already opened that email. The message should include personalization, location information and a rolling expiration date.

See diagram on next page.

p - 14 View Once Coupons [cont.]

VIEW ONCE WITH A JUMP PAGE

EMAIL JUMP PAGE

COUPON FIRST NAME LAST NAME 1234 STREET NAME CLICK HERE TO VIEW CITY, STATE ZIP CODE YOUR COUPON OFFER VALID UNTIL xx/xx/xxxx.

If you close this window and try to re-open it you will not get the coupon, but an error page

VIEW ONCE WITHIN THE MESSAGE

EMAIL

The offer area is the only section that is view once. If you open this message in another computer, you will OFFER not see the offer anymore. That area will have an error indicating that you have already viewed this message.

p - 15 POSTCARDS

File Size Ideal < 200-300K (including html file and graphics)

Be very conscious of the quantity and type of graphics being used; the more photographs the larger the file size. While Production does the optimizing, design with optimization in mind! Average file size is 300KB.

Dimensions (as appears on screen) Design should fit within monitor (800x600 resolution) with minimal or no scrolling

Custom Email - Width - 500-600px; Height - 450-600px

Note: Remember that (1) the email browser will take up a certain amount of that space depending upon the email client (e.g. Outlook versus Yahoo versus Hotmail) and that (2) email-related links and the unsubscribe disclaimer will take up space beneath the design.

Colors Use RGB colors. Stay away from light color fonts on dark backgrounds. This combination is hard to read and, especially for live text, poses some problems in terms of printing without backgrounds and in black and white.

Typeface Graphical versus Live Text: For Custom Email: (i) Using live text will save on file size plus put our emails in better standing in terms of spam filters and (ii) Using graphical text allows for more variety in the type of font face and can make a better design overall.

Serif versus Sans-Serif: The preference is for sans-serif fonts for body copy for legibility.

Use universal fonts for HTML or dynamic text: For example, personalization (member’s name), expiration dates, store locations or just copy. Web safe fonts are: Arial, Verdana, Helvetica, Times- Roman, and Georgia, Arial Narrow, Arial Black, Century Gothic, Comic Sans MS, Impact, Lucida Console, Lucida Sans, Palatino and Trebuchet MS.

Note: While these fonts are commonly installed in most PC’s and MAC’s, keep in mind that when the email is programmed, a secondary basic font should be added in case one of these fonts is not available in the user’s computer.

Font size: Below is a rough comparison of web size to point size:

1 = 10 pt | 2 = 13 pt | 3 = 17 pt | 4 = 22 pt | 5 = 32 pt | 6 = 36 pt | 7 = 48 pt It’s rough because there is a variation in size between fonts on a Mac and on a PC; Mac fonts are smaller. Below is a sample of a the way a font tag should be written in HTML

p - 16 POSTCARDS [cont.]

POSTCARD DIAGRAM

Headline

Body Copy/

Offer

Closing Copy

Restrictions

Bottom Links

Powered by Unsubscribe Fishbowl Logo Language

Safe Sender Language

p - 17 ADVANCED FORWARD TO A FRIEND [cont.]

NOTES: All the components of an Advanced FTF should be designed in a similar style to maintain continuity. Design begins with the Initial Postcard and should follow normal postcard specifications. (see general postcard design specs) Once the initial postcard is approved by the client, a new task is submitted to complete all the remaining components. The webforms and responses also need to follow normal design conventions. (see webform design specs)

COMPONENTS: • Initial Postcard: sent to existing eClub member asking them to invite friends. (follow normal PC design practices)

ONCE INITIAL POSTCARD IS APPROVED:

• FTF Web Form: Includes fields to enter member email and up to 5 friend’s email address and submit button. (follow normal webform design specs)

• Thank You Response: Generic Copy: “Thanks for referring your friends. You should receive your thank you gift within the next 24 hours.”

• Error Response: Generic Copy: “We have encountered an error. Reason Here.”

• Gift Postcard: Sent to club member with an offer as reward for inviting their friends. NOTE: This is not compliant with COPA laws. If a client requests one, please let the Art Director know immediately. This will require additional client release forms to be signed.

• Friend Postcard: Sent to member’s friend email address usually with an offer and a link to join the club.

p - 18 ADVANCED FORWARD TO A FRIEND [cont.] Email with ’s from friend riend a from line coming F viting or in response our friends y Thanks f

Diagram flow below. Diagram flow below. riends vite Up to F ve vanced FTF Fi Ad orm. In F Initial PC

p - 19 NEWSLETTERS

NEWSLETTER SUGGESTIONS AND THINGS TO CONSIDER: Newsletters are communications that hold more of information than a regular email and we usually set up in separate sections. Therefore, you should plan to spend double the time designing it. As the designer you should plan the order of the newsletter before you start designing it. You should get ALL the copy from the account executive or at least the number of characters and number of sections this newsletter will hold. The length of the newsletter will vary based on the number of articles.

Fishbowl Newsletter Best Practices • Keep every section in separate sub layers. • Use a combination of graphics for titles and live text for body copy • Keep the client’s logo on top. If it’s at the bottom the recipient might miss it • Give each section enough room around it. Try avoiding tight sections. This will cause production problems

Header: Name of newsletter, date, logo of restaurant and possible navigation.

Side Navigation: The navigation could be to jump pages or take you to pages from the client website.

Sections: Separate the sections of the newsletter with defined headers with titles or section the them off with another creative solution, boxes…lines… etc.

p - 20 NEWSLETTERS [cont.]

NEWSLETTER DIAGRAM

Header

(issue #, date, etc)

link 1

Sidebar link 2

(article links, link 3 side sections, link 4 etc.)

Articles/

Sections

Footer

p - 21 Local Store Marketing (LSM)

LSMs Local Store Marketing Templates are designed to give clients the opportunity to have a reusable template in which they can input they’re own copy. As opposed to postcards which offer no editing features. Clients have the ability to alter headlines, body copy, and other fields to suit their specific message. Although they are editable, LSMs have design restrictions in order to function properly.

1) Reusable postcard with editable copy for flexibility. 2) Max 650 pixels width 3) Two Versions: Expandable and Fixed Height (non expandable) 4) Main Fields – (Dummy Copy used and replaced by clients) • Headline • Body Copy • Offer • Closing Copy • Restrictions Copy • Date Copy (optional) • Price Points (optional) • CC Store Info - Store Name, Address, City , State, Phone # (All or some will be used per client request)

Colors Use RGB colors. Stay away from light color fonts on dark backgrounds. This combination is hard to read and, especially for live text, poses some problems in terms of printing without backgrounds and in black and white.

Typeface Graphical versus Live Text: For Custom Email: (i) Using live text will save on file size plus put our emails in better standing in terms of spam filters and (ii) Using graphical text allows for more variety in the typeface and can make a better design overall.

HTML Fonts - Arial, Verdana, Helvetica, Times-Roman, and Georgia, Arial Narrow, Arial Black, Century Gothic, Comic Sans MS, Impact, Lucida Console, Lucida Sans, Palatino and Trebuchet MS.

Note: While these fonts are commonly installed in most PC’s & MAC’s, keep in mind that when the email is coded, a secondary basic font should be added in case these fonts aren’t available in the user’s computer.

Font size: Below is a rough comparison of web size to point size: 1 = 10 pt | 2 = 13 pt | 3 = 17 pt | 4 = 22 pt | 5 = 32 pt | 6 = 36 pt | 7 = 48 pt It’s rough because there is a variation in size between fonts on a Mac and on a PC; Mac fonts are smaller. Below is a sample of a the way a font tag should be written in HTML

Social Share All social share icons MUST be provided for production.

Advanced/Rich text editor feature This allows for the user to select from a range of editable options for a field such as (font size, typeface, color and image upload) When this feature is requested in a template, please keep in mind it can ONLY be added to a completely expandable area.

p - 22 Local Store Marketing (LSM) [cont.]

DIFFERENT TYPES OF LSMs:

• EXPANDABLE TEMPLATES • Generally have a “header” and “footer” area. • Artwork must be able to increase in height to allow additional copy • Text must stay within expandable area • DO NOT use patterns or gradients behind live text. You can only use a solid RGB color • Area between header and footer must look the same from left to right

• FIXED HEIGHT (NONEXPANDABLE) TEMPLATES • Much more graphical content as expansion is not needed. • Copy fields are given character limits so they don’t break the design • Generally price points and small text areas are editable in these templates

• PHOTO UPLOAD • Clients have the option to have set areas for them to upload photos into • Max # of photo areas in a template is two • Upload area must be rectangular and NOT set on an angle • Upload area must NOT have borders

• FISHBOWL LOCAL • Fishbowl local clients use expandable templates about 99% of the time. • A library of “Generic Templates” is available for their selection • Generic templates are expandable templates that are designed around specific themes but not specifically for one client. • For Presentations: FB Local clients, have their logo and store info placed at the bottom of the email. (The space for these inputs are provided in the HTML Template.)

EXPANDABLE TEMPLATE WITH EXPANDABLE TEMPLATE NON-EXPANDABLE TEMPLATE PHOTO UPLOAD

HEADLINE GOES HERE HEADLINE GOES HERE HEADLINE GOES HERE Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Morbi commodo, ipsum sed pharetra gravida, orci magna Morbi commodo, ipsum sed pharetra gravida, orci magna Lorem ipsum dolor sit amet, consectetuer adipiscing elit. OFFER GOES HERE Morbi commodo, ipsum sed pharetra gravida, orci magna OFFER GOES HERE

Nam consectetuer. Sed aliquam, nunc eget euismod OFFER GOES HERE ullamcorper, lectus nunc ullamcorper orci, fermentum photo upload photo upload bibendum enim nibh eget ipsum. Nam consectetuer. Sed aliquam, nunc eget euismod .

Restrictions go here Nam consectetuer. Sed aliquam, libero cursus Restrictions go here Nam consectetuer. Sed aliquam Restrictions go here Nam consectetuer. Sed aliquam, libero cursus venenatis. Nam magna enim, accumsan eu, blandit sed, blandit a, venenatis. Nam magna enim, accumsan eu, blandit sed, blandit a, eros. Location Name eros. Street Name, Location Name City, State Zip Code Location Name Street Name, 555-555-1212 Street Name, City, State Zip Code City, State Zip Code 555-555-1212 555-555-1212

p - 23 ANIMATION

ANIMATION Animation in email marketing has become more and more popular in the past few years and now about 34% of marketing emails have some sort of animation in them. Animation can be deployed for a wide variety of purposes in emails and, if properly use, it can entertain, inform and inspire guests in ways that static images and text cannot. Keep in mind that Outlook 2k7 does not support animation and will only display the first frame.

BEST PRACTICES: • Don’t go overboard with animation, as too much can distract the reader, and increase file size. Bigger files=Decrease in open rates because it will take longer to load • Always use animated GIFS. (Flash is not supported by most email browsers) • In your PSD file, ALWAYS create a Subfolder with all your animation layers • Keep animation simple and to just a few frames • DO NOT create rotating photos. They get too large in size and Outlook 2k7 will only display the first frame. • Make sure that the first frame of the animated gif contains useful information in case the subsequent frames are blocked. Avoid fade-ins. • Animation cannot be viewed in Outlook 2007, therefore make sure your animation’s first frame carries all the important information • Animation should repeat. If not, make sure the animation waits a significant period of time before it starts to allow file downloading.

REASONS TO USE ANIMATION: • Animation draws the eye to less visible screen real estate, such as items below the fold. • Animation demonstrates critical product features that drive revenue and increase sales. • Animation adds visual interest to emails, particularly around holidays. • Animation emphasizes certain messages and key copy elements in emails.

p - 24 SIGN UP SLIPS

Dimensions, bleeds and resolution Dimensions: 4” x 6”, 5” x 7” or customized size* Crop marks Bleeds: 0.25” all around Resolution: 300 dpi *Requires 2-3 business day estimate process

Final file format High resolution pdf or InDesign files (indesign must include fonts and images)

Program compatibility InDesign :CS4; CS5 Adobe Acrobat 6.0; 7.0; 8.0

Colors 1/0 pms color CMYK (files must be prepped for 4 separate plates)** **Extra 10% charge if files are not prepped correctly.

p - 25 SIGN UP SLIPS [cont.]

Text and language that needs to be included Required additional language Title and subtitle First name field*** Please write legibly and use all capital letters. Last name field*** Email address field*** (two rows) Some employers block external email. Consider using your personal email address. Continue on second line if needed. Birthday*** - 2 fields for month, 2 fields for day and two fields for year (year is optional) Zip code*** Mobile – 3 fields By entering your mobile number you are opting-in to receive mobile alerts and offers. Standard Text Rates Apply. ***Required fields

Required legal copy We respect your privacy and will never rent or sell your information. Must be 13 years or older to join/participate. By providing your email address you are opting-in to receive email from our company and you may ask to stop receiving emails from us at any time.

BINDERY: Can be padded or loose depending on the design. If padded: glue bonded to chipboard, 50 sheets per pad.

p - 26 SIGN UP SLIPS [cont.]

Sign up sample

Join Our Email Club!

Thank you for visiting ##Restaurant Name##! By joining ##our Email Club Name##, you will receive a gift for joining, a gift for your birthday and exciting news and offers all year long – delivered straight to your email inbox.

First Name Please write legibly and use all capital letters.

Last Name

Email Address Some employers block external email. Consider using your personal email address.

Continue on second line if needed.

Birthday Zip Code RESTAURANT LOGO Month Day Year

##Restaurant Name## We promise to not sell, rent or distribute your information. You must be 13 years or older to join. By providing your email address you are opting-in to receive email from our company and you may ask to stop receiving emails from us at any time.

p - 27 Designing email for Outlook 2007

WHAT HAPPENED TO OUTLOOK 2007?

With the move from Outlook 2003 to Outlook 2007, Microsoft has changed the way emails will be rendered. Instead of using Internet Explorer it uses a single Microsoft Word-based engine, which does not support a number of commonly used HTML properties.

One of the driving factors likely prompting these changes is fixing known security holes and weaknesses. The heightened security and reduction in spam messages will lead to email becoming a safer marketing medium benefiting all parties involved.

There is expected to be a heightened number of Outlook 2007 users. Though this will mostly affect B2B marketers, many consumers also use Outlook as their home email client, some with a non-corporate email address (e.g. yahoo.com or gmail.com).

HOW THIS WILL IMPACT EMAIL DESIGN Though deliverability should not be affected, Microsoft’s changes will cause HTML emails designed under today’s standards to break or render incorrectly. Following are some recommendations on how to restructure HTML emails to maximize visibility.

Tip #1: Design with Image Blocking in Mind

As with Outlook 2003, 2007 also blocks images by default, unless viewers ‘allow’ images.

WHAT TO DO: In order to display parts of the message without turning the images on, make sure your primary call to action (body copy) is displayed in live text and make sure you have ALT tags for images in case they aren’t displayed.

Tip #2: Don’t rely on background images

Many designers use HTML or CSS background images such as gradients, dropshadows and pictures behind “live text” to create visual impact within their emails. Outlook 2007 will not support background images of any kind.

WHAT TO DO: Be sure important information is not embedded in a background image. Use background images as a design treatment only, not in a way in which the overall design will be compromised if the background image is not visible.

Also provide a RGB background color (hex color) as a backup for images. For example, if you are using white text, don’t rely solely on a background image to allow the text to be legible. When Outlook 2007 doesn’t render the background image, you’ll be left with white text against a white background.

As a rule of thumb, body copy should be live text with a solid, RGB based background color (no gradients). Headlines and offers should be graphical and may have a background image. “First name” and expiration date must always be live text.

p - 28 Designing email for Outlook 2007 [cont.]

Tip #3: Animated GIFs

Outlook 2007 does NOT support animated GIFs. Outlook 2007 displays a static version of the first frame of the animation.

WHAT TO DO: If you want to use animated GIFs, be sure that all important content is in the first frame of your animated GIF. Avoid using an animation where the relevant content is not included in the first frame.

If animation is required, feature a link to a jump page or website where animated GIFs or rich media (Flash) can be played without an issue.

NOW WHAT?

Designing effectively for Outlook 2007 and other email providers may require more time, resources and strategy. The good news is, adding a few modifications to tried and true best practices will still result in effective email campaigns and emails will look their best for all email users. See the example below for basic changes you can make to your next email message.

p - 29 Custom Facebook Join Pages

Fishbowl can set up a custom tab in your Facebook fan page with your join page fields. Below are the requirements and specs.

Requirements

• Your restaurant needs to have a fan page and not a profile page

• Fishbowl will need an administrator login and password to get into your settings. This will only be needed once, unless you change the artwork later, so we suggest to change your password after your join page is set up.

Specs

• If Fishbowl hosts your web join, we will use the same artwork used for your join and preference forms

• If Fishbowl hosts your web join, but you have a custom form (quick subscribe) your form, we will use the artwork that is currently used for your preferences form. This also applies if you host your join form, but Fishbowl hosts your preferences form.

• If you host your web join and your preference form and we will need custom following diagram below.

• The width of the artwork CANNOT exceed 750 pixels

750800 pixels

HEADER (In this section we recommend to only add your logo and the name of your eClub)

SUB HEADER No image should bleed off to the edge. If you (You will need two sets of sub headers. One with the wording “Join Our eClub” do you will have to leave a 5 pixels gap. 5 PX 5 PX and the other one with the wording ”Update Your Preferences”)

This area needs to be expandable. You can FORM use a background color or a repeatable pattern. No other graphics allowed in this section.

FOOTER

p - 30 Designing email for Outlook 2007 [cont.]

Specs [Cont.]

• The only fields that we can support are First Name, Last Name, Birthday and Zip Code. We DO NOT support a location drop down. If you are set up with a zip locator form, Facebook will re-route you to this form after you input your zip code and click “Save”.

• For clients WITHOUT a zip locator, all members that come through Facebook will have unknown store code (UNK).

Note - Fishbowl will be able to track who joined from Facebook.

Internal Process

• All custom Facebook Join page form projects will NOT have an AE or client review, since all creative will be doing is re-sizing the existing artwork. You will just need to save the re-sized PSD file to the repository and follow the regular creative prep steps.

• If you come across a client that hosts their join and preference page, please let the AE know that we will need custom make one based on the client form graphics. In this case, the artwork will require client approval.

p - 31 Standard Image BaseD Template 1.0

Diagram

Personalization and/or A optional paragraph B

5 uploadable image fields

Personalization and/or C optional paragraph

D Social Media

Email footer

p - 32 Image BaseD Templates

An Image Base Template is a template allow Fishbowl to code an email with less HTML custom coding. This template contains six image fields and a text field on top and at the bottom. These text fields can be utilize for personalizations, conditional content store information or just text.

Diagram

PERSONALIZATION AND/OR A OPTIONAL PARAGRAPH B IMAGE 1 (Only one hyperlink per slice)

IMAGE 2 (Only one hyperlink per slice)

IMAGE 3 (Only one hyperlink per slice)

IMAGE 4 (Only one hyperlink per slice)

IMAGE 5 (Only one hyperlink per slice)

PERSONALIZATION AND/OR C OPTIONAL PARAGRAPH UP TO SIX SOCIAL MEDIA ICONS D WITH LINKS. Ex., facebook, twitter, etc.

p - 33 IMAGE BASED TEMPLATES 2.0

Diagram

I A B Text version C I I A B HTML version C

D Image fields and images with text field E F Duplication of seccions D&E x6 g Concluding text

h Social Media

i J K Email footer L

p - 34 IMAGE BASED TEMPLATES 2.0

The SIB 2.0 much more complex than the original. This template contains all the same advantages of it’s predicessor but now allows multiple image and text fields throughout. The image uploads can be used as image mapped links, the same as the original, but this version allows us to have multiple images / links on the same line. There is also an area built into the template to allow live text to sit next to images.

Diagram

Personalization / Optional intro paragraph

Six (6) collapsible image upload fields allowing up to six (6) hyperlinks

X6 Two (2) image upload fields, followed by one (1) multi-line advanced text field, followed by two (2) more image upload fields. All fields are collapsible.*

*This is the above section repeated, showing all four images collapsed, so a text field remains.

*This is the above section repeated, 3 of the image upload fields collapsed as well as the text field, so an image upload remains. Six (6) collapsible image upload fields allowing up to six (6) hyperlinks (social media) Multiline advanced text field for concluding text optional Forward to a Friend Global variables and Loop & Postcard links

Common Footer

p - 35