Nếu bạn đã từng yêu cầu một lập trình viên “phóng to logo lên” hoặc bảo một nhà thiết kế “sửa lỗi cơ sở dữ liệu,” bạn không hề đơn độc. Hầu hết những người không làm trong ngành công nghệ thường dùng “thiết kế website” và “phát triển website” như thể chúng là một. Thực tế không phải vậy. Một nghề quyết định vẻ ngoài của chiếc xe và vị trí các nút điều khiển. Nghề còn lại xây dựng động cơ, hộp số và hệ thống dây điện. Nếu bạn đang có kế hoạch xây dựng một trang web, thuê một đội ngũ, hoặc chuyển hướng nghề nghiệp, việc hiểu rõ sự phân chia này sẽ giúp bạn tiết kiệm tiền bạc, thời gian và tránh được những sự bực bội không đáng có.
Thiết kế Website thực sự bao gồm những gì
Công việc của một nhà thiết kế web là giải quyết các vấn đề trước khi một dòng mã nào được viết ra. Họ quan tâm đến vẻ ngoài của trang web, nhưng cũng quan tâm đến cách nó vận hành dưới góc độ con người. Các sản phẩm bàn giao của họ sẽ định hướng cho mọi công đoạn tiếp theo.
Công việc thường bắt đầu với cấu trúc. Các nhà thiết kế tạo ra bố cục (layout) và khung xương (wireframe) — những sơ đồ đơn giản bằng thang độ xám để xác định vị trí của thanh điều hướng, cách dòng chảy nội dung diễn ra và điều gì sẽ xảy ra khi người dùng nhấp vào một nút kêu gọi hành động (call-to-action). Ví dụ, một wireframe cho trang đặt lịch hẹn trực tuyến có thể cho thấy người dùng cần xem các khung giờ còn trống trước khi họ nhập thông tin cá nhân. Nếu thiết lập trình tự đó sai, người dùng sẽ rời bỏ biểu mẫu.
Sau khi khung xương được phê duyệt, các nhà thiết kế sẽ thêm vào ngôn ngữ hình ảnh. Họ chọn bảng màu đáp ứng các tiêu chuẩn thương hiệu và vượt qua các kiểm tra độ tương phản về khả năng tiếp cận (accessibility). Họ chọn các kiểu chữ (typeface) có thể đọc tốt trên màn hình điện thoại dưới ánh nắng chói chang. Họ thiết kế các nút, biểu tượng và các trường biểu mẫu với các trạng thái di chuột (hover states) và vòng lặp phản hồi (feedback loops) nhất quán. Tất cả những điều này đều thuộc về công việc thiết kế giao diện người dùng (UI).
Tiếp theo là lĩnh vực rộng lớn hơn là trải nghiệm người dùng (UX). Một nhà thiết kế UX sẽ suy nghĩ về những rào cản (friction). Tại sao một nửa nhóm thử nghiệm không tìm thấy trình tính toán phí vận chuyển? Tại sao người dùng di động lại phải dùng thao tác pinch-zoom trên thư viện sản phẩm? Nhà thiết kế có thể sắp xếp lại thanh điều hướng, chia nhỏ quy trình thanh toán dài thành các bước rõ ràng, hoặc thêm các đoạn văn bản nhỏ (micro-copy) để giải thích lý do tại sao mật khẩu bị từ chối. Mục tiêu không phải là trang trí. Mục tiêu là sự rõ ràng.
Bộ công cụ của nhà thiết kế hiện đại bao gồm Figma để tạo nguyên mẫu (prototyping) cộng tác, Adobe XD, Sketch (vẫn phổ biến trong các agency chuyên về Mac), và Photoshop cho các công việc xử lý tài nguyên hình ảnh nặng. Ngày càng có nhiều nhà thiết kế bàn giao các nguyên mẫu tương tác cho phép các bên liên quan nhấp qua các trang trước khi các lập trình viên bắt tay vào việc. Việc mô phỏng sớm này giúp phát hiện những hiểu lầm mà các ảnh chụp màn hình tĩnh thường che giấu.
Phát triển Website thực sự làm những gì
Nếu thiết kế là bản thiết kế, thì phát triển là đội ngũ xây dựng, công việc điện nước và kiểm định công trình được gộp lại làm một. Các lập trình viên lấy các thiết kế đã được phê duyệt và chuyển chúng thành các tệp mà trình duyệt có thể hiển thị và máy chủ có thể xử lý.
Các lập trình viên front-end xử lý phần hiển thị. Họ viết HTML để cấu trúc nội dung, CSS để kiểm soát bố cục và kiểu chữ, và JavaScript để quản lý tính tương tác. Khi một lập trình viên sử dụng React — một trong những thư viện JavaScript phổ biến nhất — họ thường đang xây dựng các thành phần phức tạp như bộ lọc tìm kiếm thời gian thực hoặc giỏ hàng động có thể cập nhật mà không cần tải lại trang. Công việc của họ là đảm bảo rằng nút bấm mà nhà thiết kế đã vẽ thực sự gửi được dữ liệu, hiển thị trạng thái đang tải và thông báo xác nhận.
Đằng sau lớp hiển thị đó là phần back end. Các lập trình viên back-end viết logic phía máy chủ bằng các ngôn ngữ như Node.js, Python, hoặc PHP. Họ xác thực đăng nhập, xử lý thanh toán và xử lý các quy tắc kinh doanh để quyết định xem người dùng sẽ thấy “còn hàng” hay “hết hàng.” Khi họ tạo ra các API, họ đang xây dựng người đưa tin mang dữ liệu