Học Wordpress

Responsive Testing trên Google Chrome

Responsive Testing tool
0

Trên Google Chrome có môt chức năng rất hay dành cho các bạn Thiết kế cũng như phát triển Web. Đó chính là Responsive Testing

Responsive Testing là gì?

Nói một cách ngắn gọn, Responsive Testing là một chức năng dành cho các nhà phát triển Web muốn kiểm tra khả năng tương thích của Website với các thiết bị khác nhau, tương ứng với kích thước màn hình khác nhau. Từ đó đưa ra các điều chỉnh thích hợp.

Cách sử dụng Responsive Testing

Trước tiên bạn mở Website mà bạn cần kiểm tra. Bạn lựa chọn biểu tượng devtools_button ở góc bên phải phía trên màn hình. Rồi lựa chọn  Tools -> Developer Tools.
steps2

Khi đó bạn sẽ thấy có một cửa sổ nhỏ bên dưới website. Bạn chọn vào biểu tượng dev_button và chọn emulation như trong hình vẽ. Sau đó bạn chọn tiếp loại thiết bị tương ứng với kích thước màn hình mà bạn cần kiểm tra.

step3

Cuối cùng nhấn nút Emulate và Refresh lại Website là bạn sẽ thấy Website của bạn hiển thị bên trong thiết bị như trên thiết bị thật (Ở đây mình chọn là Google Nexus 5)

step4

Bạn cũng có thể điều chính kích thước màn hình theo ý mình bằng cách chọn Screen như trong hình vẽ.

screen_size

Kết luận:

Như vậy với công cụ tích hợp sẵn bên trong Google Chrome rất tiện lợi cho chúng ta trong quá trình phát triển và xây dựng Website. Không cần phải cài thêm công cụ nào khác cho nặng máy.

Chúc các bạn thành công!

 

Phạm Tú
Xin chào các bạn! Tôi là Phạm Tú. PhamTu dot Com được lập ra với mong muốn chia sẻ những kiến thức về Digital Marketing, Kiếm tiền trên mạng (MMO) giúp các bạn có được nguồn thu nhập thụ động và bền vững nhất.
You may also like
CloudFlare là gì?
Tạo Sitemap Wordpress
Tạo sitemap wordpress với Google Sitemaps Generator