1. Thiết kế web cho di động có thực sự cần?
  2. 5 CSS FrameWork miễn phí tốt nhất khi thiết kế web mobile
  3. Giao diện Youtube cho trình duyệt Chrome

Chủ đề: , ,

Bài viết hướng dẫn dùng Chomre để kiếm tra thiết kế website cho di động. Chrome là trình duyệt tuyệt vời, và luôn luôn tuyệt vời. Dù gần đây những máy cấu hình “yếu” chạy Chrome khá là ỳ ạch không giống như thời mới khai sinh.

Hôm nay mình mới để ý Chrome phiên bản mới nhất như mình đang sử dụng Version 33.0.1750.154 m (tự nó luôn update) có thêm phần kiểm tra website cho thiết bị di động. Hay nói chính xác là Chrome sẽ giả lập thiết bị di động để kiểm tra cách hiển thị của website trên đó.

Đầu tiên các bạn vào website cần hiển thị, click chuột phải sau đó chọn Inspect element (Kiểm tra phần tử) lựa chọn cuối cùng khi bạn click chuột phải

chrome-kiem-tra-web

Ở phần hiển thị ra bạn chọn Emulation lựa chọn thứ 3 ở phần dưới, sau đó chọn thiết bị bạn muốn giả lập, sau đó nhất nút Emulate trình duyệt sẽ giả lập về thiết bị bạn muốn

kiem-tra-website-tren-di-dong

Sau đó muốn chuyển về chế độ bình thường bạn chỉ cần tắt phần Inspect element đi hoặc nhấn Reset.

Cập nhật 14/04

kiemtrawebdidong

Bạn lưu ý lựa chọn theo mũi tên sẽ thấy phần Emulation

Có rất nhiều công cụ giúp bạn làm việc này, tuy nhiên sử dụng trình duyệt Chrome sẽ khiến công việc nhanh hơn, và chuẩn hơn. Hướng dẫn khá đơn giản, chúc các bạn thiết kế được những website cho di động đẹp và theo chuẩn.