CTA’s & Call-Out Flags

General Guidelines

CTA’s are used in two styles; text and button. All calls to action must set the users expectation of the click through.

Type style should be Arial Bold.

CTA’s must start with “shop” followed by the product or style name. When the product name and “shop” combination are too long to put in the given space, the CTA can simply use the product name or “shop now” as long as the intended destination is clear.

The text style is used as the primary call to action. The button style should only be used when the text style is illegible.

CTA’s should typically use the same contrasting neutral color as the rest of the text (headline and/or sub-headline), #FFFFFF or #333333

Never add noticeable drop shadows to CTA’s.

Guidelines for writing CTA’s can be found in the Copy & Voice section.

Please note: The directions outlined on the page above apply to all current (“old”) website placements. However, for placements using the “new” site dimensions specified, a CTA will not be required.

Mobile

Guidelines

Text Style CTA
Arial Regular Underlined, Title Case, 18px

Button Style CTA
Text: Arial Bold, Uppercase, 18px
Background: 35px horizontal & 21px vertical padding from text, rounded corners

Call-out Flag
Text: Arial Bold, Uppercase, 18pxt
Background: 10px horizontal & vertical padding from text

Desktop & Tablet

Guidelines

Text Style CTA
Arial Regular Underlined, Title Case, 14px

Button Style CTA
Text: Arial Bold, Uppercase, 14px
Background: 26px horizontal & 16px vertical padding from text, rounded corners

Call-out Flag
Text: Arial Bold, Uppercase, 14px
Background: 10px horizontal & vertical padding from text

Examples