Dự án website Taxi Đồng Xoài do Thiết Kế Web DC thực hiện cho dịch vụ taxi 24/7 tại Đồng Xoài, Bình Phước, giai đoạn 2024 đến 2025: tám thẻ huyện và tám thẻ loại chuyến, mỗi thẻ một nút gọi xe.
Thông tin dự án
Dự án thuộc nhóm thiết kế website doanh nghiệp dịch vụ địa phương, nơi người xem chỉ cần thấy loại chuyến và số điện thoại. Các dòng trong bảng lấy từ trang chủ, trang Liên hệ và chân trang của website. Dự án nằm trong mảng thiết kế website của Thiết Kế Web DC.
| Hạng mục | Nội dung |
| Khách hàng | Dịch vụ Taxi Đồng Xoài 24h, 148 Quốc Lộ 14, TP. Đồng Xoài, Bình Phước |
| Lĩnh vực | Taxi và xe hợp đồng phục vụ 24/7 |
| Khu vực | Đồng Xoài và các huyện của tỉnh Bình Phước |
| Thời gian | 2024 đến 2025 |
| Nền tảng | WordPress, theme Hello Elementor, Elementor Pro, ElementsKit |
| Đơn vị thực hiện | Thiết Kế Web DC |
| Website | taxidongxoai24h.net |
Điểm nổi bật của dự án
Dự án có năm điểm đáng chú ý, và cả năm nằm ở cách DC sắp xếp website quanh một cuộc gọi chứ không ở hiệu ứng. Mỗi điểm đều kiểm lại được trực tiếp trên taxidongxoai24h.net, và phần sau của bài ghi chi tiết từng điểm. Thứ tự đi từ lựa chọn của khách tới giao diện.
1. Tám thẻ huyện: mỗi huyện một thẻ riêng kèm nút gọi xe.
2. Tám thẻ loại chuyến: mỗi loại một thẻ, mỗi thẻ một nút gọi.
3. Ba nút liên hệ cố định: gọi điện, Zalo và thư nằm trên màn hình khi cuộn.
4. Menu cố định đầu trang kèm ô tìm kiếm.
5. Chữ nội dung đạt tương phản chuẩn WCAG AA: 11,55:1 trên nền trắng.
Bối cảnh của dự án
Taxi Đồng Xoài 24h nhận đặt xe đi trong thành phố, đi các huyện lân cận và đi tỉnh, nên Thiết Kế Web DC làm website theo mô hình giới thiệu dịch vụ vận tải kèm nút gọi xe. Người xem thường cần xe gấp và cần biết xe có đi nơi mình cần hay không.
Địa bàn, loại chuyến và địa chỉ của khách
Thiết Kế Web DC đưa tám địa bàn huyện và tám loại chuyến lên trang chủ. Các địa bàn gồm Phú Riềng, Đồng Xoài, Chơn Thành, Bình Long, Lộc Ninh, Bù Đốp, Phước Long và Đồng Phú. Các loại chuyến gồm đón sân bay, đón bệnh viện, lễ hội và cưới hỏi, đi tỉnh về quê du lịch, đường ngắn đường dài, xe theo yêu cầu, xe đi tỉnh và xe các huyện lân cận. Địa chỉ 148 Quốc Lộ 14, TP. Đồng Xoài được ghi ở chân trang và trang Liên hệ.
Định hướng thiết kế
DC xác định bốn mục tiêu cho website trước khi dựng giao diện: gọi được xe trong một lần chạm, chọn đúng chuyến trong một lần nhìn nhờ huyện và loại chuyến tách thành thẻ riêng, thấy rõ thông tin của đơn vị gồm địa chỉ và ba trang chính sách, và có form để gửi yêu cầu khi khách không tiện gọi. Cách DC thực hiện từng mục tiêu nằm ở các phần sau của bài.
Trải nghiệm người dùng
Thiết Kế Web DC sắp xếp website để người cần xe đi từ trang chủ tới đúng huyện hoặc đúng loại chuyến rồi tới cuộc gọi, không qua nhiều bước. Mục này chỉ nói về đường đi của người xem, còn giao diện nằm ở phần sau. Có ba mục: người xem, sơ đồ trang và luồng.
Người xem website
Website phục vụ hai nhóm người xem, xác định từ nội dung website chứ không từ số liệu hành vi thật. Nhóm thứ nhất là khách cần xe gấp trong thành phố, ở bệnh viện hoặc sân bay, họ cần thấy số gọi ngay khi mở trang. Nhóm thứ hai là khách đặt trước cho chuyến cưới hỏi, lễ hội, đi tỉnh hay về quê, họ cần thấy loại chuyến của mình có được nhận hay không.
Sơ đồ trang
DC chia website thành các nhóm trang ngắn, vì người cần xe hiếm khi đọc sâu.
- Trang chủ: cổng vào gồm tên dịch vụ, nút gọi, tám thẻ huyện và tám thẻ loại chuyến.
- Giới thiệu: bốn ý về cách phục vụ, thẻ xe 4 chỗ và xe 7 chỗ, mỗi thẻ có nút gọi để được tư vấn và báo giá.
- Dịch vụ: tám loại chuyến, mỗi loại một nút đặt xe.
- Liên hệ: địa chỉ, hotline và form ba ô gồm họ tên, email, nội dung với nút "Gửi yêu cầu".
- Bảng giá và Tin tức: hai mục còn lại trên menu.
- Ba trang chính sách ở chân trang: điều khoản dịch vụ, chính sách hoàn tiền, chính sách bảo mật.
Luồng người dùng
Người cần xe gấp bấm nút "Gọi ngay" ở đầu trang chủ và gọi luôn. Người biết huyện cần đến chọn thẻ huyện rồi bấm "Gọi xe", còn người cần một loại chuyến riêng chọn thẻ loại chuyến hoặc vào trang Dịch vụ rồi bấm "Đặt xe". Người không tiện gọi vào trang Liên hệ và gửi form, còn người muốn tìm theo từ khóa dùng ô tìm kiếm trong thanh menu.
Thiết kế giao diện
Thiết Kế Web DC dựng giao diện trên theme Hello Elementor, nền trắng, xanh lá `#70b538` cho nút và tên huyện, một họ phông Roboto cho toàn trang. Màu và chữ do DC đo trên website đang chạy. Phần này ghi phông chữ, bố cục trang chủ, thanh menu, thành phần giao diện và nút liên hệ cố định.
Phông chữ
DC dùng một họ phông Roboto cho toàn trang, chỉ đổi cỡ và độ đậm để phân thứ bậc. Tiêu đề cỡ 28 px đậm màu `#393939`, thân bài 16 px với dòng cao 26 px, menu 14 px đậm và chữ trên nút 15 px đậm. Một họ phông duy nhất giữ trang thống nhất và gọn khi tải.
Bố cục trang chủ
DC dựng đầu trang với tên "Taxi Đồng Xoài 24h", bốn ý ngắn về dịch vụ và nút "Gọi ngay" kèm số hotline. Dưới đầu trang, trang chủ xếp theo thứ tự sau:
1. Đi các huyện: tám thẻ huyện, mỗi thẻ một nút.
2. Dịch vụ xe taxi: tám thẻ loại chuyến, mỗi thẻ một nút.
3. Lý do chọn: bốn ý là luôn có sẵn xe 24/7, tài xế tận tâm, tận tâm phục vụ và ưu tiên trải nghiệm.
4. Hình ảnh: thư viện ảnh xe và các chuyến phục vụ.
5. Cam kết: bốn cam kết về xe sạch sẽ, chi phí trao đổi rõ ràng, hỗ trợ khách thường xuyên và chú trọng an toàn.
6. Chân trang: giới thiệu đơn vị, hotline 24/7, địa chỉ và ba trang chính sách.
Thanh menu
DC giữ menu sáu mục gồm Trang chủ, Giới thiệu, Dịch vụ, Bảng giá, Tin tức và Liên hệ, đặt sát số điện thoại ở đầu trang. Menu được cấu hình cố định đầu trang trên cả máy tính, máy tính bảng và điện thoại, nên khi khách cuộn xuống, menu và số gọi vẫn nằm trên cùng. Trong thanh menu có ô tìm kiếm do plugin Add Search to Menu tạo.
Thành phần giao diện
DC giao cho mỗi màu một việc cố định, nên khách học được quy tắc rất nhanh: màu xanh lá là chỗ để bấm.
| Mã màu | Dùng cho |
| #70b538 | Nút "Gọi ngay", "Gọi xe", "Đặt xe" và tên huyện |
| #393939 | Tiêu đề và đoạn nội dung trên nền trắng |
| #efefef | Nền khối "Lý do chọn" |
| #2e2f2e | Nền khối cam kết |
Về độ tương phản, DC tính tỷ lệ tương phản theo chuẩn WCAG 2.1. Tiêu đề và đoạn nội dung `#393939` đạt 11,55:1 trên nền trắng, vượt xa mức 4,5:1 mà chuẩn AA yêu cầu cho chữ thường. Mỗi thẻ chỉ có tên huyện hoặc tên chuyến và một nút, phần giải thích dài được dồn về trang Giới thiệu.
Nút liên hệ cố định
DC đặt một cụm ba nút cố định ở góc màn hình: gọi điện, Zalo và thư. Ba nút này đi theo khách khi cuộn, nên người xem ở bất kỳ vị trí nào của trang cũng liên hệ được mà không phải tìm lại số hotline. Nút gọi dùng liên kết `tel:` nên bấm là gọi trên điện thoại.
Công nghệ và kỹ thuật
Thiết Kế Web DC dựng website trên WordPress với theme Hello Elementor và bộ Elementor Pro. Đây là hướng thiết kế website bằng WordPress mà DC dùng cho dịch vụ địa phương. Bốn mục sau ghi phần giao diện, phần chạy phía sau, kỹ thuật nền và quản trị, và đều chỉ lấy từ mã trang.
Front-end: Hello Elementor và Elementor Pro dựng thẻ gọi xe
DC dựng phần người xem thấy bằng theme Hello Elementor và trình dựng trang Elementor Pro. Hello Elementor là theme nhẹ, nhường toàn bộ phần dàn trang cho Elementor, còn Elementor Pro dựng các khối trang chủ, thẻ huyện và thẻ loại chuyến. Plugin ElementsKit bổ sung thanh menu cố định và các thành phần bổ trợ cho Elementor.
Back-end: WordPress và plugin tìm kiếm trong menu
Thiết Kế Web DC dựng phần chạy phía sau trên WordPress 6.6.2, ghi trong thẻ generator của trang, quản lý trang, bài viết và menu. Plugin Add Search to Menu thêm ô tìm kiếm vào thanh menu, còn plugin Rank Math SEO PRO sinh thẻ canonical, thẻ Open Graph và dữ liệu có cấu trúc.
Kỹ thuật nền
Website chạy qua kết nối HTTPS, và máy chủ khai báo hỗ trợ giao thức HTTP/3. Trang khai báo khung nhìn theo chiều rộng thiết bị và tải phông từ Google Fonts. Dữ liệu có cấu trúc JSON-LD gồm các loại WebSite, WebPage và Article, kèm hành động tìm kiếm của website.
Quản trị website
Thiết Kế Web DC bàn giao website để chủ dịch vụ tự quản trị nội dung trong WordPress. Khi cần thêm một huyện hoặc một loại chuyến, chủ dịch vụ nhân bản một thẻ có sẵn trong Elementor thay vì phải viết mã. Thông tin liên hệ và ba trang chính sách cũng sửa được ngay trong trang quản trị.
Kết quả
Phần Kết quả gồm số đo của trang chủ và danh sách tính năng đang chạy. Thiết Kế Web DC kiểm từng dòng trực tiếp trên taxidongxoai24h.net trước khi ghi, và mỗi dòng chỉ nêu cái thấy rõ trên trang chủ hoặc trong mã trang. Người đọc có thể mở website để tự đối chiếu bất kỳ dòng nào.
Số đo website sau khi dựng
Trang chủ được đo bằng PageSpeed Insights hai lần với cùng một kết quả, và bảng dưới là số đo bản máy tính.
| Chỉ số | Kết quả đo |
| Điểm SEO | 100/100 |
| Thời gian hiển thị nội dung chính (LCP) | 0,9 giây |
| Độ ổn định bố cục (CLS) | 0 |
Cả hai số LCP và CLS thuộc nhóm "tốt" của Google, với ngưỡng 2,5 giây và 0,1.
Tính năng chạy được
Mỗi dòng dưới đây là một tính năng đang chạy và kiểm lại được trực tiếp.
| Tính năng | Cách hoạt động |
| Gọi một chạm | Các nút "Gọi ngay", "Gọi xe", "Đặt xe" dùng liên kết `tel:` |
| Nút liên hệ cố định | Ba nút gọi điện, Zalo và thư nằm ở góc màn hình khi cuộn |
| Menu cố định | Thanh menu bám đầu trang trên máy tính, máy tính bảng và điện thoại |
| Tìm kiếm | Ô tìm kiếm trong thanh menu |
| Form liên hệ | Ba ô họ tên, email, nội dung và nút "Gửi yêu cầu" ở trang Liên hệ |
Bài chỉ mô tả giao diện máy tính, chưa kiểm bố cục và tốc độ trên điện thoại nên không nhận định về bản di động.
Website Taxi Đồng Xoài cho thấy cách biến một dịch vụ có nhiều địa bàn và loại chuyến thành các thẻ riêng, nơi mỗi thẻ dẫn thẳng tới một cuộc gọi.
Anh chị có thể xem thêm các dự án khác và bảng báo giá thiết kế website trọn gói của DC. Muốn trao đổi về website cho dịch vụ của mình, mời liên hệ Thiết Kế Web DC.
