ในการพัฒนาเว็บไซต์ต่าง การแสดงผลเป็นสิ่งสำคัญมาก เพราะหากการแสดงผลไม่ตรงตามที่เราออกแบบไว้ก็จะทำให้เกิดข้อผิดพลาด
ทำไห้เว็บไซต์ไม่น่าสนใจ โดยจะมาพูดถึงการเปิดเพื่อใช้งาน Responsive Design Mode เบราเซอร์ safari ใน MacOS
Safari เป็นเว็บบราวเซอร์ที่มาพร้อมกับเครื่อง Mac ถูกพัฒนาขึ้นโดยบริษัท Appleซึ่งใน Safari เวอร์ชัน 9 มีโหมด Responsive Design Modeป็นตัวช่วยนักพัฒนาเว็บ ออกแบบเว็บตามขนาดหน้าจอ การวางแนว และความละเอียดต่างๆ
ช่วยให้นักพัฒนาแน่ใจได้ว่าเว็บไซต์และแอพ รองรับอุปกรณ์และแพลตฟอร์มที่หลากหลายได้
วิธีเปิดใช้งาน สามารถทำได้ดังนี้
1.เข้า safari แล้วไปแถบเมนูด้านบนกดที่ safari แล้วเลือก Preferences
2.ใน หน้านี้จะมีตัวเลือกการตั้งค่าต่างๆหลายตัว ในสว่นนี้ให้เลือก Advanced ที่เป็นรูปฟันเฟือง
3.ก็จะเข้ามาหน้านี้ ที่ด้านล่างสุดของเมนู จะเห็น Show Develop menu in menu bar อยู่ ให้ติ๊กถูก
4.ไปที่แถบเมนูเหมือนเดิม แต่รอบนี้ ก็จะเห็นแถบเมนูมี Develop เพิ่มขึ้นมา
5.ให้กดที่ Develop แล้วจะมีแถบเมนูต่างๆขึ้นมาให้เลือก เลือกที่ Enter Responsive Design Mode เพื่อใช้งาน
6.ก็จะเข้ามาหน้านี้จะมีขนาดหน้าจอต่างๆ ทั้ง iphone, ipad, macและยังมีหน้าจอของ google chrome,firefox ที่เป็นแบบ window และ mac ให้ลองใช้เพื่อดูหน้าตาของเว็บได้ อีกด้วย
ส่วนวิธีปิดโหมดนี้ก็ง่ายๆไปที่เมนู Develop เหมือนเดิม ในตรงที่เดิมที่เรากดเเพื่อเปิด responsive mode จะมี exite ให้เราออกจากโหมดนี้ด้วย
ตัวช่วยนี้ทำให้สะดวกโดยที่เราไม่ต้องปรับขนาดหน้าจอของตัวเอง แต่ก็สามารถดูการแสดงผลของหน้าขนาดจอต่างๆรวมไปถึงเบราเซอรืที่มีการใช้งานมากอย่าง Google Chrome Firefox edge ได้ง่ายอีกด้วย โดยที่ไม่ต้องดาวน์โหลดตัวเบราเซอร์เหล่านั้นมาติดตั้งเลย
อ้างอิง
How to Activate and Use Responsive Design Mode in Safari.[ออนไลน์].เข้าถึงได้จาก
https://www.lifewire.com/using-responsive-design-mode-in-safari-446569
How to use Responsive Design Mode in Safari .[ออนไลน์].เข้าถึงได้จาก
https://thesweetsetup.com/use-responsive-design-mode-safari/
เปิดใช้งานเมนู Develop Menu ใน Safari .[ออนไลน์].เข้าถึงได้จาก https://tha.applersg.com/enable-develop-menu-safari
