Biến thể responsive và theo thiết bị

Tạo bản di động và máy tính cho một màn hình và giữ chúng đồng bộ.

Cập nhật lần cuối:

Tạo một biến thể

Hãy yêu cầu, hoặc dùng thanh chọn thiết bị trên màn hình:

Tạo bản di động cho trang giới thiệu.

Biến thể là một màn hình mới trên canvas, được điều chỉnh theo chiều rộng đích — không phải một lần co giãn linh hoạt. Bố cục thật sự được sắp xếp lại: các phần nhiều cột xếp chồng, thanh điều hướng thu gọn, kiểu chữ hạ thang.

Chi phí

Chuyển một màn hình sang kích cỡ thiết bị khác được tính theo từng màn hình, cùng mức với một lượt tạo lại, bởi vì nó chính là vậy. Chuyển tám màn hình tốn gấp tám lần — nên kiểm tra số dư trước.

Giữ các biến thể đồng bộ

Biến thể là những màn hình riêng biệt, nên một chỉnh sửa sau này trên bản máy tính không tự chảy sang bản di động. Hai lựa chọn:

  • Yêu cầu thay đổi trên cả hai một cách rõ ràng: “Trên cả trang giới thiệu bản máy tính lẫn bản di động, đổi CTA thành ‘Bắt đầu miễn phí’.”
  • Hoặc hoàn thiện bản máy tính trước, rồi tạo các biến thể một lần ở cuối. Đây thường là thứ tự tiết kiệm hơn.

Chủ đề dùng chung

Cả hai biến thể dùng chủ đề của dự án, nên thay đổi màu và phông chữ tự động áp cho cả hai. Chỉ bố cục là riêng của từng biến thể.

Mã đã xuất

Mã đã xuất phản ánh đúng màn hình bạn xuất. Nếu bạn cần một bản hiện thực thật sự responsive thay vì hai bố cục cố định, hãy xuất màn hình máy tính rồi điều chỉnh, hoặc xuất cả hai và ghép lại ở breakpoint — xem Xuất mã nguồn.

Bài viết này có hữu ích không?

Bài liên quan

Read this in your language