Quy trình thiết kế Website cho những người không chuyên

A. Vấn đề/thực trạng

Quay ngược lại thời gian cách đây tầm 10 - 15 năm, khi đó ở VN trào lưu thiết kế website bùm nổ. Các công ty Web mọc lên như nấm, chúng ta không phủ nhận tầm quan trọng của website với doanh nghiệp. Nhưng đu theo trào lưu mà không có phương pháp thì sớm gì cũng ăn trái đắng.

Nói đâu xa, thiếu gì các doanh nghiệp chỉ trong vài ba năm làm đi làm lại chục cái website, thêm nữa, bị mấy đơn vị lừa mua hosting càng lớn để web chạy cho nhanh, Index Google cho lẹ, bổ sung thêm mấy tính năng chẳng bao giờ dùng tới.

Hay là lúc đầu ký hợp đồng thì 1 bầu trời hy vọng, cho đến khi web bàn giao thì ngã ngữa ra lỗi rồi tùm lum đủ thứ, chỉ muốn bỏ luôn cho rồi.

Ở Sài Gòn, Công Viên phần mềm Quang Trung có công ty hễ gặp là tự hào lớn nhất Việt Nam, làm thì chả tới đâu, chém gió là giỏi. Đố bạn biết đó là công ty nào?

B. Các thành phần cấu tạo nên Web

Quay trở lại, trước khi đi đến các bước cụ thể, các anh/chị cần phải hiểu rõ rằng để 1 website có thể hoạt động được, cần 3 yếu tố như sau :

1. Hosting/Sever : Đây là nơi lưu trữ website, nó như ổ cứng máy tính vậy đó. Nhanh hay chậm không phụ thuộc “Dung lượng bao nhiêu?”. Mà có 2 yếu tố sau tác động :

- Băng thông (Bandwith) : Có bị giới hạn hay không? Tốt nhất là không nên giới hạn

- Cấu hình phần cứng : Như Ram, chất lượng SSD hay HDD, những thứ này ảnh hưởng trực tiếp đến tốc độ truy xuất dữ liệu. Nên khi mua, chọn nhóm “Chất lượng cao”, hoặc nhờ người có chuyên môn mà tham vấn.

Lời khuyên xương máu là hãy mua bên độc lập thứ 3, tuyệt đối không mua của đơn vị thiết kế web.

2. Domain (Tên miền) : Nó là cái địa chỉ để khách hàng truy xuất vào website, nên mua đâu cũng được, miễn dễ nhớ, dễ dùng là Ok.

Nên nhớ, cái tên miền, hosting nó chả liên quan gì đến mấy cái SEO, chạy quảng cáo ra đơn, đừng có nghe thầy/bà tự xưng múa miệng rồi lại mất tiền oan.

3. Phần Code (Phần lập trình) : Là giao diện, là chức năng mà các anh/chị tương tác được trên điện thoại, hay máy tính. Được viết bằng các ngôn ngữ lập trình khác nhau, như HTML/CSS (cấu trúc & giao diện), JavaScript (tương tác), cùng các ngôn ngữ backend như PHP, Python, Java, Ruby.

Phần này đừng quan tâm chi cho đau đầu nếu không phải là dân lập trình, viết bằng cái gì không quan trọng, quan trọng là cái web nó phải :

- Nhanh, không lỗi vặt

- Dễ phát triển về sau

- Bảo mật là được

C. Quy trình thiết kế

- Bước 1 : Xác định rõ nhu cầu cụ thể

Các anh/chị đang muốn làm web cho mục đích gì? Chỉ đơn thuần là Show thông tin, hay thương mại điện tử mua bán, chạy quảng cáo ở trên đó. Liệt kê ra đầy đủ được thứ mình muốn, mình cần thì mới tới bước tiếp theo.

Nếu không biết, đừng vội làm, cứ tham khảo, hỏi hết người này người kia, lên Youtube, Tiktok coi kênh này, Clip nọ, từ từ là tỏ tường cả thôi.

Đừng lo việc bạn chưa bao giờ có kinh nghiệm, nghĩ ra cái gì, muốn cái gì, quăng vào AI nói nó phân tích nhu cầu, đặt ngược câu hỏi để đào sâu hơn. Từ đó nó sẽ đưa ra lời khuyên chi tiết, dự trù chi phí, các vấn đề có thể phát sinh.

- Bước 2 : Vẽ Site Maps

Sitemaps của 1 website trông nó như thế này, chả khác gì sơ đồ tư duy, trong trang chủ thì có nội dung gì? Chức năng ra sao? Các trang khác thế nào. Mục tiêu là để đặc tả rõ cách thức hoạt động của Website, là kim chỉ nam cho code lập trình đi đúng những gì mình muốn.

Giới Dev hay gọi giai đoạn này là Workflow. Lưu ý : Sitemap bắt buộc phải được vẽ ra đầy đủ, còn nếu không khả năng cao, kiểu gì làm website xong cũng phát sinh sửa đi làm lại tỷ lần vẫn không đúng được ý tưởng trong đầu đâu.

- Bước 3 : Vẽ Demo

Đây là bản vẽ hình hóa từ Sitemaps phía trên, demo như thế nào, thì website của bạn khi hoàn thành trông y chang như thế. Chỉ khác là chưa có chức năng, chưa tương tác được trong thực tế mà thôi.

Ở bước này, phải làm kỹ 2 loại giao diện gồm Laptop và Mobile. Tùy việc bạn có tiền hay không? Có thể build Demo trực tiếp bằng HTML tức là phần giao diện động (Font end) luôn cũng được, nếu không thì demo bằng hình cũng chả sao.

Lưu ý : Bây giờ thế giới phát triển dữ lắm rồi, bước 1, 2, 3 dùng AI cực kỳ nhanh lại còn chính xác, có rất nhiều AI có thể xử lý được như Google Stitch, GPT, bạn quen cái nào thì dùng cái đó

- Bước 4 : Lập trình

Đây là giai code của team Dev, bạn nên tìm 1 đơn vị uy tín, hoặc 1 cá nhân/nhóm nào đó có đủ khả năng đáp ứng yêu cầu, cũng như họ phải bền về mặt thời gian. Để sau này tránh việc team họ rã đám, website của chúng ta bị đem con bỏ chợ

Có 1 số tiêu chí để bạn tìm chọn Team Dev cho phù hợp :

1. Tư duy mở : Xử lý vấn đề, sẵn sàng chịu trách nhiệm

2. Tinh thần học hỏi cái mới, cập nhật xu hướng như AI, ngôn ngữ, phương pháp mới, chứ cách làm 10 năm trước đến nay vẫn sài, thì lỗi thời rồi.

3. Có kinh nghiệm : Còn nếu không, ngược lại bạn sẽ là chuột bạch để họ code cho lên tay.

Ở đây bạn sẽ có 2 hướng mà phần đa thị trường đang có :

1. Code mới hoàn toàn tất cả theo ý tưởng riêng

2. Mua giao diện có sẵn như Wordpress, Haravan, Mắt Bão....

Tùy theo ngân sách, mục tiêu sử dụng mà ta chọn sao cho phù hợp là được, không có cái nào là toàn diện cả đâu.

- Bước 5 : Kiểm tra lỗi

Dùng thử, up nội dung, check thử trên nhiều thiết bị xem có bị lỗi ở đâu không? Load có nhanh không. Kiểm tra đến khi nào ổn hết thì mới đưa vào sử dụng, chứ tuyệt đối không có vội rồi lâu lâu lại phát hiện cái này cái kia thì lại cãi cọ đổ lỗi cho nhau mệt lắm.

Lưu ý : Tuyệt đối không để đơn vị thiết kế web lừa, rõ ràng 2 loại hợp đồng là thiết kế và lập trình, cấm có gộp chung.

D. Tổng kết

Như vậy chúng ta đã trải qua 5 bước để thiết kế lên 1 website cho người không chuyên. Các anh/chị cứ hình dung, y như việc xây nhà, phải thiết kế bản vẽ, hoạch định vật tư đầy đủ, xong xuôi, chuẩn chỉnh hết đi đã. Rồi mới bàn giao cho bên thi công, xây dựng theo kế hoạch, chứ tuyệt đối không có tin mấy ông xây nhà trọn gói, tặng gói thiết kế, bao thi công ha. Biết bao nhiêu vụ bóc phốt um xùm trên mạng rồi, nên tránh đi vào lại vết xe đổ của người khác nha.

Lưu ý quan trọng nè, bước số 2, 3 rất quan trọng, nó không chỉ quyết định hình tướng website trông như thế nào? Mà còn quyết định phần nội dung ở trên đó. Nên nếu đã làm kỹ được 2 bước đó, thì khi tới bước 4 lập trình, song song team Marketing đã phải chuẩn bị sẵn nội dung, hình ảnh để bày trí trên trang.... Chưa kể còn phải áp dụng AI, chatbot sau này nữa cơ.

Nên thôi, cái đó để 1 video khác, giờ nội dung hôm nay quá dài rồi, xin chào và hẹn gặp lại trong cách video lần sau.