Responsive Web Design คือ การออกแบบเพื่อให้เว็บไซต์สามารถแสดงผลได้เหมาะกับการใช้งาน smart phone หรือ หน้าจอคอมพิวเตอร์ทั่วไป (Desktop) โดยปกติแล้วเว็บไซต์ที่ไม่ได้ออกแบบมารองรับ Responsive Design เวลาที่ดูใน smart phone เราจะเห็นเว็บไซต์เป็นหน้าตาเต็มๆ หน้าและเห็นตัวอักษรแสดงเป็นตัวเล็กๆ ทำให้อ่านยาก เวลาที่เราต้องการอ่านจะต้องซูมเข้าไปเพื่ออ่านข้อความ
Responsive Web Design ถูกออกแบบมาเพื่อแก้ปัญหาการดูเว็บไซต์บน smart phone เพื่อให้ผู้ใช้สามารถอ่านข้อมูลได้ง่ายขึ้น
Responsive Web Design ทำงานอย่างไร?
RWD เกิดจากการเขียน CSS โดยตัว CSS จะทำการตรวจดูว่าขนาดหน้าจอแสดงผลมีความกว้างเท่าไหร่แล้วจัดการแสดงผมให้พอดีกับหน้าจอที่เปิดดู โดยทั่วไปจะมีมาตรฐานการตั้งขนาดไว้ 3 ขนาด คือ Desktop กว้างประมาณ 1000px ขึ้นไป Tablet มากกว่า 768px Mobile น้อยกว่า 768px
ขนาดความกว้างของ RWD ไม่ได้บังคับว่าต้องมีขนาดเท่าไหร่เป็นมาตรฐานขึ้นอยู่กับผู้พัฒนาแต่ละเว็บว่าต้องการเน้นการออกแบบไปที่อุปกรณ์ตัวไหนเป็นหลักมากกว่า
ตัวอย่าง Responsive Web Design