wiennat

CSS Zen Garden

CSS Zen Garden เป็นโปรเจคเก่ามากเปิดตัวมาตั้งแต่สมัยปี 2003 ตัวเว็บไซต์เองจะมี HTML อยู่หนึ่งหน้า แต่ผู้ใช้จะเลือกเปลี่ยน CSS เพื่อเปลี่ยนดีไซน์ของหน้านั้นได้โดยยังใช้ HTML เดิม ซึ่ง CSS พวกนี้ก็คือมาจากเว็บดีไซเนอร์ส่งเข้ามา

ในช่วงนั้น CSS ยังเป็นของที่ใหม่อยู่ ส่วนใหญ่ก็ใช้แค่ตกแต่งสีของลิงค์ แต่ระดับเลย์เอาท์นั้นมักใช้เป็น Table-based layout กันเป็นหลัก ถึงแม้ว่าแนวทางนี้จะเข้าใจได้ง่ายและบราวเซอร์ต่างๆ ก็รองรับเหมือนกันหมดอยู่แล้ว แต่ก็มีข้อเสียคือถ้าจะเปลี่ยนดีไซน์ของเว็บแม้เล็กน้อยก็อาจจะต้องทำใหม่ทั้งหมดเพราะโครงสร้างของตารางมันไม่ยืดหยุ่นพอ CSS Zen Garden ก็เลยเหมือนเป็นทั้งแหล่งโชว์ของว่า CSS ทำอะไรและเข้ามาช่วยได้ขนาดไหน และก็เป็นที่โชว์ของของเหล่าเว็บดีไซเนอร์ด้วยว่ามีฝีมือขนาดไหน เพราะอย่างที่รู้กันว่าบราวเซอร์ต่างๆ ก็รองรับและแสดงผล CSS ได้ต่างกัน ดังนั้นเว็บดีไซเนอร์เหล่านี้ก็เลยต้องงัดเทคนิคมากมายเพื่อให้มาสร้างเป็น CSS ที่แสดงผลได้ถูกต้องในทุกบราวเซอร์

วันก่อนใน Hacker news มี คนเอาลิงค์นี้ไปโพสต์ แล้วในช่อง discussion ก็เกิดประเด็นถกเถียงกันมากว่า HTML กับ CSS เนี่ยมันควรจะแยกกันมั้ย

คือถ้ามาจากสาย CSS Zen Garden มาก่อนก็คงจะให้ความรู้สึกว่า HTML มันแสดงโครงสร้างของเอกสาร เพราะฉะนั้นมันก็ไม่ควรจะต้องมายุ่งเกี่ยวเลยกับการแสดงผลหรือเลย์เอาท์ของหน้าสิ ดังนั้นการเอาคลาสของ CSS สำหรับระบุหน้าตาไปใส่ใน HTML นี่มันก็เหมือนกับการเอา presentation กับ data มาปนกันมั่วไปหมด ใครนึกไม่ออกลองนึกถึงพวก css framework อย่าง Bootstrap ที่จะมีคลาสสำหรับกำหนดกริด กำหนดเลย์เอาท์ สี ช่องไฟอยู่เยอะแยะมากมาย

อีกฝั่งก็ให้เหตุผลว่า html มันก็ถูกใช้สำหรับ presentation เสมอมา มันก็แยกกันไม่ออกแล้วแหละ บางคนก็บอกว่าถ้าทำแบบ pure css เลยจะทำให้ต่างคนต่างทำงานซ้ำซ้อนกันเพราะแต่ละคนก็จะไม่อยากไปแตะโค้ดของส่วนอื่นๆ ทีนี้จะยิ่งลำบากเข้าไปใหญ่ ซึ่งวิธีแก้มันก็คือจะต้องมากำหนด framework ตรงกลางซึ่งก็จะคือวิธีใช้คลาสระบุแบบใน css framework นี่แหละ

จริงๆ ก็คงเป็นเรื่องความชอบกับความเหมาะสมของแต่ละงานมากกว่า แต่เนื่องจากเริ่มรู้จัก CSS ก็จาก CSS Zen Garden ก็เลยชอบแนวทางของฝั่งนี้มากกว่า เพราะโค้ดของ html มันดูเป็นระเบียบเรียบร้อยสะอาดตาเข้าใจง่ายมากกว่าด้วย

แต่ทั้งหมดทั้งมวลถ้าให้สรุปเอง ก็คงจะได้ว่า HTML กับ CSS มันใช้ยากนั่นแหละ

Hacker News discussion: https://news.ycombinator.com/item?id=22627018