Grid System (ระบบกริด) คืออะไร?
Grid System คืออะไร ?
Grid System หรือ ระบบกริด คือ ระบบการจัดองค์ประกอบของหน้าเว็บไซต์หรือแอพลิเคชัน (Layout) เพื่อให้เกิดความสมดุลและความต่อเนื่องของเนื้อหาในแต่ละส่วนของเว็บไซต์หรือแอพลิเคชันนั้น ๆ
ก่อนอื่น เราจะต้องรู้จักว่า Grid คืออะไร? : Grid (กริด) คือ หลักการออกแบบอย่างหนึ่ง ถูกนำมาใช้จัดองค์ประกอบต่าง ๆ ในงานศิลปะมากมาย รวมทั้งงานออกแบบด้วย
องค์ประกอบของ Grid
Grid มีองค์ประกอบหลัก ๆ ที่สำคัญ ดังนี้
- Margins (ระยะขอบ) เป็นพื้นที่ว่าง ระหว่าง Columns กับ Rows หรือ Artwork กับส่วนประกอบต่าง ๆ ในหน้าเว็บไซต์หรือแอพลิเคชัน
- Columns (แถวแนวตั้ง)
- Rows (แถวแนวนอน)
- Modules คือ ช่องจากการแบ่งเส้นของ Columns และ Rows
- Alley หรือ Gutter คือ พื้นที่ว่าง ที่แยกระหว่าง Columns และ Rows
รูปแบบของ Grid
รูปแบบของ Grid ที่นิยมนำมาใช้ในการออกแบบเพื่อจัดองค์ประกอบในแต่ละส่วนของเว็บไซต์หรือแอพลิเคชัน มี 4 ประเภท ดังนี้
1. Manuscript Grid
เป็น Grid แบบคอลัมน์เดียว เป็น Layout ที่นิยมใช้ในพวกสื่อสิ่งพิมพ์
2. Column Grid
เป็น Grid แบบหลายคอลัมน์ในแนวตั้ง นิยมใช้เพื่อออกแบบหน้า Layout สำหรับบทความที่มีเนื้อหาหรือข้อมูลที่ไม่ค่อยต่อเนื่องกัน หรือใช้เพื่อแบ่งเนื้อหา/ข้อมูลเป็นสัดส่วน มีความยืดหยุ่นในการจัดองค์ประกอบ
3. Modules Grid
เป็น Grid แบบผสมระหว่างคอลัมน์หลาย ๆ คอลัมน์ในแนวตั้ง และแถวในแนวนอนหลาย ๆ แถว นิยมใช้ในการออกแบบ Layout เว็บไซต์หรือแอพลิเคชันสำหรับโทรศัพท์มือถือ
4.Hierarchical Grid
เป็น Grid ที่นิยมใช้มากที่สุดในการจัด Layout หน้าเว็บไซต์หรือแอพลิเคชัน เพราะเป็นรูปแบบที่ทำให้ Layout ของเราสมบูรณ์มากที่สุด เพราะใช้องค์ประกอบของ Grid ครบทุกองค์ประกอบ และทำให้เกิดความสวยงามและเป็นระเบียบนั่นเอง
ความสำคัญของ Grid System
- ทำให้การออกแบบ Layout มีความต่อเนื่องและทุกคนสามารถเข้าใจแผนงานร่วมกันได้ดีขึ้น
- ทำให้เนื้อหาในเว็บไซต์หรือแอพลิเคชันมีความเป็นระเบียบ ต่อเนื่อง และสวยงาม อ่านง่าย ใช้งานง่าย
- ช่วยลำดับความสำคัญของแต่ละส่วนในหน้าเว็บไซต์หรือแอพลิเคชันได้
