ทำไมถึงควรแยกงานการวางเลย์เอาท์ออกจากโปรแกรมมิ่ง (2)

ดองเรื่องนี้มาซะนาน ..ต่อจากตอนที่แล้ว ที่ผมว่าถ้าจับงานวางเลย์เอาท์กับการโปรแกรมมิ่งแล้วโยนให้คนนึงทำผมว่ามันไม่สวยแน่ๆ เพราะงานแต่ละอย่างมีรายละเอียดลึกๆ ของแต่ละงานที่แตกต่างกัน

พูดกันต่อถึงเนื้อๆ เลยแล้วกันครับว่ารายละเอียดลึกๆของงานเว็บเลย์เอาท์ที่ว่า คืออะไร ซึ่งจะบอกว่า แค่ขั้นตอนการทำเว็บเลย์เอาท์ก็มีรายละเอียด ความรับผิดชอบที่เยอะมากแล้วครับ ได้แก่

ทำเว็บให้ถูกต้องตามแบบที่เว็บดีไซเนอร์ออกแบบไว้

ถ้าเรียงตามลำดับความสำคัญแล้ว อันนี้น่าจะสำคัญสุดๆ ครับ ถ้าออกมาแล้วไม่ตรงกับแบบคงไม่เป็นปรารถนาแน่ๆ ทั้งกับลูกค้า หัวหน้าโปรเจค หรือเว็บดีไซเนอร์ เหมือนสั่งผัดกระเพราแล้วได้หมูกระเทียมจริงมั๊ยครับ

ทำให้ถูกต้องก็มีเรื่องของ การควบคุมองค์ประกอบบนหน้าเว็บได้แก่

  • ขนาดกว้าง-ยาว (ขอแทรกภาษาอังกฤษหน่อย; Width-Height)
  • ระยะ (Padding-Margin)
  • เส้น-ขอบ-กรอบ (Border)
  • ตัวอักษร: ขนาด สี ลักษณะ (Font: size, color, weight, caps, … )
  • พื้นหลัง (Background)

เท่าที่คิดออกก็ประมาณนี้แหละครับ นี่ยังไม่รวมถึงเทคนิคการนำมาใช้ เช่น การวางพื้นหลัง การเลือกฟอร์แมตภาพที่เหมาะสม

ทำให้เว็บดูได้ในหลายๆ สภาพแวดล้อม ทั้งเบราเซอร์  ความละเอียดหน้าจอ อุปกรณ์

เราไปผูกขาดกับคนใช้งานไม่ได้ครับว่าเค้าจะดูเว็บเราด้วยอะไร ดังนั้นการทำเว็บให้ดูได้ในหลายๆ เบราเซอร์ จึงเป็นเรื่องที่มองข้ามไม่ได้ครับ

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

ทำให้โค้ด HTML เป็นระเบียบร้อย ไม่ซับซ้อน เข้าใจได้ง่าย พัฒนาต่อได้ไม่ยาก รวมถึงการเว้นวรรค จัดย่อหน้า ใส่คอมเมนท์แต่พองาม ไม่ฟุ่ยเฟือยยัดเยียดโค้ด

เนื่องจากเว็บมันไม่จบกระบวนการที่การวางเลย์เอาท์ และจะต้องส่งไปให้โปรแกรมเมอร์ทำงานต่อ ก็ควรจะให้เค้าทำงานได้ได้สะดวก ลงมือทำได้เลย ไม่ใช่ไปนั่งแกะโค้ดรกๆ ว่าตรงนี้มันเอาไว้ทำอะไรวะ!? งานโปรแกรมมิ่งหลักๆคือการแสดงข้อมูลบนเว็บ ดังนั้น HTML ต้องเป็นระเบียบร้อย ไม่ซับซ้อน เข้าใจได้ง่าย พัฒนาต่อได้ไม่ยาก

อีกจุดหนึ่งที่อยากพูดคือ หลายครั้งที่ไม่สามารถแก้ปัญหาในการจัดวางได้ หลายๆคนเลือกวิธีมักง่ายด้วยการ เพิ่ม-แก้ไข HTML โดยการยัดเยียดแท็ก <div> และ class เข้าไป สะดวกสบายแต่ความเป็นจริงแล้วอาจจะไม่จำเป็นต้องทำอย่างนั้นเลย ถ้าปรับ CSS ใหม่ให้ดีๆ ซึ่งจะช่วยลดความซ้ำซ้อนลงไปได้มากครับ

คำนึงถึงปัจจัยอย่างอื่นที่เกี่ยวข้องเวลาใช้งาน

เพราะเว็บไม่ได้จบอยู่แค่ในมุมมองของการพัฒนา แต่ไปยังอินเตอร์เน็ต ดังนั้นต้องคิดถึงปัจจัยอย่างอื่นๆ ด้วยครับ เช่น

  • โค้ดที่เขียน ทำให้ขนาดไฟล์ใหญ่เกินจำเป็นมั๊ย ลดลงเพื่อช่วยเพิ่มความเร็วในการโหลดเพจได้รึเปล่า
  • โครงสร้างของเว็บดีมั๊ย มีรูปแบบโครงสร้างที่สื่อความหมาย (ซีแมนติก: Sematic) รึเปล่า ช่วยให้ผู้ใช้งานที่มีความบกพร่องทางร่างกายใช้งานได้มั๊ย (Accessibility)
  • จากข้อที่แล้ว จากโครงสร้างของเว็บ มันเอื้ออำนวยต่อเซิร์ซเอ็นจิ้น (Search Engine) มั๊ย ต้องมาทำ SEO (Search Engine Optimization) อีกรึเปล่า

ประมาณนี้ครับ ..แต่ออกตัวไว้ก่อนนะครับ ว่าผมก็ทำได้ไม่ครบหรอกครับ แต่ก็พยายามให้ได้มากที่สุด

รวมๆ แล้วตอนนี้ก็คิดออกประมาณนี้ครับ ไว้คิดออกอาจจะเขียนเพิ่มเป็นตอนใหม่ (เวลาจะเอา Job Description ลอกหัวข้อพวกนี้ไปก็ดีเนอะ)

สิ่งสำคัญในการที่จะทำงานให้ออกมาดีได้ต้องพยายามสั่งสมประการณ์เยอะๆครับ อย่าคิดว่าทำเป็นแล้ว ถูกแล้ว พอใจอะไรง่ายๆ ควรไปเปิดหู เปิดตาดูงานใหม่ๆ บ้างโดยเฉพาะในต่างประเทศครับ เทคโนโลยีมันพัฒนาไปเร็วมาก เผลอๆทำแบบเดิมๆ อยู่ ปีเดียวก็อาจล้าสมัยไปแล้ว

One thought on “ทำไมถึงควรแยกงานการวางเลย์เอาท์ออกจากโปรแกรมมิ่ง (2)”

  1. ใช่พี่ มันไม่คำนวนสเกลเหมือนเวบบราวเซอร์ ทำเสดต้องมานั่งแฮก ipad ทุกรอบ น้องๆ ie6เลยอะ

Comments are closed.