Website của bạn nhìn thế nào trên các điện thoại khác nhau?

Điện thoại thông minh đang phát triển với tốc độ như vũ bão, đa dạng về nhãn hiệu, kích thước hơn rất nhiều máy tính bàn.

Nhưng như vậy, một vấn đề đặt ra với các nhà thiết kế lúc này là, làm sao để biết các thiết kế của mình sẽ nhìn thế nào trên các loại điện thoại thông minh.

Chúng ta tò mò muốn biết trang web của chúng ta nhìn thế nào trên trình duyệt Safari phiên bản Windows, hoặc phiên bản Android, cho dù nhiều người dùng sẽ lựa chọn Safari trên Android.

Có 3 hệ điều hành chính và 4 trình duyệt chủ yếu dùng cho máy để bàn. Thật tuyệt là chúng ta có những công cụ như Browser Shots và Adobe’s Browser Lab giúp chúng ta theo dõi được thiết kế của mình trên các trình duyệt khác nhau.

Với điện thoại thì thật không may, không có nhiều những công cụ mạnh mẽ để bạn có thể kiểm tra các thiết kế trên các trình duyệt điện thoại khác nhau và điện thoại OSs.

Tuy nhiên, có một vài lựa chọn tốt để bạn có thể kiểm tra thiết kế của mình trên các loại điện thoại thông minh phổ biến nhất mà khỏi cần sở hữu chúng.

Opera Mobil Emulator

Lời khuyên đầu tiên của tôi là Opera Mobile Emulator – bạn chỉ cần chọn tên thiết bị điện thoại trong danh sách có sẵn và bấm nút Launch để mở trình duyệt điện thoại trên máy tính bàn.

Trình duyệt sẽ thu nhỏ vào đúng với kích thước của thiết bị di động mà bạn chọn và bạn chỉ cần gõ địa chỉ trang web trong thanh địa chỉ để xem trang web nhìn sẽ ra sao trên mành hình điện thoại.

Opera Emulator cũng cho phép bạn cài đặt cho một vài máy tính bảng như Galaxy Tab và Motorola Xoom. Nếu như loại điện thoại mà bạn cần không có trong danh sách, bạn có thể tự tạo một tên mới và nhập thông số độ phân giải và mật độ điểm ảnh – pixel density (hoặc mức độ zoom mặc định).

Opera Emulator sẽ render các trang web như trình duyệt Opera mobile, nhưng bạn có thể thay đổi trình duyệt mặc định User Agent String để nhìn nó hiển thị giống như Android hay Nokia S60.

Đơn giản là nhấp vào logo Opera ở góc dưới bên phải và đặt Setting để thay đổi trình duyệt mặc định User-agent string.

Mobilizer

Công cụ tuyệt vớì kế tiếp để bạn kiểm tra các thiết kế của mình trên điện thoại là Mobilizer.

Đây là một Adobe Air app, giúp bạn xem các thiết kế của bạn trên thiết bị điện thoại thông minh phổ biến như Apple iPhone, Palm Pre, HTC Evo và BlackBerry Storm.

Bạn có thể mở bất kỳ không giới hạn số lượng các loại điện thoại di động trên máy tính của bạn. Bạn có thể nhấp chuột phải vào mỗi loại thiết bị để render ra PNG file.

Điều đặc biệt ở công cụ này là bạn thậm trí có thể kéo thả một trang HTML hoặc hình ảnh và kiểm tra thiết kế trước khi tải chúng lên web.

Theolabnol

Cùng tác giả

#Tag

Kiến thức mobile

iDesign Must-try

Paul Cézanne — Quá trình của Sự thấy - (Phần 7)
Paul Cézanne — Quá trình của Sự thấy - (Phần 7)
Bức tranh rõ ràng là chưa hoàn chỉnh. Làm thế nào nó có thể là nghệ thuật? Nhưng Cezanne không hề nao núng trước những lời chỉ trích nhắm vào…
Hiếu Y: ‘Mình thấy hiếu kỳ với cách mọi người cảm nhận cái đẹp’
Hiếu Y: ‘Mình thấy hiếu kỳ với cách mọi người cảm nhận cái đẹp’
Sự rung cảm trước cái đẹp, cách mà con người thưởng thức hay những câu chuyện di sản – đời sống – con người làm cho Hiếu Y có những…
Gamification trong thiết kế và những điều bạn cần biết! (Phần 2)
Gamification trong thiết kế và những điều bạn cần biết! (Phần 2)
Ở phần 1, chúng ta đã có bức tranh tổng thể về Gamification (Game hóa) mà ngày nay không ít doanh nghiệp sử dụng, giúp thu hút nhiều người dùng…
Thời kỳ Victoria (Phần 1): Tóm lược và lịch sử
Thời kỳ Victoria (Phần 1): Tóm lược và lịch sử
Thời kỳ Victoria tuy không phải là một thời kỳ rõ rệt trong lịch sử nghệ thuật và thiết kế cả về mặt phong cách lẫn tư tưởng triết học…
Đi tìm câu chuyện “tiến hóa” của nghệ thuật trang trí Giáng Sinh
Đi tìm câu chuyện “tiến hóa” của nghệ thuật trang trí Giáng Sinh
Giáng Sinh bắt nguồn từ đâu, thời gian nào và nó đã "tiến hóa" ra sao?
UX Design: 9 loại hoạt ảnh trong ứng dụng mobile
UX Design: 9 loại hoạt ảnh trong ứng dụng mobile
Khi mọi thứ được tích hợp vào giao diện, hoạt ảnh ứng dụng phải là phần tử chức năng thay vì chỉ mang tính trang trí. Các yếu tố chuyển động…