| |
|
Meridian Press · Số 47 | |
Kho lưu trữ chính là sản phẩmBa tuần trước tôi đi tìm một bài viết năm 2019 và không tìm thấy. Không có trên trang, không có trong bản xuất, không có trong công cụ tìm kiếm của chính nền tảng. Một nghìn hai trăm số, và mục lục duy nhất còn hoạt động là trí nhớ của tôi. Đó là phần không ai kể cho bạn về sáu năm làm bản tin. Gửi đi thì dễ. Giữ lại thì không. | |
| |
|
Vì vậy tuần này tôi dựng lại các số cũ thành một kho lưu trữ thật sự, có thẻ, tìm kiếm toàn văn và địa chỉ vĩnh viễn. Mất chín ngày. Số người đăng ký không nhúc nhích. Thời gian ở lại trang tăng gấp ba. Toàn bộ nằm bên dưới, kể cả những phần không thành công. | |
| Đọc trọn số này → | |
|
Viết tay mỗi thứ Năm. Trả lời đi, tôi đọc hết. Meridian Press, 14 Harbour Lane, Bristol BS1 4TT |
```
**Alt text kém:**
```html
```
## Tâm lý màu sắc và cách sử dụng
Màu sắc ảnh hưởng đến cảm xúc, hướng dẫn sự chú ý và củng cố nhận dạng thương hiệu.
### Tâm lý màu sắc trong email
| Màu | Liên tưởng | Tốt nhất cho |
| --- | --- | --- |
| Xanh dương | Tin tưởng, ổn định, bình tĩnh | Tài chính, công nghệ, y tế |
| Đỏ | Khẩn cấp, phấn khích, đam mê | Đợt giảm giá, CTA, sự cấp bách |
| Xanh lá | Tăng trưởng, sức khỏe, thiên nhiên | Bền vững, sức khỏe, thành công |
| Cam | Năng lượng, sáng tạo, ấm áp | CTA, thương hiệu trẻ trung |
| Tím | Sang trọng, sáng tạo, khôn ngoan | Thương hiệu cao cấp, làm đẹp |
| Vàng | Lạc quan, rõ ràng, ấm áp | Điểm nổi bật, thu hút sự chú ý |
| Đen | Tinh tế, sang trọng | Cao cấp, thời trang |
| Trắng | Sạch sẽ, tối giản, thuần túy | Không gian, nền |
### Hướng dẫn tỷ lệ màu sắc
Tuân theo quy tắc 60-30-10:
- **60%:** Màu chính/nền
- **30%:** Màu phụ
- **10%:** Màu điểm nhấn (CTA, điểm nổi bật)
### Độ tương phản màu sắc cho khả năng truy cập
Đảm bảo độ tương phản đủ giữa văn bản và nền:
- **Văn bản thông thường:** Tỷ lệ tương phản tối thiểu 4,5:1
- **Văn bản lớn (18px+):** Tỷ lệ tương phản tối thiểu 3:1
- **Sử dụng công cụ:** WebAIM Contrast Checker
**Ví dụ độ tương phản cao:**
- Đen (#000000) trên trắng (#FFFFFF) - 21:1
- Xanh đậm (#003366) trên trắng - 12,6:1
- Trắng trên tím đậm (#4A154B) - 10,8:1
### Màu nút CTA
Nút kêu gọi hành động của bạn cần nổi bật ngay lập tức:
- Sử dụng màu điểm nhấn tương phản cao nhất
- Duy trì tính nhất quán trên tất cả email
- A/B test các màu khác nhau để tối ưu hiệu suất
- Đảm bảo màu khác với link văn bản thân
## Khả năng truy cập email
Thiết kế email có thể truy cập đảm bảo tất cả người đăng ký có thể tương tác với nội dung, bao gồm những người sử dụng công nghệ hỗ trợ.
### Hướng dẫn WCAG cho email
Hướng dẫn Khả năng Truy cập Nội dung Web (WCAG) áp dụng cho email:
#### 1. Có thể cảm nhận
- Cung cấp văn bản thay thế cho hình ảnh (alt text)
- Không chỉ dựa vào màu sắc để truyền đạt thông tin
- Đảm bảo độ tương phản màu sắc đủ
- Làm cho văn bản có thể thay đổi kích thước mà không phá vỡ bố cục
#### 2. Có thể vận hành
- Tất cả chức năng có sẵn qua bàn phím
- Cung cấp cho người dùng đủ thời gian để đọc nội dung
- Không sử dụng nội dung nhấp nháy có thể gây ra cơn động kinh
#### 3. Dễ hiểu
- Sử dụng ngôn ngữ rõ ràng, đơn giản
- Duy trì điều hướng nhất quán
- Cung cấp thông báo lỗi rõ ràng
#### 4. Mạnh mẽ
- Sử dụng HTML hợp lệ
- Kiểm tra trên các email client khác nhau
- Đảm bảo tương thích với công nghệ hỗ trợ
### Danh sách kiểm tra email có thể truy cập
- Tất cả hình ảnh có alt text mô tả
- Độ tương phản màu đáp ứng tiêu chuẩn WCAG AA (4,5:1)
- Link có mô tả (“Đọc hướng dẫn” không phải “Nhấp vào đây”)
- Font chữ ít nhất 14px (ưu tiên 16px)
- Email có thứ tự đọc logic
- Bảng chỉ dùng cho bố cục, không phải dữ liệu (hoặc có tiêu đề đúng)
- Ngôn ngữ được khai báo trong HTML
- Chỉ báo focus hiển thị cho các yếu tố tương tác
### Cân nhắc trình đọc màn hình
Cấu trúc email cho người dùng trình đọc màn hình:
- Sử dụng HTML ngữ nghĩa khi có thể (h1, h2, p, v.v.)
- Cung cấp phiên bản văn bản thuần
- Bao gồm link “Xem trong trình duyệt”
- Tránh email chỉ có hình ảnh
- Kiểm tra với VoiceOver, NVDA hoặc JAWS
## Thiết kế CTA hiệu quả
Kêu gọi hành động là nơi thiết kế gặp chuyển đổi. Làm đúng.
### Thực hành tốt nhất nút CTA
#### Kích thước và hình dạng
- **Kích thước tối thiểu:** Chiều cao 44px, chiều rộng 120px
- **Padding:** Ít nhất 12-16px dọc, 24-32px ngang
- **Hình dạng:** Góc bo tròn (4-8px) thường vượt trội hơn góc sắc
#### Màu sắc và độ tương phản
- Sử dụng màu điểm nhấn sáng nhất
- Đảm bảo tương phản cao với nền
- Văn bản nút phải rất dễ đọc
#### Hướng dẫn văn bản
- Sử dụng động từ hành động: “Mua ngay”, “Bắt đầu”, “Tải xuống”
- Tạo sự cấp bách khi phù hợp: “Nhận chiết khấu của bạn”
- Giữ ngắn: 2-5 từ
- Tránh văn bản chung chung: “Nhấp vào đây”, “Gửi”, “Tìm hiểu thêm”
### Vị trí CTA
- **CTA chính:** Trên màn hình đầu (hiển thị mà không cần cuộn)
- **CTA phụ:** Sau nội dung hỗ trợ
- **Một CTA chính mỗi email** (tránh tê liệt quyết định)
### Ví dụ CTA chuyển đổi cao
| Ngành | CTA hiệu quả |
| --- | --- |
| Thương mại điện tử | ”Mua trong đợt giảm giá” |
| SaaS | ”Bắt đầu dùng thử miễn phí” |
| Nội dung | ”Đọc hướng dẫn đầy đủ” |
| Sự kiện | ”Đặt chỗ của tôi” |
| Newsletter | ”Nhận mẹo hàng tuần” |
### Nút so với link văn bản
Sử dụng nút cho hành động chính và link văn bản cho hành động phụ:
```
[MUA NGAY] ← Nút chính (trọng lượng trực quan cao)
hoặc xem hàng mới về → ← Link văn bản phụ
```
## Ví dụ email newsletter theo ngành
Hãy xem xét các thiết kế newsletter hiệu quả trong các ngành khác nhau.
### Thiết kế newsletter thương mại điện tử
**Các yếu tố chính:**
- Nhiếp ảnh sản phẩm chất lượng cao
- Hiển thị giá rõ ràng
- Nhiều giới thiệu sản phẩm
- Thông điệp khuyến mãi mạnh
- Nút “Mua” dễ chạm
**Khuyến nghị bố cục:** Lưới module với card sản phẩm
```
┌────────────────────────────────────┐
│ BANNER GIẢM GIÁ │
├────────────────────────────────────┤
│ [SẢN PHẨM HERO] │
│ GIẢM 30% │
│ [MUA NGAY] │
├─────────────┬──────────────────────┤
│ [SẢN PHẨM 1]│ [SẢN PHẨM 2] │
│ $49.99 │ $79.99 │
├─────────────┴──────────────────────┤
│ MIỄN PHÍ VẬN CHUYỂN CHO ĐƠN TRÊN $75│
└────────────────────────────────────┘
```
### Thiết kế newsletter SaaS/Công nghệ
**Các yếu tố chính:**
- Thẩm mỹ sạch sẽ, tối giản
- Điểm nổi bật tính năng với icon
- Tập trung nội dung giáo dục
- Đề xuất giá trị rõ ràng
- Hình ảnh chuyên nghiệp
**Khuyến nghị bố cục:** Một cột với các khối tính năng
```
┌────────────────────────────────────┐
│ THÔNG BÁO TÍNH NĂNG MỚI │
├────────────────────────────────────┤
│ [ẢNH CHỤP MÀN HÌNH TÍNH NĂNG] │
├────────────────────────────────────┤
│ ✓ Lợi ích một │
│ ✓ Lợi ích hai │
│ ✓ Lợi ích ba │
├────────────────────────────────────┤
│ [DÙNG THỬ NGAY] │
└────────────────────────────────────┘
```
### Thiết kế newsletter Truyền thông/Xuất bản
**Các yếu tố chính:**
- Phân cấp typography mạnh
- Xem trước bài viết với hình ảnh
- Tổ chức theo danh mục
- Dòng tác giả
- Chỉ báo thời gian đọc
**Khuyến nghị bố cục:** Lưới nội dung dạng card
```
┌────────────────────────────────────┐
│ BÀI VIẾT HÀNG ĐẦU │
│ [HÌNH ẢNH LỚN] │
│ Văn bản tiêu đề ở đây │
│ Đoạn trích ngắn... │
├─────────────┬──────────────────────┤
│ [BÀI VIẾT 2]│ [BÀI VIẾT 3] │
│ Tiêu đề │ Tiêu đề │
├─────────────┴──────────────────────┤
│ XEM THÊM BÀI VIẾT → │
└────────────────────────────────────┘
```
### Thiết kế newsletter B2B/Dịch vụ Chuyên nghiệp
**Các yếu tố chính:**
- Thiết kế bảo thủ, chuyên nghiệp
- Nội dung lãnh đạo tư tưởng
- Case study và dữ liệu
- Quảng bá sự kiện
- Tải xuống tài nguyên
**Khuyến nghị bố cục:** Một cột chuyên nghiệp
```
┌────────────────────────────────────┐
│ [LOGO CÔNG TY] │
├────────────────────────────────────┤
│ THÔNG TIN CHUYÊN SÂU THÁNG NÀY │
├────────────────────────────────────┤
│ 📊 Báo Cáo Ngành │
│ Những phát hiện chính từ │
│ phân tích thị trường mới nhất │
│ [ĐỌC THÊM] │
├────────────────────────────────────┤
│ 📅 Webinar Sắp Diễn Ra │
│ 15/3 lúc 14:00 (EST) │
│ [ĐĂNG KÝ] │
└────────────────────────────────────┘
```
## Công cụ và tài nguyên thiết kế email
### Nền tảng thiết kế
**Trình tạo kéo thả:**
- Mailchimp
- Klaviyo
- Campaign Monitor
**Công cụ thiết kế chuyên nghiệp:**
- Figma (thiết kế và tạo mẫu)
- Adobe XD
- Sketch
### Tài nguyên template
**Template miễn phí:**
- Thư viện template Brevo
- Template Litmus Community
- Template Email on Acid
**Template cao cấp:**
- ThemeForest email templates
- Envato Elements
- Creative Market
### Công cụ kiểm thử
- **Litmus** - Xem trước email trên 90+ client
- **Email on Acid** - Kiểm thử trên nhiều client
- **Mail Tester** - Kiểm tra điểm spam
- **Accessible Email** - Xác nhận khả năng truy cập
## Những lỗi thiết kế email phổ biến cần tránh
### 1. Email nặng về hình ảnh
**Vấn đề:** Một số email client chặn hình ảnh theo mặc định. Email chỉ có hình ảnh trông trống rỗng.
**Giải pháp:** Luôn bao gồm văn bản trực tiếp. Sử dụng hình ảnh để nâng cao, không thay thế, nội dung.
### 2. Quá nhiều CTA
**Vấn đề:** Nhiều CTA cạnh tranh tạo ra tê liệt quyết định.
**Giải pháp:** Một CTA chính mỗi email. Sử dụng link văn bản cho hành động phụ.
### 3. Bỏ qua di động
**Vấn đề:** Thiết kế trông tuyệt vời trên máy tính nhưng thất bại trên di động.
**Giải pháp:** Thiết kế ưu tiên di động. Kiểm tra trên nhiều thiết bị trước khi gửi.
### 4. Độ tương phản kém
**Vấn đề:** Văn bản tương phản thấp khó đọc và không đáp ứng tiêu chuẩn khả năng truy cập.
**Giải pháp:** Sử dụng công cụ kiểm tra độ tương phản. Duy trì tỷ lệ tối thiểu 4,5:1.
### 5. Bố cục chật chội
**Vấn đề:** Thiết kế dày đặc làm người đọc choáng ngợp và giảm tương tác.
**Giải pháp:** Sử dụng khoảng trắng. Tập trung vào ít nội dung hơn nhưng chất lượng cao hơn.
### 6. Thương hiệu không nhất quán
**Vấn đề:** Email không khớp với website làm người đăng ký nhầm lẫn.
**Giải pháp:** Tạo hướng dẫn thương hiệu email. Sử dụng template để duy trì tính nhất quán.
### 7. Email tải chậm
**Vấn đề:** File lớn mất quá nhiều thời gian để tải, đặc biệt trên di động.
**Giải pháp:** Nén hình ảnh. Giữ tổng kích thước email dưới 1MB.
## Kết luận
Thiết kế email newsletter vừa là nghệ thuật vừa là khoa học. Các nguyên tắc được đề cập trong hướng dẫn này, phân cấp trực quan, tối ưu di động, khả năng truy cập, typography và vị trí CTA chiến lược, tạo thành nền tảng của các newsletter thu hút và chuyển đổi.
Ghi nhớ những điểm chính:
1. **Thiết kế ưu tiên di động** - Đa số người đăng ký sẽ đọc trên điện thoại
2. **Ưu tiên sự rõ ràng** - Mỗi yếu tố nên phục vụ một mục đích
3. **Duy trì thương hiệu nhất quán** - Xây dựng nhận dạng với mỗi lần gửi
4. **Kiểm thử liên tục** - Những cải tiến nhỏ tích lũy theo thời gian
5. **Tập trung vào khả năng truy cập** - Thiết kế cho tất cả người đăng ký, không chỉ đa số
Thiết kế newsletter tuyệt vời không phải là theo mọi xu hướng mà là tạo ra thông tin liên lạc rõ ràng, hấp dẫn, đúng thương hiệu tôn trọng thời gian và sự chú ý của người đăng ký.
Sẵn sàng tạo newsletter đẹp, chuyển đổi cao?
## Tajo phù hợp ở đâu
Tajo: công cụ xây dựng tích hợp vận hành bằng tác nhân. Giữ nguyên nhà cung cấp của bạn. Các tác nhân kết nối mọi thứ còn lại, và bạn phê duyệt từng đồng bộ. Tajo đang trong giai đoạn truy cập sớm. [Đăng ký dùng sớm](https://tajo.io/vi/#early-access)
## Câu hỏi Thường gặp
**Làm thế nào để bắt đầu email newsletter?**
Chọn nền tảng (Brevo cung cấp newsletter miễn phí), xác định nội dung tập trung, xây dựng danh sách người đăng ký với biểu mẫu đăng ký, tạo lịch gửi nhất quán và thiết kế template sạch sẽ, thân thiện với di động.
**Nên gửi newsletter bao nhiêu lần?**
Hàng tuần là tần suất phổ biến và hiệu quả nhất. Bắt đầu với nhịp độ bền vững mà bạn có thể duy trì nhất quán. Chất lượng quan trọng hơn tần suất, tốt hơn là gửi nội dung tuyệt vời hàng tháng còn hơn nội dung tầm thường hàng ngày.
**Nên bao gồm gì trong newsletter?**
Kết hợp nội dung giáo dục (70%), nội dung khuyến mãi (20%) và nội dung cá nhân/hậu trường (10%). Bao gồm CTA rõ ràng, dòng tiêu đề hấp dẫn và làm cho nội dung dễ đọc lướt với tiêu đề và điểm đạn.
**Chiều rộng lý tưởng cho email newsletter là bao nhiêu?**
Chiều rộng tiêu chuẩn và được khuyến nghị cho email newsletter là \*\*600 pixel\*\*. Chiều rộng này hoạt động tốt trên hầu hết email client và thiết bị trong khi cung cấp đủ không gian cho nội dung. Đối với di động, email nên responsive và điều chỉnh theo chiều rộng màn hình, thường xếp chồng bố cục đa cột thành một cột.
**Nên bao gồm bao nhiêu hình ảnh trong newsletter?**
Không có quy tắc cố định, nhưng một hướng dẫn tốt là duy trì \*\*tỷ lệ văn bản-hình ảnh 60:40\*\*. Điều này đảm bảo email hiển thị đúng khi hình ảnh bị chặn và giúp với khả năng giao hàng. Hầu hết newsletter hoạt động tốt với 1-3 hình ảnh hero hoặc tính năng cộng với hình ảnh sản phẩm hoặc hỗ trợ nhỏ hơn. Luôn bao gồm alt text và tránh email chỉ có hình ảnh.
**Font chữ nào hoạt động tốt nhất cho email newsletter?**
Font an toàn cho web như \*\*Arial, Helvetica, Georgia và Verdana\*\* hiển thị nhất quán trên tất cả email client. Bạn có thể sử dụng web font (Google Fonts, Adobe Fonts) với các dự phòng đúng, nhưng hãy lưu ý rằng một số client như Outlook sẽ hiển thị font dự phòng. Giữ tối đa 1-2 họ font cho thiết kế sạch sẽ, chuyên nghiệp.
**Làm thế nào để làm cho email có thể truy cập?**
Các thực hành khả năng truy cập chính bao gồm: sử dụng \*\*alt text\*\* trên tất cả hình ảnh, duy trì \*\*độ tương phản màu 4,5:1\*\* cho văn bản, sử dụng \*\*văn bản link mô tả\*\* (không phải "nhấp vào đây"), đảm bảo \*\*kích thước font tối thiểu 14-16px\*\*, cung cấp \*\*phiên bản văn bản thuần\*\* và cấu trúc nội dung với \*\*phân cấp tiêu đề đúng\*\*. Kiểm thử với trình đọc màn hình khi có thể.
**Có nên sử dụng thiết kế dark mode cho newsletter không?**
Có, bạn nên cân nhắc dark mode. Hơn \*\*80% người dùng\*\* đã bật dark mode trên ít nhất một thiết bị. Mẹo thiết kế bao gồm: tránh nền trắng thuần túy (dùng trắng ngà), cung cấp cả phiên bản logo sáng và tối, sử dụng PNG trong suốt cho đồ họa và kiểm thử email ở cả chế độ sáng và tối. Một số email client sẽ tự động đảo màu, vì vậy hãy kiểm thử kỹ lưỡng.
**Định dạng hình ảnh nào tốt nhất cho email?**
\*\*JPEG\*\* tốt nhất cho ảnh chụp và hình ảnh phức tạp với nhiều màu. \*\*PNG\*\* lý tưởng cho đồ họa có trong suốt, logo và hình ảnh có văn bản. \*\*GIF\*\* hoạt động cho hoạt hình đơn giản. \*\*WebP\*\* cung cấp nén tốt hơn nhưng hỗ trợ email client hạn chế, luôn cung cấp dự phòng. Giữ kích thước file dưới 200KB cho hình ảnh chính và hướng đến dưới 1MB tổng kích thước email.
**Làm thế nào để cải thiện tỷ lệ nhấp email newsletter?**
Để cải thiện tỷ lệ nhấp: đặt \*\*CTA chính trên màn hình đầu\*\*, sử dụng \*\*màu nút tương phản\*\*, viết \*\*văn bản nút hướng hành động\*\*, đảm bảo nút \*\*ít nhất 44px chiều cao\*\* để dễ chạm, \*\*giới hạn số lượng CTA\*\* (một chính mỗi email), tạo \*\*hệ thống phân cấp trực quan\*\* dẫn đến CTA và \*\*A/B test\*\* các thiết kế, màu sắc và vị trí khác nhau.
**Nên cập nhật thiết kế newsletter bao nhiêu lần?**
Duy trì \*\*thương hiệu nhất quán\*\* để nhận dạng trong khi thực hiện \*\*tối ưu nhỏ liên tục\*\* dựa trên dữ liệu hiệu suất. Cân nhắc \*\*làm mới thiết kế lớn\*\* mỗi 12-18 tháng để cập nhật xu hướng thiết kế. Luôn A/B test các thay đổi đáng kể trước khi triển khai cho toàn bộ danh sách. Các biến thể theo mùa và thiết kế phiên bản đặc biệt có thể cung cấp sự đa dạng mà không mất tính nhất quán thương hiệu.
## Bài viết liên quan
### [10 Nền Tảng Newsletter Tốt Nhất Cho Người Sáng Tạo Và Doanh Nghiệp (2026)](https://tajo.io/vi/blog/best-newsletter-platforms/)
22 thg 3, 2026 · 18 phút đọc
7 phần
### [So sánh phần mềm bản tin email: mô hình giá, công cụ cho creator và độ phù hợp ecommerce (2026)](https://tajo.io/vi/blog/email-newsletter-software/)
8 thg 3, 2026 · 24 phút đọc
10 phần
### [12 Công Cụ Tạo Newsletter Tốt Nhất Năm 2026: Hướng Dẫn So Sánh Toàn Diện](https://tajo.io/vi/blog/newsletter-builder-guide/)
8 thg 3, 2026 · 18 phút đọc
10 phần