วิธีการทดสอบเว็บไซต์ Responsive บน Smart phone ด้วย Chrome

[pnut]

วิธีการทดสอบเว็บไซต์ Responsiveบน Smart phone ด้วย Chrome
วันนี้เราจะแนะนำวิธีการทดสอบเว็บไซต์ Responsive บน Smart phone ด้วย Chromeโดยในแต่ละครั้งในการออกแบบเว็บไซต์นั้น บางครั้งต้องการดูผลลัพธ์บนอุปกรณ์แท็บแล็ต หรือมือถือต่างๆ ซึ่งความละเอียดของหน้าจอนั้นๆจะแตกต่างกันออกไป ซึ่ง Chome จะมีเครื่องมือที่ช่วยให้แสดงผลบนอุปกรณ์ Smart phone โดยไม่ติดตั้งโปรแกรมเสริมใดๆเลย แถมวิธีการก็จะแสนง่ายดาย โดยมีวิธีการทดสอบดังนี้
1.ให้ไปที่ More tools
2.คลิก Doveloper tools ดังภาพ

2.png (227.09 KiB) เปิดดู 220 ครั้ง

3.เลือกที่รูปโทรศัพท์ ดังภาพ

3.png (129.18 KiB) เปิดดู 220 ครั้ง

4.ก็จะแสดงผลลัพธ์การทดสอบเว็บไซต์ Responsive บน smart phone

5.jpg (59.03 KiB) เปิดดู 220 ครั้ง

5.โดยเราสามารถเลือกการแสดงตามอุปกรณ์ที่ต้องการได้และสามารถเลือกแสดงเป็นแนวนอนหรือแนวตั้งได้

6.png (70.6 KiB) เปิดดู 220 ครั้ง

ตัวอย่างการแสดงผลบนอุปกรณ์ I-PHONE6 แนวนอน www.mindphp.com

7.jpg (52.74 KiB) เปิดดู 219 ครั้ง