| STT | Thành phần tối ưu | Nội dung tối ưu UX | Nội dung tối ưu UI | Công cụ sử dụng | Hình ảnh triển khai | Tình trạng |
| A. Các tiêu chuẩn chung | ||||||
| 1 | Đảm bảo nhận diện thương hiệu | Có sự liên tưởng dễ dàng với thương hiệu | Đồng bộ giao diện của website hoặc sàn với các yếu tố nhận diện thương hiê gồm màu sắc, logo, phông chữ, cách trình bày theo bộ quy chuẩn thương hiệu | Canva |  |
Đạt |
| 2 | Tốc độ tải trang | Trải nghiệm không lag, chuyển trang nhanh | Tối ưu ảnh (nên <200 Kb), tránh animation dư thừa Dưới 3 giây cho 3G/4G; giảm dùng animation |
Plugin: LiteSpeed Cache |  |
Cần cải thiện |
| 3 | Responsive (tương thích thiết bị) | Không lỗi hiển thị, chức năng vẫn đầy đủ | Thiết kế mobile-first hoặc điều chỉnh theo từng thiết bị | Plugin: Responsive Menu, CSS Media Queries, Elementor |  |
Đạt |
| 4 | Hiển thị nội dung trang | Đảm bảo tính toàn vẹn của nội dung cho người dùng | Dùng margin/padding tối thiểu 16px để tránh sát lề | Plugin: UX Builder, Classic Editor |
 |
Đạt |
| 5 | Khả năng đọc của người dùng | Đảm bảo khả năng đọc của người dùng | WCAG khuyến nghị tối thiểu 16px (≈12pt) cho nội dung thân bài. Tránh dùng chữ nhỏ hơn 14px trên mobile. | Plugin: UX Builder, Classic Editor | Đạt | |
| 6 | Tối ưu di động (Mobile Friendly) | Trải nghiệm tốt trên thiết bị di động | Sử dụng theme có responsive (tối ưu) như flatsome để thiết kế Tự động co giãn (sử dụng max-width: 100%) |
Tối ưu di động: AMP, Co giãn hình ảnh: ShortPixel, Smus |
Đạt | |
| B. Các tiêu chuẩn thành phần | ||||||
| 7 | Header (đầu trang) | Thanh menu cố định, dễ truy cập, hiển thị tốt trên mobile | Logo rõ nét, điều hướng ngang, nút CTA dễ thấy | Plugin: UX Builder |  |
Đạt |
| 8 | Menu điều hướng (Navigations) | Trải nghiệm mượt mà, hiển thị mobile-friendly, breadcrumbs hỗ trợ định vị | Logo có liên kết về trang chủ Các liên kết chính (trang chính) hiển thị trên menu hiển thị của website Dễ dàng tìm kiếm các mục con Các nút biểu tượng liên kết về các trang hoặc nội dung tương ứng như giỏ hàng, thanh tìm kiếm, biểu tưởng tài khoản,.. |
Plugin: WP Mega Menu |  |
Đạt |
| 9 | Trang chủ | Giao diện gọn, cung cấp giá trị ngay từ đầu, điều hướng dễ dàng | Hình ảnh banner Hero bắt mắt, nút CTA rõ ràng, phân vùng nội dung | Plugin: UX Builder/ Slider Revolution | Đạt | |
| 10 | Trang giới thiệu | Kể chuyện thương hiệu, thể hiện sự tin cậy và mục tiêu | Thiết kế nhất quán, hình ảnh thật / biểu tượng thân thiện | Plugin: Elementor / UX Builder | Đạt | |
| 11 | Trang dịch vụ / sản phẩm | Tính năng lọc, so sánh, mô tả chi tiết, đánh giá khách hàng | Thẻ sản phẩm đẹp, icon phù hợp, bố cục lưới | Plugin: WooCommerce, YITH WooCommerce Compare, Filter Everything | Đạt | |
| 12 | Trang liên hệ | Dễ liên lạc, cung cấp nhiều hình thức liên hệ (form, Zalo, Facebook) | Biểu mẫu gọn, bao gồm các thông tin cơ bản như họ tên, email, ghi chú Bản đồ trực quan: Dùng Google Maps có đánh dấu vị trí cụ thể. Nên chèn dạng iframe, kích thước tối thiểu 600x400px. |
Plugin: Contact Form 7 | Đạt | |
| 13 | Trang blog / bài viết | Dễ đọc, điều hướng bài viết liên quan, bình luận mượt | Hình ảnh sắc nét, hiển thị đủ nội dung Nội dung không tràn hoặc sát viền/lề thiết bị sử dụng (máy tính và di động) Đảm bảo kích thước các nội dung cơ bản > 12 pt) Thiết lập thẻ title tag ≤ 60 ký tự, meta description ≤ 155 ký tự. |
Plugin: Rank Math SEO, Jetpack, Related Posts for WP | Đạt | |
| 14 | Footer (chân trang) | Dễ truy cập thông tin cần thiết cuối trang | Phân vùng rõ: liên hệ, social, bản quyền | Plugin: UX Builder, Classic Editor |  |
Đạt |
| 15 | Thanh tìm kiếm | Kết quả tìm kiếm có highlight từ khóa, chính xác | Giao diện đơn giản, biểu tượng kính lúp dễ thấy Gợi ý từ khóa trong khi gõ Thanh tìm kiếm nên có độ dài >= 200px |
Plugin: Ajax Search Lite, Relevanssi |  |
Đạt |
| 16 | Popup / CTA / Thông báo | Gợi ý phù hợp ngữ cảnh, không gây khó chịu | Không che toàn bộ trang, có nút tắt dễ thấy CTA nên dùng màu nổi, kèm động từ mạnh (ví dụ: “Đăng ký ngay”) Popup không che toàn bộ, có nút tắt, dùng tối đa 70% màn hình, luôn có nút “×” ở góc trên phải, không bật popup ngay lập tức – đợi sau 5–10s hoặc cuộn 50%. Nút đủ lớn: ít nhất 48×48 px (chuẩn từ Google) |
Plugin: Popup Maker |  |
Đạt |
| 17 | Tích hợp mạng xã hội & Chat | Dễ chia sẻ, theo dõi mạng xã hội, dễ giao tiếp | Icon đúng thương hiệu, bố trí dễ thấy | Plugin: Sassy Social Share, Smash Balloon Chatway |
Đạt | |
| 18 | SEO và phân tích | Hiển thị thân thiện với Google, UX giúp giảm bounce rate | Metadata chuẩn, bố cục rõ ràng | Plugin: Rank Math SEO, Google Site Kit | Đạt | |
| 19 | Bảo mật | Tránh gây lo lắng người dùng, xác thực form | Không lộ lỗi kỹ thuật, giao diện lỗi thân thiện Tích hợp SSL để tránh cảnh báo rủi ro bảo mật website ở phía người dùng |
Plugin: Wordfence Security, reCAPTCHA by Google, Really Simple Security |  |
Đạt |
| 20 | Chức Năng Chia Sẻ | Biểu tượng chia sẻ xã hội rõ ràng | Dễ dàng chia sẻ nội dung | Plugin: AddToAny Share Buttons |  |
Đạt |
| 21 | Chức Năng Thông Báo | Thông báo rõ ràng | Giao tiếp tức thì với người dùng | Plugin: OneSignal (thông báo đẩy) | Đạt | |
| Nguồn tham khảo: Google Material Design, Apple HIG, WCAG | ||||||
