Responsive Web Design การออกแบบเว็บไซต์แนวใหม่ที่กำลังมาแรง

Responsive Web Design การออกแบบเว็บไซต์แนวใหม่ที่กำลังมาแรง



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


บอกแบบนี้อาจจะงงๆ กัน งั้นลองดูตัวอย่างกันก่อน

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

อย่างไรก็ตาม การออกแบบของ Responsive Web Design ก็มีข้อจำกัดอยู่บ้าง เช่น

1. เว็บไซต์จะต้องไม่เป็น Flash  อันที่จริงก็ไม่น่าจะมีปัญหาไหม เพราะสมัยนี้นิยมออกแบบเว็บไซต์แบบไม่ใช้  Flash เพราะนอกจากจะมีปัญหาเรื่องของการโหลดหน้าเว็บช้าแล้ว แล้วยังทำ SEO ยาก แถมปัจจุบันนี้อุปกรณ์ Tablet กับ Smart Phone ยอดนิยมอย่าง iPAD iPhone ก็ไม่รองรับการใช้งาน Flash

2. ข้อจำกัดของการออกแบี่ต้องวาง layout เป็นบล็อกๆ แต่ถ้าอยากทำให้เจ็งกว่านั้นก็คงต้องใช้พลังภายในของ web designer และ web programer มากหน่อย

3. โปรแกรมมิ่งก็ใช้ HTML5 / CSS3

4. ต้องมีการออกแบบที่ดีตั้งแต่แรก เพราะถ้าออกแบบผิดชีวิตก็พัง มันแก้ไขยุ่งยากมากกกก ดังนั้นจึงไม่เหมาะกับคนที่รับงานเว็บแล้วลูกค้ามีการแก้ไข layout บ่อยๆ

หลังจากทำเสร็จแล้วอย่าลืมทดสอบดูกับทุกอุปกรณ์ด้วยนะคะ เดี๋ยวเอาไปโชว์เขาแล้วไม่เป็นอย่างที่คิดไว้จะหน้าแตกกลับมาได้ 


       สรุปว่า การออกแบบเว็บไซต์ตามหลัก Responsive Web Design เป็นอีกเรื่องที่คนทำเว็บอย่างเราๆ ควรจะศึกษาไว้ และใช้กับงานเว็บไซต์ให้เหมาะสม ซึ่งในปัจจุบันเมืองนอกเขาก็จะมีเว็บไซต์ที่ออกแบบแนวนี้อยู่หลายเว็บ อันที่จริงพี่ไทยเราที่เก่งๆ ก็มีหลายเว็บนะที่ทำแบบนี้ รวมถึงพวก Theme ของ CMS อย่าง WordPress ก็มีให้เลือกซื้อเลือกโหลดกันเยอะ ลองศึกษากันดูนะคะ วันนี้ขอจบเพียงเท่านี้ก่อน เอาใจช่วยคนทำเว็บทุกคนค่ะ ใครมีคำแนะนำเพิ่มเติม แลกเปลี่ยนกันนะคะ



ที่มา:

โดย :
 1833
ผู้เข้าชม

บทความที่เกี่ยวข้อง

คุณรู้ไหมว่า Canonical Tag คืออะไร? จริงๆ แล้วมันเกี่ยวข้องกับ SEO หรือการปรับแต่งเว็บให้ติด Search Engine การใส่ Canonical tag เอาไว้ที่เว็บ เพื่อเป็นการลดและป้องกันการ เกิดข้อมูลซ้ำ (duplicate content) ของเว็บเรา
แน่นอนอย่างแรก ชื่อมันต่างกันครับ ทั้งสองบริการนี้คือมันคือ Social Network Service หรือบริการที่ทำให้เราสามารถเชื่อมโยง เพื่อนๆ พี่ๆ น้องๆ หรือคนรู้จักของเราได้ ผ่านทางอินเทอร์เน็ต แต่ก็มีหลายอย่างที่แตกต่างกัน
เทมเพลต คืออะไร? มาทำความรู้จักกัน Template คือ รูปแบบหรือแบบฟอร์มเว็บไซต์ที่ยังไม่มีการใส่เนื้อหาเข้าไป ผู้ใช้เพียงแค่ใส่ข้อมูลรายละเอียดเข้าไป แก้ไข Logo รูปภาพเพียงเล็กน้อยก็สามารถ...

Feature SoGoodWeb

เหมาะสำหรับลูกค้าที่เปิดธุรกิจทัวร์ - ทัวร์ท่องเที่ยว ทั้งที่เป็นเจ้าของเอง หรือเป็นรายย่อย เป็นระบบจองทัวร์ ที่ช่วยทำให้การจัดการธุรกิจทัวร์ - ทัวร์ท่องเที่ยว ให้เป็นเรื่องง่าย
Omise คือ ระบบรับชำระเงินออนไลน์ด้วยการชำระเงินผ่านบัตรเครดิต และบัตรเดบิตบนหน้าเว็บไซต์ เป็นตัวช่วยเพิ่มความสะดวกสบายในการชำระค่าบริการ ได้อย่างรวดเร็ว ปลอดภัยให้ทั้งร้านค้า และผู้ใช้บริการ
ระบบร้านค้าออนไลน์ SoGoodWeb รองรับการจัดส่ง Lalamove ส่งสินค้าให้ง่ายขึ้นด้วย Lalamove ผู้ให้บริการขนส่งสินค้า ที่สามารถจัดส่งสินค้าให้คุณได้ "ทุกอย่าง" ที่คุณต้องการ เหมาะกับทุกสินค้า ไม่ว่าจะเป็น เสื้อผ้า, ของใช้, อุปกรณ์จัดสวน เป็นต้น
สร้างเว็บไซต์สำเร็จรูปฟรี ร้านค้าออนไลน์