; Responsive Web Design : ตอนที่ 1 » การจัดการความรู้ ด้านการเผยแพร่ข้อมูลเว็บไซต์ มทร.ธัญบุรี

«

»

มิ.ย.
12

Responsive Web Design : ตอนที่ 1

Responsive Web Design คือ การออกแบบเว็บไซต์ ในส่วนของ Web layout ให้สามารถนำเสนอเนื้อหาหรือ Content ที่ตอบสนองการใช้งานบนอุปกรณ์ที่ต่างกันได้ รองรับขนาดหน้าจอของอุปกรณ์ทุกชนิด ไม่ว่าจะเป็นคอมพิวเตอร์ตั้งโต๊ะ Notebook Tablet โทรศัพท์มือถือ Smart Phone ต่างๆ เช่น iPhones, iPad, BlackBerry, Samsung, ฯลฯ ที่มีมาตรฐานขนาดหน้าจอที่แตกต่างกัน

Responsive Web Design เป็นการออกแบบเว็บไซต์ โดยใช้เทคนิคของ CSS , CSS3 และ JavaScript เพื่อให้เว็บไซต์สามารถจัดลำดับ เรียงข้อมูลบนเว็บไซต์ให้รองรับการแสดงผลผ่านหน้าจอที่มีขนาดแตกต่างกันได้โดยอัตโนมัติ  โดยผู้ใช้งานเว็บไซต์สามารถเปิดใช้งานเว็บไซต์ได้ โดยไม่ต้องคำนึงถึงขนาดของหน้าจอหรือชนิดของอุปกรณ์สื่อสาร

 ตัวอย่างเว็บไซต์ที่นำเอาคอนเซปต์ Responsive Web Design มาใช้

ที่มาจาก  http://foodsense.is

ประโยชน์ของการทำเว็บไซต์  Responsive Web Design 

  1. Responsive WebDesign ได้รับการรับรองจาก google ช่วยให้ติด index google ได้ทั้ง desktop และ mobile ในหน้าเดียว
  2. การทำ Responsive เพียงแค่ไซต์เดียวก็รองรับทุกอุปกรณ์ และไม่ต้องทำหลายๆหน้า ช่วยให้ไม่หนักเซิฟเวอร์
  3. ประหยัดค่าใช้จ่ายในการจัดทำ โดยที่เราไม่ต้องทำหน้าต่างแยกกันระหว่าง mobile และ desktop
    นอกจากนี้ยังประหยัดเวลาลดระยะเวลาในการทำงานหลายๆหน้า โดยที่เราก็วางแผนครั้งเดียว และทำเพียงแค่หน้าเดียวเท่านั้นเอง
  4. รวดเร็วในการดูแล จัดการเว็บไซต์ ไม่ยุ่งยาก และไม่ต้องไปเปลี่ยนแปลงเว็บไซต์หลายๆหน้า
  5. รองรับผู้ใช้ทุกอุปกรณ์ เพราะสุดท้ายผู้คนจากหลายอุปกรณ์ก็มีความต้องการเดียวกัน
  6. เว็บไซต์ไม่ต้อง redirect หน้าไปหาหน้า mobile ให้เสียเวลา ช่วยให้เซิฟเวอร์ไม่ทำงานหนักและไม่วุ่นวาย
  7. Googlebot-Mobile จะสนใจกับไซต์ที่รองรับอุปกรณ์ประเภท mobile ดังนั้นมั่นใจได้เลยว่า Googlebot-mobile
    จะเข้ามาเก็บข้อมูลในเว็บไซต์ที่ทำออกมารองรับ mobile ของคุณอย่างแน่นอน หลังจากนี้เราก็มาเริ่มทำ seo ผ่าน mobile กันต่อไป
  8. ช่วยทำให้การค้นหาผ่าน mobile เป็นไปได้ง่ายมากยิ่งขึ้น

แหล่งข้อมูลอ้างอิง