QUY CHUẨN VISUAL WEBSITE YODY 3.0
Hướng dẫn chi tiết về Font, Màu sắc và Cấu trúc Banner (Lưu hành nội bộ)
01
Nguyên Tắc Cốt Lõi
Mục tiêu tối thượng của Website 3.0 là Làm nổi bật Sản Phẩm hoặc Bộ Sưu Tập (BST). Thiết kế phải tôn vinh được tính năng và hình ảnh sản phẩm, loại bỏ mọi chi tiết trang trí thừa thãi không phục vụ mục đích bán hàng.
- Tập trung vào Hình Ảnh: Hình ảnh BST/Sản phẩm là nhân vật chính, chiếm diện tích lớn nhất.
- Hệ thống lưới 8-Point: Mọi khoảng cách (padding, margin) phải chia hết cho 8 để đảm bảo sự đồng bộ.
02
Hệ Thống Thiết Kế
A. Quy tắc Màu & Tương phản
Vàng YODY (Hành động)
#FCAF17
Bắt buộc dùng chữ màu ĐEN
Xanh Navy (Tin cậy)
#0F1E32
Bắt buộc dùng chữ màu TRẮNG
Đỏ Chức năng (Sale)
#EA3838
Dùng cho giá giảm/báo lỗi
Trắng Nền (Sạch sẽ)
#FFFFFF
Màu nền chủ đạo
B. Font Chữ (Manrope) & Nút Bấm
- Tiêu đề lớn (H1): Size 32-40px. Độ đậm: ExtraBold (800).
- Tiêu đề mục (H2): Size 24-28px. Độ đậm: Bold (700).
- Nội dung (Body): Size 16px. Độ đậm: Medium (500) hoặc Regular (400).
03
Layout Desktop (Quy Tắc 6-3-1)
Banner máy tính phải tuân thủ tỷ lệ vàng 6-3-1 để cân bằng giữa hình ảnh và thông tin.
Phương án A: Ảnh Trái (Chuẩn)
60% ẢNH
10%
Phương án B: Ảnh Phải (Biến thể)
10%
60% ẢNH
Minh họa thực tế (Full Màn Hình)
04
Layout Mobile & Vùng An Toàn
Quy tắc hiển thị dọc
Trên điện thoại, sử dụng ảnh tràn viền (Full Height) để tối ưu diện tích.
LƯU Ý QUAN TRỌNG: VÙNG AN TOÀN 10%
Phần đáy màn hình (khoảng 10%) là "Vùng Cấm".
- TUYỆT ĐỐI KHÔNG đặt nút bấm, giá tiền hay chữ quan trọng vào khu vực này.
- Lý do: Khu vực này thường bị thanh menu trình duyệt hoặc nút "Danh mục" đè lên.
VÙNG AN TOÀN 10%
(KHÔNG CHỨA NỘI DUNG)
(KHÔNG CHỨA NỘI DUNG)
×![]()
BANNER VISUAL MASTER
CHUẨN HÓA BỐ CỤC & TỶ LỆ HÌNH ẢNH
01. HERO SALES BANNER6-3-1 RULE
A. THỰC TẾ (BẤM VÀO ẢNH ĐỂ XEM)
🔍 LEFT FOCUS
🔍 LEFT FOCUS (CLEAN)
🔍 LEFT FOCUS
1. LEFT FOCUS (CƠ BẢN)
MUA
IMG 60%
2. CENTER FOCUS (CÂN BẰNG)
IMG
MUA
IMG
3. RIGHT FOCUS (ĐỐI XỨNG)
MUA
IMG 60%
GUIDELINE:Banner bán hàng ưu tiên sự rõ ràng. Sử dụng nền trắng hoặc đơn sắc cho vùng Text (40%). Ảnh sản phẩm (60%) phải tách biệt hoàn toàn để không bị rối mắt.
02. HERO PRODUCT STORY70% VISUAL
A. THỰC TẾ (BẤM VÀO ẢNH ĐỂ XEM)
🔍 CANIFA (NEW)
🔍 ROUTINE
🔍 SIXDO
2. SIDE SHADOW (TEXT LỆCH)
IMAGE 100%
GUIDELINE:Sử dụng ảnh tràn viền 100% để tạo không khí (Atmosphere). Nội dung Text được đặt trong hộp mờ (Overlay Box) lệch trái, nền tối mờ dần sang phải.
03. COLLECTION PARALLEL90% ẢNH
A. THỰC TẾ (BẤM VÀO ẢNH ĐỂ XEM)
🔍 EXAMPLE 1
🔍 EXAMPLE 2
🔍 EXAMPLE 3
XEM NGAY
IMAGE 90%
XEM NGAY
IMAGE 90%
GUIDELINE:Layout song song dùng để giới thiệu 2 BST ngang hàng. Ảnh chiếm 90% diện tích. Nút và Text nằm gọn ở 10% đáy.
04. COLLECTION ZIGZAGĐẢO CHIỀU
B. CẤU TRÚC (WIREFRAME)
SMALL ITEM
SMALL ITEM
BIG VISUAL
KHÁM PHÁ
GUIDELINE:Đây là biến thể của Parallel, dùng cho các case BST gia đình: ảnh tổng (Big Visual) kết hợp ảnh bố mẹ/bé (Small Items).
05. PRODUCT MIXHEADER 450px
A. THỰC TẾ (BẤM VÀO ẢNH ĐỂ XEM)
🔍 EXAMPLE
BANNER HEADER (450px)
DAILY OUTFIT
IMG MODEL & PRODUCT
PRODUCT GRID
LIFESTYLE IMG
(FIXED LEFT)
(FIXED LEFT)
PRODUCT
PRODUCT
PRODUCT
GUIDELINE:Banner header cao 450px với ảnh mẫu và sản phẩm. Grid sản phẩm bên dưới có ảnh lifestyle cố định bên trái.
UI/UX AUDIT: CẤU TRÚC & KÍCH THƯỚC HOMEPAGE
Phân tích kỹ thuật dựa trên dữ liệu hiển thị thực tế
Hình 1: Banner Áo Phao / Áo Gió hiện tại
Vấn đề: Kích thước quá dẹt
- Tỷ lệ khung hình (Aspect Ratio): Banner đang dùng tỷ lệ ngang hẹp (~8:1).
- Hệ quả: Chiều cao không đủ để hiển thị trọn vẹn người mẫu. Model bị crop ngang hoặc thu nhỏ, làm giảm giá trị thẩm mỹ của sản phẩm.
- Không gian: Lãng phí chiều ngang (width) nhưng thiếu chiều cao (height) cần thiết để tạo điểm nhấn thị giác.
Hình 2: Banner Đồ Bộ & Grid Sản phẩm
Ưu điểm: Cấu trúc "Banner + Listing"
- Trải nghiệm liền mạch: Hiển thị danh sách sản phẩm ngay dưới Banner Concept giúp khách hàng "Mua Ngay" mà không cần chuyển trang.
- Tăng chuyển đổi: Giữ nguyên logic này cho bản mới.
Vấn đề: Grid 5 Cột (Quá Dày)
- Hiển thị nhỏ: Chia 5 cột trên Desktop làm ảnh thumbnail bị bé.
- Khó quan sát: Khách hàng khó nhìn rõ chi tiết vải, form dáng khi lướt nhanh.
Hình 3: Banner Jeans Flex & Tin tức
Vấn đề: Layout thiếu đồng bộ
- Jeans Banner: Lặp lại lỗi chiều cao ngắn, text bị chèn ép.
- Khoảng cách (Spacing): Các khối nội dung chưa có khoảng thở (White space) thống nhất.
| Hạng Mục | Hiện Trạng (As-Is) | Đề Xuất Mới (To-Be) |
|---|---|---|
| Kích thước Banner | Dạng dải ngang (Strip). Tỷ lệ ~8:1 (Rất dẹt). |
Dạng Khối (Block/Split). Tăng chiều cao lên tỷ lệ 3:1 hoặc 4:1 để hiển thị Model đẹp hơn. |
| Product Grid | 5 Cột (Ảnh nhỏ). | 4 Cột (Ảnh to hơn 20%). Tăng diện tích hiển thị sản phẩm. |
| Cấu trúc Section | Banner riêng lẻ. | Layout 6-3-1 tích hợp. Kết hợp Banner + Grid sản phẩm thành một khối thống nhất. |
CATEGORY AUDIT: TRANG DANH MỤC SẢN PHẨM
So sánh hiện trạng YODY với Best Practices
YODY Current
Vấn đề chính
1. Banner lạc đề
Khách vào mục "Áo Polo" nhưng lại thấy Banner "Sale Tết 60%" màu đỏ chói. Không có hình ảnh mẫu mặc Polo, không khơi gợi được nhu cầu mua sắm sản phẩm.
2. Danh sách nhàm chán
Chỉ là một lưới sản phẩm xếp hàng ngang. Thiếu các khối nội dung điều hướng hoặc giải thích công nghệ.
3. Bộ lọc kém hấp dẫn
Các nút lọc toàn chữ, khách hàng không hình dung được "Mắt chim" hay "Pique" trông như thế nào.
UNIQLO
Uniqlo: Giáo dục người dùng
- Emotional Header: Ảnh Hero Banner rất lớn, mẫu tây, tạo cảm giác sang trọng. Không để giá tiền hay sale lên banner.
- Chia tầng công nghệ: Họ không list tất cả sản phẩm ngay. Họ chia thành từng khối: "AIRism Cotton", "Dry Pique", "Dry-EX".
- Section Break: Mỗi nhóm sản phẩm có một banner lifestyle riêng để minh họa tính năng.
Bài học cho YODY:
Cần chia nhỏ danh mục Polo thành các nhóm: Polo Cafe, Polo Mắt Chim, Polo Airycool và có banner giải thích tính năng cho từng nhóm ngay trên trang danh mục.
Coolmate: Định hướng nhu cầu
- Occasion Navigation: Ngay dưới tiêu đề, Coolmate có 4 ô ảnh lớn gợi ý nhu cầu: "Mặc hàng ngày", "Đi tiệc", "Công sở", "Thể thao".
- UX cực tốt: Giúp khách hàng nam giới định vị ngay được mình cần mua áo để làm gì, thay vì bắt họ đọc tên vải.
- Banner tối giản: Tập trung vào sản phẩm, nền trắng sạch sẽ.
Bài học cho YODY:
Bổ sung khối "Gợi ý mua sắm" bằng hình ảnh thay vì chỉ dùng bộ lọc Text nhàm chán.
COOLMATE
Bước 1: Clean UI
Loại bỏ Banner Sale đỏ chói. Thay bằng Banner Lifestyle thể hiện tinh thần của dòng sản phẩm.
Bước 2: Visual Filter
Thêm hàng Quick Nav bằng hình ảnh tròn hoặc vuông: "Polo đi làm", "Polo đi chơi", "Polo thể thao".
Bước 3: Story Listing
Cứ mỗi 8-12 sản phẩm, chèn 1 Banner dải ngang giới thiệu USP của dòng sản phẩm đó.
Audit Trang Chi Tiết Sản Phẩm (PDP)
Phân tích trải nghiệm người dùng & Đề xuất cải tiến
1. Trực quan hóa thông tin chất liệu
- Mô hình: Sử dụng Icon đồ họa và hình ảnh cắt lớp để giải thích công nghệ vải (Thoáng khí, Nhanh khô).
- Giá trị khách hàng: Giúp người dùng "quét" nhanh ưu điểm sản phẩm mà không cần đọc văn bản dài dòng.
2. Gợi ý phối đồ (Mix & Match)
- Mô hình: Uniqlo tích hợp "StyleHint" - ảnh thực tế từ cộng đồng người dùng ngay dưới sản phẩm.
- Giá trị khách hàng: Giải quyết câu hỏi "Mặc áo này với quần gì?". Tăng khả năng bán chéo (Cross-sell) tự nhiên.
3. Bằng chứng xã hội (Social Proof)
- Mô hình Coolmate: Hệ thống đánh giá chi tiết hiển thị thông số cơ thể người review (Chiều cao, Cân nặng, Size đã mua).
- Giá trị khách hàng: "Killer Feature" giúp khách hàng mới tự tin chọn size online. Giảm tỷ lệ đổi trả.
4. Kế hoạch hành động cho YODY
| Điểm yếu hiện tại | Giải pháp đề xuất |
|---|---|
| Mô tả vải toàn chữ | Thiết kế bộ Icon USP (Chống nhăn, Co giãn) đặt ngay dưới nút Mua hàng. |
| Thiếu gợi ý phối đồ | Bổ sung khối "Gợi ý mặc đẹp" hiển thị set đồ hoàn chỉnh (Áo + Quần YODY). |
| Review thiếu thông số | Bổ sung trường thông tin "Chiều cao/Cân nặng" vào form đánh giá. |
YODY HOMEPAGE GUIDELINE
FULL ANALYSIS | 7 BLOCKS FIXED
REF: RALPH LAUREN
PHÂN TÍCH (RATIONALE)
• Cảm xúc: Video/Ảnh Full-width tạo ấn tượng thị giác mạnh ngay lập tức.
• Mobile: Tỷ lệ 3:4 giúp chiếm trọn màn hình điện thoại, khách hàng không bị xao nhãng bởi nội dung khác.
01. HERO SECTION
MOBILE (3:4)
▶
DESKTOP (FULL)
VIDEO AUTOPLAY
| Desktop High-Res | 2880 x 1275 px (Ratio 21:9) |
| Mobile High-Res | 1125 x 1500 px (Ratio 3:4) |
REF: TOKYOLIFE
PHÂN TÍCH (RATIONALE)
• Tiện lợi: Khách hàng thường muốn tìm ngay danh mục "Sale" hoặc "Áo khoác" mà không muốn mở Menu hamburger.
• Thói quen: Mô phỏng giao diện Shopee/Tiktok Shop, rất quen thuộc với người dùng Việt Nam.
02. QUICK NAVIGATION
MOBILE
DESKTOP
| Icon Spec | 120 x 120 px (Circle) |
| Display Size | 60px (Mobile) - 80px (Desktop) |
REF: PARALLEL LAYOUT
PHÂN TÍCH (RATIONALE)
• Cân bằng: Layout 2 ảnh lớn song song dùng để giới thiệu 2 BST quan trọng ngang hàng nhau (VD: Nam & Nữ).
• Tác động: Ảnh lớn giúp nhìn rõ chi tiết vải và mood của BST.
03. COLLECTION 1 (PARALLEL)
MOBILE (STACK)
IMG A
IMG B
DESKTOP (50/50)
IMG A
IMG B
| Desktop Spec | 1440 x 1200 px (Mỗi ảnh) |
| Mobile Spec | 1125 x 1500 px (Mỗi ảnh) |
REF: ZIGZAG LAYOUT
PHÂN TÍCH (RATIONALE)
• Nhịp điệu: Đảo chiều ảnh lớn sang phải giúp mắt người dùng không bị mỏi.
• Gợi ý: Kết hợp ảnh Mood lớn với các Items nhỏ để gợi ý mua sắm cụ thể hơn.
04. COLLECTION 2 (ZIGZAG)
DESKTOP (RIGHT BIG)
BIG VISUAL RIGHT
| Big Visual | 1650 x 1200 px |
| Small Visual | 600 x 600 px |
REF: COOLMATE (MIX)
PHÂN TÍCH (RATIONALE)
• Mix & Match: Ảnh Lifestyle đầu tiên đóng vai trò "mồi", cho khách thấy sản phẩm mặc lên người đẹp thế nào.
• Tỷ lệ 3:4: Tối ưu hiển thị form dáng người mẫu (dọc) trên cả điện thoại và máy tính.
05. PRODUCT MIX (BANNER + GRID)
MOBILE (LIFE FIRST)
BANNER TALL
LIFE
STYLE
STYLE
DESKTOP (LIFE LEFT)
BANNER HEADER (450px)
‹
›
LIFESTYLE
(FIXED LEFT)
(FIXED LEFT)
| Header Banner | 2880 x 450 px (Desktop) |
| All Cards Ratio | 3:4 (Portrait Standard) |
REF: FLASH SALE
PHÂN TÍCH (RATIONALE)
• Urgency: Màu đỏ + Đếm ngược + Thanh tồn kho (Stock bar) kích thích tâm lý FOMO.
• Banner: Tăng chiều cao banner để thông điệp khuyến mãi không bị chèn ép.
06. FLASH SALE (URGENCY)
DESKTOP VIEW
BIG BANNER (300px)
02:15:30
| Banner Height | Desktop: 300px | Mobile: 180px |
| Elements | Timer + Stock Bar (Red) |
REF: TOKYOLIFE BLOG
PHÂN TÍCH (RATIONALE)
• 16:9 Ratio: Chuẩn hình ảnh video/thumbnail phổ biến nhất, dễ tái sử dụng từ YouTube/Facebook.
• Magazine: Giao diện sạch sẽ, tập trung vào hình ảnh để tăng thời gian on-site.
07. BLOG (MAGAZINE 16:9)
DESKTOP
| Thumb Ratio | 16:9 (Landscape Standard) |
| Image Spec | 800 x 450 px (High Res) |
REF: RALPH LAUREN INTERACTION
HOVER ME
PHÂN TÍCH (RATIONALE)
• Flow: Từ "Toàn thân" (Lookbook) ➔ "Cận cảnh/Chất liệu" (Detail) ngay khi lướt chuột.
• Lợi ích: Giúp khách hàng vừa thấy phom dáng, vừa check được độ tinh xảo của sản phẩm mà không cần click vào trang chi tiết.
• Tỷ lệ 4:5: Tỷ lệ chuẩn quốc tế cho thời trang cao cấp (hiển thị tốt hơn 3:4 trên Desktop).
08. INTERACTIVE PRODUCT CARD (HOVER)
RÊ CHUỘT VÀO ẢNH ĐỂ TRẢI NGHIỆM (DESKTOP ONLY)
👆 Hover me
POLO NAVY
POLO STRIPE
POLO PINK
| Image Ratio | 4:5 (Vertical High-End) |
| Interaction | Mouse Hover (Fade Transition) |
| Asset Req | 1. Model Full Body 2. Zoom Fabric / Lifestyle |
HOMEPAGE SS26 (FINAL V7)
Updated: Added "YODY & FRIENDS" (KOLs) + Blog Section
DESKTOP (1440px)
▶ VIDEO SS26
KHÁM PHÁ NGAY
ĐẬP BĂNG POLO COOL
Giải nhiệt mùa hè - Mua 2 tặng 1
BST NỔI BẬT
THE NEW T-MATE
YÊN YÊU
DREAMTEAM SUMMER
POLO ALL IN 1
NAM
NỮ
KIDS
HÀNG MỚI VỀ
YODY & FRIENDS
Xem các KOLs nói gì về sản phẩm YODY
YODY MAGAZINE
5 Cách phối đồ với Polo Mắt Chim cho chàng công sở
Công nghệ Cafe: Bước tiến xanh của thời trang Việt
Màu xanh Navy: Sắc màu thống trị mùa hè 2026
FOOTER AREA
MOBILE (375px)
=
YODY
🛒
VIDEO (3:4)
ĐẬP BĂNG
POLO COOL
POLO COOL
BST MỚI
THE NEW T-MATE
YÊN YÊU
DREAMTEAM
NAM
NỮ
KIDS
HÀNG MỚI VỀ
ÁO THUN
YODY & FRIENDS
TIN TỨC
5 Cách phối đồ với Polo...
Công nghệ Cafe là gì?
🏠
🔎
❤️
👤
HOMEPAGE FULL LAYOUT (SS26)
70% SALES / PERFORMANCE
30% BRANDING / STORY
DESKTOP INTERFACE
1 CAMPAIGN
VIDEO SS26 (21:9)
KHÁM PHÁ NGAY
CHIẾN DỊCH HOT
BST NỔI BẬT
HERO COLLECTION
THE NEW T-MATE
SUB
YÊN YÊUSUB
DREAMTEAMVIDEO STORY
POLO ALL IN 1 (VIDEO BANNER)
THỜI TRANG NAM
THỜI TRANG NỮ
TRẺ EM (KIDS)
HÀNG MỚI VỀ
1 LOOKBOOK
★
LOOKBOOK
SS26
LOOKBOOK
SS26
XEM FULL SET
2 PRODUCT
IMG
Polo Mắt Chim
299k
3 PRODUCT
IMG
...
4 PRODUCT
IMG
...
5 PRODUCT
IMG
...
CATEGORY FOCUS
ÁO THUN (BANNER 21:9)
YODY & FRIENDS
REVIEW
▶▶
▶
▶
TIN TỨC
5 Cách phối đồ...
Công nghệ Cafe...
Xu hướng màu...
FOOTER
MOBILE INTERFACE
POS 1: SALE
VIDEO (4:5)
MUA NGAY
CHIẾN DỊCH HOT
BST MỚI
HERO
THE NEW T-MATE
YÊN YÊU
DREAM
VIDEO
POLO ALL IN 1
NAM
NỮ
KIDS
HÀNG MỚI VỀ
POS 1
LOOKBOOK
POS 2
PROD
POS 3
PROD
BANNER
ÁO THUN
YODY & FRIENDS
POS 1
▶POS 2
▶POS 3
▶TIN TỨC
5 Cách phối đồ...
Công nghệ Cafe...
MENU BAR
☰
YODY
🛒
▶
HOT
ĐẬP BĂNG
POLO COOL
POLO COOL
Mua 2 giảm 10% - Freeship
CÔNG NGHỆ
CAFE
CAFE
BST NỔI BẬT
THE NEW T-MATE
YÊN YÊU
DREAMTEAM
HÀNG MỚI VỀ
NEW
Áo Polo Mắt Chim Basic
299.000đ
NEW
Quần Jean Slimfit
450.000đ
Áo Thun Cool
199.000đ
Áo Thun In Hình
229.000đ
Áo Thun Trơn
159.000đ
Polo Thể Thao
299.000đ
YODY & FRIENDS
▶
@hieuthuhai
▶
@quanglinh
TIN TỨC
5 Cách phối đồ với Polo Mắt Chim cực chất
22/01/2026
Công nghệ Cafe: Xu hướng thời trang xanh bền vững
20/01/2026
HOMEPAGE GUIDELINE
HERO VIDEO
1
NHIỆM VỤ
Giữ chân khách hàng ngay lập tức (Retention) trong 3s đầu tiên.
THIẾT KẾ
Video dọc 4:5. Autoplay (Mute). Overlay text tương phản cao.
CONTENT
Slogan ngắn gọn. Nút CTA "Xem Ngay".
BANNER CAROUSEL
2
NHIỆM VỤ
Điều hướng vào chương trình khuyến mãi/chiến dịch.
THIẾT KẾ
Dạng Peeking Card (Lộ 15% slide sau) kích thích vuốt ngang.
CONTENT
Tên CTKM + Lợi ích (Giảm giá, Quà tặng).
CATEGORY BLOCK
6
NHIỆM VỤ
Showcase sản phẩm chủ lực theo từng danh mục (Áo thun, Polo, Quần).
THIẾT KẾ
Cấu trúc: Banner ngang (2:1) + List sản phẩm trượt ngang bên dưới.
CONTENT
Banner phải thể hiện Mood của danh mục đó (Năng động, Công sở...).
BLOG / NEWS
8
NHIỆM VỤ
Tăng SEO và Educate khách hàng về cách phối đồ/chất liệu.
THIẾT KẾ
List view dọc. Ảnh thumbnail bên trái (3:2), Text bên phải.
CONTENT
Tiêu đề dạng "Tips", "Hướng dẫn", "Xu hướng".
Trang chủ / Nam / Áo Polo
Áo Polo Cooltouch Basic Co Giãn Thoáng Khí
PMM6023 [COPY]
299.000đ
399.000đ
-25%
MÀU SẮC: Xanh Navy
KÍCH CỠ 📏 Hướng dẫn chọn size
S
M
L
XL
📐 HỖ TRỢ CHỌN SIZE AI
›
THÊM VÀO GIỎ
MUA NGAY
ĐẶC ĐIỂM NỔI BẬT
Công nghệ Cooltouch
Sợi vải cải tiến giúp bề mặt mát lạnh ngay khi chạm. Giảm 3 độ C nhiệt độ cơ thể.
Vải mắt chim thoáng khí
Kết cấu hàng ngàn lỗ thông hơi li ti giúp thoát nhiệt nhanh chóng.
XEM CHI TIẾT SẢN PHẨM ▾
GỢI Ý PHỐI ĐỒ
SET NĂNG ĐỘNG ĐI LÀM
Tiết kiệm 50.000đ
Áo Polo Cool (299.000đ)
Quần Jean Slimfit (450.000đ)
THÊM CẢ SET VÀO GIỎ
ĐÁNH GIÁ (4.9/5)
Minh Tuấn★★★★★
"Áo mặc rất mát, form đẹp y hình."
Hoàng Nam★★★★★
"Giao hàng nhanh, đóng gói cẩn thận."
CÂU HỎI THƯỜNG GẶP
Áo có bị phai màu khi giặt máy không?+
Chính sách đổi trả size như thế nào?+
GỢI Ý TỪ AI
Polo Pique
249.000đ
Áo Thun
199.000đ
Quần Short
320.000đ
Sơ mi Cafe
350.000đ
Quần Jean
450.000đ
CONTENT & SEO GUIDELINE
SEO / AIO
1. TỐI ƯU TITLE & HEADING
- Tên sản phẩm (H1): Phải chứa "Công nghệ Cooltouch" + "Co giãn" + "Thoáng khí". Đây là các từ khóa User Intent cao.
- Heading (H2): Sử dụng các cụm từ "Đặc điểm nổi bật", "Câu hỏi thường gặp" để Google hiểu cấu trúc trang.
- Heading (H2): Sử dụng các cụm từ "Đặc điểm nổi bật", "Câu hỏi thường gặp" để Google hiểu cấu trúc trang.
CONTENT WRITING
2. VIẾT MÔ TẢ "CHẠM" NỖI ĐAU
- Thay vì liệt kê thông số khô khan, hãy viết về LỢI ÍCH THỰC TẾ.
- Ví dụ: Đừng chỉ nói "Vải Polo Cool". Hãy nói "Công nghệ Cooltouch với hàng ngàn lỗ thở giúp thoát mồ hôi ngay lập tức".
- Dùng động từ mạnh: "Chạm mát tức thì", "Chống tia UV", "Không bai dão".
- Ví dụ: Đừng chỉ nói "Vải Polo Cool". Hãy nói "Công nghệ Cooltouch với hàng ngàn lỗ thở giúp thoát mồ hôi ngay lập tức".
- Dùng động từ mạnh: "Chạm mát tức thì", "Chống tia UV", "Không bai dão".
AIO (AI OVERVIEW)
3. SỬ DỤNG KHỐI FAQ
- Phần Câu hỏi thường gặp ở cuối trang là DỮ LIỆU phục vụ lên Top AIO.
- Hãy trả lời trực tiếp các câu hỏi khó: "Giặt máy có phai không?", "Đổi trả thế nào?".
- Câu trả lời phải ngắn gọn (dưới 50 từ) để AI dễ trích dẫn.
- Hãy trả lời trực tiếp các câu hỏi khó: "Giặt máy có phai không?", "Đổi trả thế nào?".
- Câu trả lời phải ngắn gọn (dưới 50 từ) để AI dễ trích dẫn.
VISUAL
4. HÌNH ẢNH USP
- Ảnh trong phần chi tiết (ZigZag) phải là ảnh CẬN CẢNH (Close-up) chất liệu vải hoặc đường may cổ áo.
- Khách hàng không thể sờ, hãy để họ "cảm nhận" qua ảnh nét cao.
- Khách hàng không thể sờ, hãy để họ "cảm nhận" qua ảnh nét cao.
Áo Polo Cool Basic Co Giãn Thoáng Khí
299.000đ
399.000đ
-25%
📐 HỖ TRỢ CHỌN SIZE AI
›
MÀU SẮC: Xanh Navy
KÍCH CỠ
S
M
L
XL
ĐẶC ĐIỂM NỔI BẬT
Công nghệ CoolTouch
Mát lạnh ngay khi chạm, giảm 3°C nhiệt độ.
Co giãn đa chiều
Spandex cao cấp, thoải mái vận động.
Xem chi tiết sản phẩm ▾
GỢI Ý PHỐI ĐỒ
Set Năng Động (Polo + Jean)
749.000đ
THÊM CẢ SET VÀO GIỎ
ĐÁNH GIÁ (4.9)
4.9/5
Xem tất cả >
Minh Tuấn
★★★★★
"Áo mặc rất mát, đúng như quảng cáo. Form lên đẹp."
Hoàng Nam
★★★★★
"Chất vải sờ sướng tay, giao hàng nhanh."
GỢI Ý TỪ AI
Polo Pique
249.000đ
Quần Short
320.000đ
CÂU HỎI THƯỜNG GẶP
Áo có bị phai màu không? +
Chính sách đổi trả thế nào? +
Phí vận chuyển ra sao? +
Tổng thanh toán:
299.000đ
MUA NGAY
VISUAL MERCHANDISING GUIDELINE
1. OPS & SALES CÔNG CỤ
- Copy SKU: Nút copy mã nhanh để nhân viên check tồn kho.
- Share: Nút chia sẻ style Uniqlo để tăng Social Signal.
- AI Size: Thay thế bảng size tĩnh bằng công cụ gợi ý thông minh.
- Share: Nút chia sẻ style Uniqlo để tăng Social Signal.
- AI Size: Thay thế bảng size tĩnh bằng công cụ gợi ý thông minh.
2. CONTENT OPTIMIZATION NỘI DUNG
- Tên sản phẩm: Phải chứa lợi ích ("Cool", "Co giãn").
- Đặc điểm nổi bật: Dùng 2 ảnh trực quan (Visual) thay vì text. Có nút "Xem thêm" để ẩn nội dung dài.
- Đặc điểm nổi bật: Dùng 2 ảnh trực quan (Visual) thay vì text. Có nút "Xem thêm" để ẩn nội dung dài.
3. UPSELL FLOW DOANH SỐ
- Mix & Match: Ảnh Lookbook 3:4 Full body. Nút "Mua cả set" để tăng AOV.
- Gợi ý từ AI: Đặt cuối trang để giữ chân khách hàng.
- Gợi ý từ AI: Đặt cuối trang để giữ chân khách hàng.
4. SEO & TRUST TÌM KIẾM
- FAQ: Bộ câu hỏi thường gặp dạng Accordion (đóng mở) để tối ưu AIO (AI Overview).
- Review: Giữ giao diện sạch, chỉ hiển thị Sao và Text. Review rất quan trọng để tối ưu AIO nếu không có dữ liệu thì cần setup được thủ công
- Review: Giữ giao diện sạch, chỉ hiển thị Sao và Text. Review rất quan trọng để tối ưu AIO nếu không có dữ liệu thì cần setup được thủ công