Dự án website CES Media là website WordPress do Thiết Kế Web DC thiết kế cho công ty quảng cáo, truyền thông và tổ chức sự kiện tại Hà Nội, giới thiệu dịch vụ, các sự kiện đã thực hiện và nhận thông tin sự kiện từ khách.
Thông tin dự án
C.E.S Media Việt Nam là công ty cổ phần quảng cáo, truyền thông, theo website khách ra đời từ tháng 8 năm 2015 và làm sự kiện trong và ngoài khu vực. Dự án website CES Media thuộc nhóm thiết kế web sự kiện, nơi website phải thay một buổi gặp mặt. Bảng dưới tổng hợp thông tin chính.
| Hạng mục | Nội dung |
| Khách hàng | Công ty Cổ phần Quảng cáo và Truyền thông C.E.S Media Việt Nam |
| Ngành | Tổ chức sự kiện doanh nghiệp, âm nhạc, thể thao, hội nghị hội thảo và triển lãm |
| Website | cesmediavn.com |
| Nền tảng | WordPress, theme Flatsome kèm child theme, Contact Form 7 |
| Số loại dịch vụ | Năm loại sự kiện, mỗi loại một trang |
| Đơn vị thực hiện | Thiết Kế Web DC |
| Thời gian thực hiện | 2015 |
Bối cảnh của dự án
Người thuê một đơn vị sự kiện không mua một món hàng mà mua một ngày quan trọng của mình. Họ muốn xem công ty đã làm sự kiện nào, ở đâu, quy mô ra sao rồi mới nói yêu cầu. Vì thế website CES để sự kiện đã làm lên trước lời giới thiệu.
Người cần tổ chức sự kiện tìm gì trên website
Trước khi vẽ giao diện, DC liệt kê những người sẽ mở website này, vì bộ phận hành chính của một ngân hàng và ban tổ chức một giải thể thao hỏi hai câu rất khác nhau. Mỗi dòng của bảng dưới là một nhu cầu và nơi website đáp lại nó.
| Nhu cầu của người thuê | Họ tìm thấy ở đâu |
| Cần làm tiệc cuối năm, lễ khai trương hay ra mắt sản phẩm | Thẻ "Sự kiện doanh nghiệp" |
| Cần tổ chức hội nghị hoặc hội thảo khách hàng | Thẻ "Hội nghị, Hội thảo" |
| Cần chương trình ca nhạc, lễ hội | Thẻ "Sự kiện âm nhạc" |
| Cần giải đấu hoặc hội thao cho cơ quan | Thẻ "Sự kiện thể thao" |
| Cần gian hàng hoặc không gian triển lãm | Thẻ "Triển lãm" |
| Muốn biết công ty đã làm sự kiện cỡ nào | Khối "Sự kiện nổi bật" với tên, địa điểm và ngày |
| Muốn tìm hiểu cách chọn đơn vị làm sự kiện | Mục "Cẩm nang sự kiện" trong blog |
| Muốn báo yêu cầu cụ thể | Form liên hệ có phần thông tin sự kiện |
Năm loại sự kiện, mười hai sự kiện nổi bật và cẩm nang
Nội dung của CES gồm các loại dịch vụ, các sự kiện đã làm và bài hướng dẫn. DC phải xếp chúng thành ba lớp để người xem đang vội và người xem đang tìm hiểu không giẫm lên nhau.
- Năm loại dịch vụ: sự kiện doanh nghiệp, sự kiện âm nhạc, sự kiện thể thao, hội nghị hội thảo và triển lãm.
- Mười hai sự kiện nổi bật ở trang chủ: như lễ ra mắt sản phẩm của một thương hiệu, khai trương gian hàng trên Shopee, kỷ niệm 60 năm thành lập một trường THCS, lễ chào mừng 1,5 triệu TEU của cảng container, triển lãm quốc phòng quốc tế, year end party của một ngân hàng và hội thảo kỹ thuật xe máy.
- Trang Dịch vụ dạng danh sách sự kiện: mỗi sự kiện ghi tên, địa điểm và ngày, như trung tâm hội nghị quốc tế, khách sạn ở Thái Nguyên hay trường học ở Hà Nội.
- Cẩm nang sự kiện: các bài năm 2024 về quy trình tổ chức hội thảo, cách chọn đơn vị làm sự kiện, kịch bản hội thao và lưu ý khi tổ chức sự kiện âm nhạc.
- Trang Giới thiệu: tầm nhìn, sứ mệnh, giá trị cốt lõi, đội ngũ CES Team, câu chuyện doanh nghiệp và đối tác.
Bài toán của đơn vị bán những ngày chỉ diễn ra một lần
Thiết Kế Web DC xác định bài toán là cho khách thấy thứ họ không thể sờ vào: chất lượng của một sự kiện đã khép lại. Ảnh và danh sách sự kiện phải làm thay phần "xem hàng" mà các ngành khác có sẵn.
- Sự kiện đã làm là bằng chứng chính: mỗi dòng có tên khách, loại sự kiện, nơi tổ chức và ngày, để người xem tự đối chiếu với nhu cầu của mình.
- Mỗi loại sự kiện có cách tìm riêng: người cần hội thảo không muốn lọc qua tiệc âm nhạc, nên DC tách theo năm loại ngay từ menu.
- Yêu cầu của khách phải thu thập ngay từ đầu: sự kiện nào cũng cần loại hình, thời gian, địa điểm, quy mô, nên form liên hệ gom đủ các thông tin này để công ty gọi lại đúng việc.
Bốn mục tiêu: chọn loại sự kiện, xem sự kiện đã làm, tin kinh nghiệm và báo yêu cầu
Bốn mục tiêu này được DC dán lên đầu bản thiết kế, và mọi lần cân nhắc màu, chữ hay thứ tự khối đều phải trả lời được "có phục vụ mục tiêu nào không".
1. Người thuê hiểu công ty làm được những loại sự kiện nào: năm thẻ dịch vụ ngay phần đầu trang chủ.
2. Người thuê xem được sự kiện giống nhu cầu của mình: khối sự kiện nổi bật và trang Dịch vụ có tên, địa điểm, ngày.
3. Người thuê tin vào kinh nghiệm thật: năm ra đời, sự kiện của nhiều lĩnh vực và lời nhận xét của khách có tên, chức danh.
4. Người thuê báo được yêu cầu mà không phải gọi: form liên hệ có phần thông tin sự kiện.
Thiết kế giao diện
Giao diện do Thiết Kế Web DC thiết kế theo hướng hiện đại và gọn: nền sáng, màu xanh navy làm chữ tiêu đề, ảnh sự kiện lớn làm chủ đạo, một phông chữ cho toàn trang. Mục này đi qua màu, phông chữ, bố cục trang chủ và menu của CES.
Xanh navy và nền sáng để ảnh sự kiện nổi lên
Sự kiện là ngành sống bằng hình ảnh nhiều màu, nên DC chọn bảng màu rất kiệm: xanh navy cho chữ, xám nhạt và xanh đậm cho nền. Nhờ vậy ảnh sân khấu, đèn, đám đông mới là thứ nổi bật.
| Màu | Mã | Dùng cho |
| Xanh navy | `#001249` | Tiêu đề khối và tiêu đề loại dịch vụ |
| Xanh đen | `#122438` | Nền các khối đậm như chân trang |
| Xám nhạt | `#f1f1f1` | Nền các khối xen kẽ |
| Chữ nội dung | `#333333` | Đoạn mô tả trên nền sáng |
| Trắng | `#ffffff` | Chữ trên ảnh và nền trang |
Manrope và cỡ chữ cho tiêu đề dài của sự kiện
Website dùng một phông duy nhất là Manrope, phông không chân hiện đại, đủ rộng để tên sự kiện in hoa dài vẫn đọc rõ. DC thay đổi độ đậm để tạo thứ bậc.
- Tiêu đề khối: cỡ 22,4 px, độ đậm 800, màu xanh navy trên nền sáng và trắng trên ảnh, như "Các dịch vụ chúng tôi cung cấp".
- Tên loại dịch vụ: cỡ 19,2 px, độ đậm 700, dòng cao 30,7 px.
- Đoạn nội dung: cỡ 16 px, dòng cao 25,6 px, độ đậm 400, màu xám đậm.
- Nút "Xem thêm": chữ in hoa 12,8 px, đậm, viền bo tròn hẳn, chữ trắng đặt trên ảnh.
Bố cục trang chủ từ giới thiệu đến sự kiện nổi bật
DC xếp trang chủ theo thứ tự người thuê hay hỏi: công ty là ai, làm được loại sự kiện nào, đã làm những gì, vì sao chọn, người khác nói gì, rồi mới đến lời mời.
1. Khối "Về chúng tôi": giới thiệu công ty ra đời từ tháng 8 năm 2015, hoạt động trong truyền thông, quảng cáo và tổ chức sự kiện, kèm nút "Xem thêm".
2. Khối "Các dịch vụ chúng tôi cung cấp": năm thẻ sự kiện doanh nghiệp, âm nhạc, thể thao, hội nghị hội thảo và triển lãm.
3. Khối "Các dự án chúng tôi đã thực hiện": lưới mười hai sự kiện nổi bật, mỗi sự kiện có tên in hoa và ngày diễn ra.
4. Khối "Tại sao chọn chúng tôi": đoạn giới thiệu kinh nghiệm và phương châm sáng tạo, hiện đại, chuyên nghiệp.
5. Khối "Tin tức và sự kiện": bài mới và các bài trong mục cẩm nang sự kiện.
6. Khối "Khách hàng của chúng tôi": lời nhận xét kèm tên và chức danh của người nói.
7. Lời mời "Muốn gây ấn tượng với khách hàng của bạn": dẫn tới form liên hệ.
8. Chân trang: tên pháp nhân, địa chỉ, hotline, email, fanpage, các loại dịch vụ và ô đăng ký nhận tin.
Menu năm mục và các loại sự kiện thả xuống
DC giữ menu ngắn và để các loại sự kiện nằm trong menu Dịch vụ, vì đó là thứ người thuê tìm đầu tiên.
- Năm mục menu: Trang chủ, Giới thiệu, Dịch vụ, Blog và Liên hệ, kèm biểu tượng tìm kiếm mở khung tìm ngay trên trang.
- Menu Dịch vụ thả xuống năm loại: sự kiện doanh nghiệp, sự kiện âm nhạc, sự kiện thể thao, hội nghị hội thảo và triển lãm nghệ thuật.
- Các mục nội dung còn lại: cẩm nang sự kiện, tin sự kiện và tuyển dụng nằm trong menu để người xem tìm đúng loại bài.
- Chân trang lặp lại năm loại dịch vụ: để người đã cuộn hết trang vẫn chọn tiếp được loại sự kiện mình cần.
Trải nghiệm người dùng
Thiết Kế Web DC tổ chức nội dung theo hành trình của người thuê đơn vị sự kiện: xem loại hình, xem các sự kiện đã làm, đọc kinh nghiệm rồi báo yêu cầu. Mỗi chặng của hành trình là một trang riêng, và cuối mỗi trang đều có lối bấm sang chặng sau.
[Ảnh — ALT: Trang Dịch vụ của website CES Media: danh sách sự kiện đã tổ chức với tên sự kiện, địa điểm và ngày diễn ra]
Trang Dịch vụ như một nhật ký sự kiện
Thay vì mô tả chung chung, trang Dịch vụ liệt kê từng sự kiện đã làm, vì với đơn vị sự kiện thì mỗi sự kiện chính là một lời giới thiệu.
- Mỗi dòng đủ ba thông tin: tên sự kiện, nơi tổ chức và ngày diễn ra, kèm ảnh đại diện.
- Nhiều loại hình trong cùng danh sách: từ lễ ra mắt sản phẩm, khai trương gian hàng, lễ kỷ niệm của trường học đến sự kiện âm nhạc và hội thảo.
- Địa điểm trải nhiều nơi: Hà Nội, Thái Nguyên và các tỉnh khác, để khách thấy công ty làm được ngoài thủ đô.
Trang Giới thiệu và đội ngũ
Trang này trả lời câu hỏi "ai sẽ làm sự kiện của tôi".
- Tầm nhìn, sứ mệnh và giá trị cốt lõi: ba mục ngắn, tách riêng cho dễ đọc.
- CES Team: mục giới thiệu đội ngũ để khách thấy sự kiện do người thật làm.
- Câu chuyện doanh nghiệp và đối tác: hai mục kể về chặng đường và những đơn vị đã hợp tác.
Blog cẩm nang sự kiện
Phần blog không đăng tin nội bộ mà trả lời câu hỏi người thuê hay có trước khi quyết định.
- Bài hướng dẫn theo loại hình: như kinh nghiệm và quy trình tổ chức hội thảo, các bước tổ chức sự kiện âm nhạc, cách lên kịch bản hội thao.
- Bài về cách chọn đối tác: cách lựa chọn đơn vị tổ chức sự kiện chuyên nghiệp và đơn vị làm sự kiện thể thao uy tín.
- Bài về một sự kiện cụ thể: như hội thảo chuẩn hóa kỹ thuật của một doanh nghiệp, kể sự kiện đã được tổ chức thế nào.
Form báo yêu cầu theo loại sự kiện
Trang Liên hệ không chỉ cho tên và số điện thoại mà để khách mô tả sự kiện của mình.
- Ba nhóm thông tin: người đại diện, doanh nghiệp và sự kiện, nên công ty biết ngay ai đang hỏi và hỏi về việc gì.
- Ô loại hình sự kiện: có các lựa chọn như khai trương khánh thành, tiệc cuối năm và hội nghị khách hàng.
- Thông tin liên hệ cạnh form: địa chỉ tại Cầu Giấy, hotline, email và fanpage, để khách chọn gọi thay vì điền form.
Công nghệ và hiệu năng
Thiết Kế Web DC dựng website trên WordPress với theme Flatsome, child theme riêng và Contact Form 7. Điểm PageSpeed Insights đo ngày 08/11/2026: Accessibility đạt 95, Best Practices 96 và SEO 92 ở cả hai thiết bị, Performance đạt 92 trên desktop và 68 trên mobile, TBT gần bằng 0.
WordPress, Flatsome và các thành phần đang dùng
DC xây website trên WordPress, dùng theme Flatsome để dựng các khối ảnh lớn và lưới sự kiện, còn phần chỉnh riêng nằm trong child theme để cập nhật theme không làm mất giao diện.
- Flatsome và child theme: theme dựng nhanh khối dịch vụ, lưới sự kiện và blog, child theme giữ chỉnh sửa riêng của CES.
- Contact Form 7: form ba nhóm thông tin gửi yêu cầu của khách về email của công ty.
- Khung tìm kiếm: mở ngay trên trang khi bấm biểu tượng ở menu.
- Video giới thiệu công ty: trang chủ có một tệp video giới thiệu để người xem nhìn được chất lượng dựng của công ty.
Số đo PageSpeed của website tổ chức sự kiện
PageSpeed Insights chạy hai lượt cho trang chủ ở mỗi thiết bị ngày 08/11/2026 và trả cùng một kết quả. Bảng giữ nguyên số gốc, không làm tròn lên.
| Chỉ số | Mobile | Desktop |
| Performance | 68 | 92 |
| Accessibility | 95 | 95 |
| Best Practices | 96 | 96 |
| SEO | 92 | 92 |
| LCP | 7,7 giây | 1,4 giây |
| CLS | 0 | 0 |
| TBT | 10 ms | 0 ms |
Tên miền chưa đủ lượng truy cập để Google công bố dữ liệu CrUX, vì vậy đây là kết quả đo thử trong phòng thí nghiệm. Dung lượng tải của trang chủ khoảng 2,3 MB trên mobile và 2,7 MB trên desktop.
Đọc số đo: ảnh sân khấu nặng và video giới thiệu không tải được
Bảng cho thấy website ổn định tuyệt đối và nhanh trên desktop, còn LCP trên mobile cao chủ yếu vì ảnh. Việc còn lại tập trung ở vài ảnh lớn và một tệp video.
- Điểm mạnh: CLS bằng 0 ở cả hai thiết bị, TBT 10 ms và 0 ms nên trang phản hồi tức thì, LCP desktop 1,4 giây, Accessibility 95.
- Ảnh dưới màn hình đã nạp lười: 35 trên 41 ảnh của trang chủ chỉ tải khi khách cuộn tới.
- Nguyên nhân LCP mobile 7,7 giây: một ảnh nền lớn nặng khoảng 715 KB, trong đó Lighthouse cho rằng khoảng 481 KB là dung lượng có thể bỏ, và các tệp jQuery, CSS của theme chặn hiển thị khoảng 1,3 giây. Tổng ước tính bớt được 768 KB ảnh trên mobile.
- Video giới thiệu báo lỗi tải: tệp video giới thiệu công ty không kết nối được khi đo, nên trình duyệt ghi một lỗi trong bảng điều khiển.
- SEO 92 và Accessibility 95: còn hai liên kết chưa có chữ mô tả, thứ tự thẻ tiêu đề chưa giảm dần và một số chỗ độ tương phản chữ chưa đủ.
Kết quả bàn giao
Khi bàn giao dự án website CES Media, Thiết Kế Web DC đi kèm hướng dẫn quản trị nội dung. Đội ngũ công ty tự thêm sự kiện mới vào danh sách, đăng bài cẩm nang và chỉnh thông tin liên hệ trong WordPress mà không cần nhờ lại đơn vị làm web.
- Nén ảnh nền lớn và đo lại PageSpeed trên mobile: đây là việc rút ngắn LCP rõ nhất.
- Kiểm tra lại đường dẫn video giới thiệu: đưa video về nơi lưu ổn định hoặc thay bằng ảnh bìa để trang chủ không còn báo lỗi.
- Trang chi tiết cho từng sự kiện nổi bật: có album ảnh, quy mô khách mời, hạng mục công ty đảm nhận và lời nhận xét của khách.
- Lọc sự kiện theo loại hình, theo năm và theo nhóm khách: khách chỉ quan tâm hội thảo, triển lãm hoặc sự kiện của cơ quan lọc được ngay, thay vì cuộn qua cả danh sách.
- Trang năng lực mở cho người duyệt thầu: thiết bị, đội ngũ và các bước triển khai một sự kiện được trưng ra, để bộ phận mua dịch vụ tự đối chiếu trước khi gửi yêu cầu.
- Khối con số năng lực ở trang chủ: số sự kiện đã chạy, số năm hoạt động và số tỉnh thành phục vụ, do CES cung cấp và xác nhận trước khi đưa lên.
- Banner đầu trang dạng hình ảnh sự kiện chuyển động: biến màn hình đầu thành một sân khấu thu nhỏ để người xem cảm được không khí sự kiện ngay khi vào trang.
- Nút gọi và nút Zalo cố định: hiện hotline nằm ở chân trang và trang liên hệ, thêm nút nổi giúp khách gọi ngay khi đang xem sự kiện.
Dự án website CES Media đặt năm loại sự kiện, mười hai sự kiện nổi bật, cẩm nang và form báo yêu cầu vào cùng một mạch đọc, trên nền WordPress xanh navy, desktop đạt Performance 92 và Accessibility 95. Phần việc từ dựng giao diện, child theme đến hướng dẫn quản trị do Thiết Kế Web DC đảm nhận trọn gói.
Công ty tổ chức sự kiện, truyền thông hay quảng cáo cần một website cho khách thấy các sự kiện đã làm như dự án website CES Media nên xem trước bảng báo giá thiết kế website trọn gói, tham khảo các dự án đã thực hiện rồi liên hệ Thiết Kế Web DC qua hotline 0886 799 977 – 0563 035 555 hoặc Zalo.
Thiết Kế Web DC – Tư vấn thiết kế website công ty tổ chức sự kiện
- Địa chỉ: 370 Đường 3/2, Phường 12, Quận 10, TP.HCM
- Chi nhánh: 87 Phan Huy Ích, Phường Tân Sơn, TP.HCM
- Hotline: 0886 799 977 – 0563 035 555
- Email: [email protected]
- Website: thietkewebdc.com
