Thư viện thuật ngữ / Web

Thiết kế ưu tiên di động là gì?

Còn gọi: mobile-first, mobile first, ưu tiên di động

Mobile-first là cách thiết kế bắt đầu từ màn hình điện thoại nhỏ nhất, rồi mở rộng dần lên máy tính bảng và máy tính, thay vì thiết kế máy tính trước rồi ép xuống điện thoại.

Ảnh minh hoạ Thiết kế ưu tiên di động (mobile-first): cùng một trang ở ba khung điện thoại, máy tính bảng, máy tính, mũi tên chỉ hướng thiết kế từ nhỏ đến lớn
Cùng một trang ở ba khung điện thoại, máy tính bảng, máy tính, mũi tên chỉ hướng thiết kế từ nhỏ đến lớn

Hiểu kỹ hơn

Bắt đầu từ màn hình nhỏ buộc đội phải chọn nội dung và hành động quan trọng nhất, nên bản máy tính thường gọn hơn. Trong CSS, mobile-first nghĩa là viết kiểu mặc định cho màn nhỏ và dùng media query min-width để thêm bố cục cho màn lớn. Với phần lớn website Việt Nam, đa số lượt truy cập là từ điện thoại, nên bản di động thường là bản quan trọng nhất.