# Design Development / Best Practices

# Email Signature Design

# Best Practices Guide

## **Size & Dimensions**

### **Overall Dimensions**

- **Maximum width:** 600-700px (recommended: 320-600px)
- **Maximum height:** 200-300px (recommended: 150-200px)
- **File size:** Keep under 1MB total (ideally under 500KB)
- **Mobile consideration:** Design should scale well to 320px width

### **Image Specifications**

- **Format:** PNG or JPG (PNG preferred for logos with transparency)
- **Resolution:** 72 DPI (web standard)
- **Logo size:** Maximum 150px wide × 100px high
- **Social icons:** 16px × 16px to 24px × 24px

---

## **Typography & Fonts**

### **Safe Web Fonts** (Use these for maximum compatibility)

**Serif:**

- Georgia
- Times New Roman
- Times

**Sans-Serif:**

- Arial
- Helvetica
- Verdana
- Tahoma
- Trebuchet MS
- Geneva

### **Font Guidelines**

- **Primary text:** 12-14px
- **Name/Title:** 14-16px (can be bold)
- **Company name:** 12-14px
- **Contact details:** 11-12px
- **Legal disclaimers:** 9-10px
- **Line height:** 1.2-1.4 for readability

### **⚠️ Avoid:**

- Custom web fonts (Google Fonts, etc.)
- Decorative or script fonts
- Font sizes smaller than 9px

---

## **Design & Layout**

### **Structure Best Practices**

- **Left-aligned** layout works best across all clients
- **Single column** design preferred
- **Clear hierarchy** with proper spacing
- **Consistent margins:** 10-15px between sections

### **Color Guidelines**

- **Text color:** Dark colors (#333333, #000000) for body text
- **Links:** Blue (#0066CC) or brand colors
- **Backgrounds:** White or very light colors
- **Contrast ratio:** Minimum 4.5:1 for accessibility

### **Visual Elements**

- **Separators:** Use simple lines (1px solid) or spacing instead of complex graphics
- **Icons:** Use standard, recognizable symbols
- **White space:** Essential for readability and professional appearance