☛ Xem responsive trang web của bạn ☚

Cách thức hoạt động

1. Thêm URL của bạn vào trường đầu vào
2. Nhấp vào GO (tải lại bản xem trước) hoặc nhấn Enter (tải lại trang)
3. Xem trang web của bạn đã được responsive chưa

Tính năng

• http://localhost/ Nó hoạt động tốt nên rất tuyệt vời để chụp ảnh màn hình các URL phát triển cục bộ.
• Gửi liên kết có sẵn trang web của bạn bằng cách sử dụng ?url=http://www.yoursite.com - Nhấp here xem ví dụ
• Sắp xếp lại thứ tự các thiết bị bằng cách nhấp và kéo trên thiết bị.

Đây không phải là công cụ để kiểm thử, điều thực sự quan trọng là bạn phải thực hiện việc đó trên các thiết bị thực. Thay vào đó, đây là công cụ để chụp ảnh màn hình nhanh (đối với tôi) và giúp mọi người "hiểu" trực quan ý bạn muốn nói trong các cuộc họp với khách hàng.

Cửa sổ quan sát

Máy tính để bàn (Desktop)

Ảnh có kích thước 1600x992px được thu nhỏ lại thành scale(0.3181)

Máy tính xách tay (Laptop)

Ảnh có kích thước 1280x802px được thu nhỏ lại thành scale(0.277)

Tablet

Ảnh có kích thước 768x1024px được thu nhỏ lại thành scale(0.219)

Mobile

Ảnh có kích thước 320x480px được thu nhỏ lại thành scale(0.219)

Một lưu ý về các khung nhìn

Các khung nhìn mà tôi đã chọn dựa trên các thiết bị thuộc bố cục PSD đáp ứng mà tôi đã mua trước đây, và đúng vậy, tất cả đều là của Apple. Tôi xin lỗi tất cả những người hâm mộ Android, tôi chắc chắn một số bạn đang nghĩ đến lập luận "Android có thị phần lớn hơn" nhưng mặc dù các bạn đúng, tôi chỉ đơn giản là không có bộ hình ảnh đó khi bắt đầu. Nếu có đủ nhu cầu, tôi có thể tạo ra một bộ sản phẩm khác, nhưng tôi không chắc liệu việc thêm chúng có cải thiện chức năng cơ bản của công cụ hay không.

Responsive Test Tool For Mobile Website - Online
Công cụ kiểm thử tương thích cho website di động - Trực tuyến. (Design: Vũ Văn Hoàn)