หน้าเว็บควรเข้ากันได้กับทุกอุปกรณ์ (Mobile, Tablet, Desktop) โดยไม่มีข้อบกพร่องด้านการออกแบบ เพื่อดึงดูดผู้ใช้มากขึ้น
Responsive Web Design (RWD) คือการสร้าง Design ที่เข้ากันได้กับทุกอุปกรณ์ด้วย HTML และ CSS
หลักการสำคัญ:
- Fluid Grid — ใช้หน่วยสัมพัทธ์ (%) แทนคงที่ (px)
- Flexible Images —
max-width: 100%; height: auto; - Media Queries — ปรับ Layout ตาม Breakpoint ของหน้าจอ
- Viewport Meta Tag — ควบคุมการแสดงผลบน Mobile
นี่คือมาตรฐานการทำเว็บสมัยใหม่