Khi bạn dán một liên kết vào tin nhắn, một dòng tweet, một bài đăng LinkedIn hay một kênh Slack, nền tảng sẽ kéo ra một thẻ xem trước — một ảnh lớn, một tiêu đề, một đoạn trích. Ảnh đó chính là ảnh Open Graph (OG), và nó đang làm việc nhiều hơn cả tiêu đề của bạn. Trong một dòng tin cuộn nhanh, hình ảnh mới là thứ chặn ngón tay người xem lại. Một ảnh xem trước trống trơn hay hỏng bị coi là làm qua loa và bị lướt qua.
Đây là cách tạo một ảnh xứng đáng được nhấp, đúng kích thước, với chữ thực sự đọc được.
Kích thước: 1200×630
Ảnh OG tiêu chuẩn là 1200×630 pixel, tỷ lệ 1.91:1. Facebook, LinkedIn, Slack, Discord và hầu hết các hệ thống xem trước liên kết đều được xây dựng quanh nó. Làm đúng cái này là bạn đã ổn ở gần như mọi nơi.
Một vài kích thước liên quan xuất hiện tùy theo nơi liên kết được dán:
| Nền tảng / công dụng | Kích thước | Tỷ lệ |
|---|---|---|
| Open Graph (mặc định) | 1200×630 | 1.91:1 |
| Thẻ lớn Twitter/X | 1200×628 | ~1.91:1 |
| Ảnh thu nhỏ YouTube | 1280×720 | 16:9 |
| Vuông (dòng tin/IG) | 1080×1080 | 1:1 |
| Story / dọc | 1080×1920 | 9:16 |
Bạn không cần tất cả những cái này cho một bài blog — 1200×630 là con ngựa thồ. Nhưng nếu bạn còn làm ảnh thu nhỏ video hay một bài đăng vuông, tạo đúng hình dạng sẽ tốt hơn là cắt vụng một ảnh để nhét vừa.
Quy tắc chữ: đọc được ở kích thước thu nhỏ
Sai lầm giết chết ảnh OG là coi chúng như một tấm áp phích xem toàn màn hình. Bạn sẽ không xem như vậy. Đa số người ta thấy thẻ ở khoảng một phần ba kích thước thật, trên điện thoại, giữa lúc cuộn. Hãy thiết kế cho tình huống đó.
- Chữ to, ít từ. Một tiêu đề ngắn — năm đến tám từ — đọc rõ khi thẻ bị thu nhỏ. Nếu ở kích thước đầy đủ đã phải nheo mắt thì trong dòng tin nó không thể đọc nổi.
- Tương phản mạnh. Chữ sáng trên nền tối hoặc bão hòa, hoặc ngược lại. Chữ đặt trên một tấm ảnh rối rắm không có nền lót sẽ biến mất.
- Giữ nội dung quan trọng ở giữa. Các nền tảng khác nhau cắt viền hơi khác nhau. Giữ chữ và logo tránh xa mép ngoài để không có gì bị cắt.
- Một ý cho mỗi ảnh. Ảnh OG là cái móc câu, không phải bản tóm tắt. Tiêu đề, có thể thêm phụ đề, xong.
Nền làm chữ nổi bật
Một dải màu gradient phẳng là lựa chọn đáng tin. Nó cho chữ một chỗ sạch sẽ để đứng, trông hiện đại, và không bao giờ cạnh tranh với chữ như một tấm ảnh rối rắm. Gradient từ tối sang tối hơn một chút với chữ sáng thì gần như không thể sai.
Công cụ OG Image được xây dựng đúng quanh điều này: chọn một cỡ định sẵn (OG 1200×630, Twitter, YouTube, vuông hay story), chọn nền gradient, rồi thêm tiêu đề và phụ đề. Bạn có một thẻ chia sẻ đọc rõ ở mọi kích thước, mà không cần mở một ứng dụng thiết kế đầy đủ.
Đoạn HTML làm nó hiển thị
Tạo ảnh mới là một nửa công việc. Nền tảng phải biết tìm nó ở đâu. Thêm những thẻ này vào <head> của trang:
<meta property="og:image" content="https://yoursite.com/og.png">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">
<meta property="og:title" content="Your title">
<meta property="og:description" content="One clear sentence.">
<meta name="twitter:card" content="summary_large_image">
Dòng twitter:card đặt thành summary_large_image là thứ cho bạn thẻ lớn trên X thay vì một ảnh thu nhỏ tí hon. URL tuyệt đối (có https://) là quan trọng — đường dẫn tương đối thường không phân giải được khi một trình quét tải trang của bạn.
Sau khi triển khai, hãy kiểm thử. Dán URL của bạn vào công cụ gỡ lỗi xem trước liên kết của nền tảng (Sharing Debugger của Facebook, Post Inspector của LinkedIn) để xác nhận ảnh tải được và xóa bất kỳ phiên bản cũ nào đã bị lưu vào bộ nhớ đệm. Các nền tảng lưu đệm bản xem trước rất mạnh tay, nên nếu bạn đã cập nhật ảnh mà vẫn thấy bản cũ thì nút quét lại của công cụ gỡ lỗi là cách sửa.
Tạo nó, đừng tải lên
Toàn bộ chạy trong trình duyệt của bạn — ảnh được dựng bằng Canvas ngay tại máy và không bao giờ được tải lên máy chủ. Nó miễn phí, không cần đăng ký, không có hình mờ đóng ngang thẻ chia sẻ của bạn, và nó hoạt động ngoại tuyến sau lần truy cập đầu. Tạo ảnh 1200×630, gắn các thẻ meta, chạy qua một công cụ gỡ lỗi một lần, và các liên kết của bạn bắt đầu gánh được phần việc của chúng.