ถามกันบ้อยบ่อย

วันนี้ก็มาลองวิชาการกันมั้งนะ หลังจากที่ออกแนวสนุกสนาน (มีสาระบ้าง ไม่มีสาระบ้างมานาน)

มีอยู่คำถามนึงที่โดนถามบ่อยๆจากเพื่อนๆทั้งหลาย เมื่อเค้าต้องการที่จะออกแบบเว็บไซต์ นั้นก็คือ “แก…จะทำเว็บวะ เอาหน้าจอเท่าไหร่ดีวะ…” แล้วเราก็จะขำทุกทีที่ได้ยิน เพราะไม่คิดว่าเพื่อนๆของเราจะคิดถึงเรื่อง layout เป็นอย่างแรกเมื่อคิดจะทำเว็บ ก็ถ้าลองถามกลับไปว่าเนื้อหาจะแสดงอะไรมั้ง เพื่อนที่รักทั้งหลายก็จะบอกว่าเอาไว้ก่อนเดี๋ยวดูหน้าจอให้เสร็จก่อนค่อยคิด แล้วหลังจากนั้นเราก็เลยต้องพร่ำเรื่องลักษณะของ layout ของเว็บที่นิยมใช้ในการออกแบบทุกครั้งว่า…

layout ที่นิยมในการออกแบบเว็บไซต์นั้นมันแบ่งออกได้เป็น 3 แบบ คือ แบบพวกแข็งเป๊ก แบบพวกนุ่มนิ่ม และแบบพวกไหลลื่น มาดูแบบแรกก่อนเลย
1. แบบแข็งเป๊ก ภาษาฝรั่งเค้าว่า Ice Layout คือว่า layout แบบนี้มันก็แข็งสมชื่อ คือมันจะมีการ กำหนดความกว้างของหน้าจอไว้แบบตายตัวเลย เช่น กำหนดว่ากว้าง 500px เป็นต้น และลักษณะอีกอย่างหนึ่งก็คือมันจะอยู่ชิดซ้ายเสมอ(หรืออาจจะอยู่ชิดขวาก็ได้) เช่นเว็บไซต์นี้เลย http://www.focusun.com/zweb/indexs.html ลองเข้าไปดูแล้วเราจะพบว่า ไม่ว่าเราจะย่อ หรือขยาย browser ขนาดของ layout ก็จะคงขนาดเดิม และอยู่ชิดซ้ายเสมอ

2.แบบนุ่มนิ้ม ฝรั่งเค้าเรียกว่า Jelly Layout ส่วนแบบน้องนุ่มนิ้มเนี้ย ลักษณะมันก็ คือๆ เอ๋ย…เหมือนๆ(ภาษาบ้านเกิดแพลมออกมาเหอๆๆ) กับพวกแข็งเป๊กนั้นแหละ คือกำหนดความกว้างไว้ตายตัวเลย แต่ว่าจะต่างกันก็คือว่าแทนที่ Layout จะอยู่ชิดซ้าย มันก็จะอยู่กลึ่งกลางหน้าจอเสมอ เช่น http://search.neopetsfanatic.com/ เห็นไหมครับ ย่อ หรือขยาย browser ขนาดของ layout ก็จะคงขนาดเดิมแต่จะอยู่กลางหน้าจอเสมอ ส่วนแบบสุดท้าย

3. แบบไหลลื่น แบบนี้ฝรั่งเค้าเรียกว่า Liquid Layout แบบนี้Layout จะย่อยขยายตามหน้า browser ของเราเลย คือเวลาเราย่อ browser ไอ้เจ้า Layout ก็จะย่อตามมา แต่เมื่อเราขยาย มันก็จะขยายตาม อย่างนี้นี้เองที่เราเรียกว่า ไหลลื่น หรือว่าไหลเหมือนน้ำนั้นเองครับ เพราะว่าน้ำพเข้าไปอยู่ในภายชนะรูปร่างกลม น้ำก็จะกลม เข้าไปอยู่ในภายชนะรูปดาว น้ำมันก็จะกลายเป็นดาว อะไรประมาณนั้นครับ อ๋อลืมยกตัวอย่าง เช่น เว็บ http://www.w3.org/WAI/

จากLayout ทั้ง 3รูปแบบนั้น เห็นฝรั่งเค้าเทอดทูล ไอ้Layoutแบบที่ 3 หรือ แบบไหลลื่นมากที่สุดนะ เพราะว่าปัจจุบันเป็นยุคของเว็บ 2.0 เค้าเลยเน้นก็ที่เรื่องของ accessibility คือใครๆ อยู่ในสิ่งแวดล้อมใดๆ ก็สามารถเข้าใช้งานเว็บไซต์นั้นได้ ยกตัวอย่างเช่น user ที่ใช้จอที่มี Screen Resolution เป็น 800×600 กับ user ที่ใช้จอที่มีScreen Resolution เป็น 1024×576 เข้าไปดูเว็บไซต์ที่มี layout แบบ แข็งเป๊ก ที่กำหนดความกว้างไว้ 900 px ปัญหาจะเกิดขึ้นกับ user ที่ใช้จอที่มี Screen Resolution เป็น 800×600 ทันที นั้นคือเค้าจะไม่เห็น layout ทั้งหมดในหน้าจอของเค้าได้ โดยเค้าต้องเลื่อนดูจึงจะเห็น layout ทั้งหมด แต่ถ้าใช้การออกแบบ layout แบบไหลลื่นปัญหานี้ก็จะหมดไป น่าจะเข้าใจกันเนอะ
หลังจากพร่ำเรื่องรูปแบบของ layout เสร็จเราก็จะได้คำถามใหม่มาทันที่เลยว่า “แล้วข้าจะใช้แบบไหนดีละ” เห่อ พอเจอคำถามนี้เราก็จะต้องพร่ำต่อยืดยาวอีกที่ในเรื่องของการเลือก Layout ให้เหมาะกับรูปแบบของการแสดงเนื้อหาของเพื่อนที่รัก ซึ่งเราก็ต้องพูดเลี่ยงๆไปประมาณว่า มันก็อยู่ที่ว่าแบบไหนจะเหมาะกับเนื้อหาของเพื่อนแล้วก็ให้คุณๆเพื่อนทั้งหลายไปเลือกเอาเองว่าจะเอาแบบไหนไปใช้ ….
แต่พอเช้ามาอีกวันเราก็จะเจอคำถามเรื่องเดิมๆจากคนเดิมๆอีกว่า “แล้วจะเอาให้มันกว้าง 800px มันจะกว้างไปหรือป่าววะ…..” แล้วเราก็จะตอบกลับไปว่า (-_-#)….เหอๆๆ จบ

ถ้าเนื้อหาตรงไหนผิดๆถูกก็ช่วยแนะนำกันด้วยนะครับ….. ⊂( ﾟ ヮﾟ)⊃