โค้ดที่สวยงามเป็นรากฐานของเว็บไซต์ที่สวยงาม CSS ที่ยอดเยี่ยมนั้นมีอยู่นอกเหนือจากโค้ด HTML ที่ยอดเยี่ยมและมีความหมายไม่แพ้กันเท่านั้นที่ทำให้เว็บไซต์แข็งแกร่งยิ่งขึ้น บทความนี้จะอธิบายกฎหมาย 12 ข้อในการบรรลุโค้ดการออกแบบเว็บไซต์ที่สะอาดตา ซึ่งเหมาะสำหรับทุกคนที่มีส่วนร่วมในการออกแบบเว็บไซต์
1. DOCTYPE ที่เข้มงวด
ถ้าจะทำก็ทำให้ถูกต้อง ไม่ว่าจะเป็น HTML 4.01 หรือ XHTML 1.0 ทั้งหมดนี้มีโหมดเข้มงวด การใช้โหมดเข้มงวดช่วยให้มั่นใจได้ว่าโค้ดของเราจะไม่ซ่อนข้อผิดพลาดใดๆ
2. การประกาศชุดอักขระ อักขระพิเศษจะถูกเข้ารหัสและประมวลผล
การประกาศชุดอักขระควรวางไว้ที่ด้านหน้าของส่วน hea> เพื่อให้เบราว์เซอร์รู้วิธีแสดงเนื้อหาทั้งหมดในหน้าเว็บ รวมถึงชื่อเรื่องด้วย นอกจากนี้ อักขระพิเศษบางตัว เช่น & จะถูกแทนที่ด้วย & ซึ่งเป็นวิธีที่ปลอดภัยที่สุด
3. การล็อคและ
การเยื้องที่เหมาะสมจะไม่ส่งผลต่อการแสดงผลหน้าเว็บ แต่จะช่วยปรับปรุงประสบการณ์การอ่านซอร์สโค้ดได้อย่างมาก ไม่มีกฎเกณฑ์เฉพาะสำหรับการเยื้อง แต่แนวทางปฏิบัติที่ดีคือต้องสม่ำเสมอตลอด
4. ใส่ CSS และ JavaScript ลง
ใน
ไฟล์ภายนอก การใส่ CSS และ JavaScript ลงในไฟล์ภายนอกเพื่อใช้อ้างอิงไม่เพียงแต่ลดขนาดของหน้าเว็บเดียวเท่านั้น แต่ยังหมายความว่าหน้าเว็บอื่นๆ สามารถแชร์โค้ดเหล่านี้ได้อีกด้วย นอกจากนี้ กลไกการแคชของเบราว์เซอร์ยังสามารถทำได้อีกด้วย จะดีกว่าลดการดาวน์โหลดรหัสเดียวกันซ้ำ ๆ
5. ซ้อนแท็กแท็กอย่างถูกต้อง
ตามที่แสดงด้านล่าง ในบรรทัดแรกของโค้ด แท็ก h1> จะซ้อนอยู่ในแท็ก a> แม้ว่าเบราว์เซอร์ส่วนใหญ่จะแสดงผลอย่างถูกต้อง แต่นี่ไม่ใช่นิสัยที่ดี แต่วัตถุอินไลน์ วัตถุอินไลน์ไม่ควรมีวัตถุบล็อก
6. กำจัด div ที่ไม่จำเป็น
Div มักถูกใช้ในทางที่ผิด (โดยเฉพาะอย่างยิ่งในตำนาน DIV+CSS ที่เราอยู่ตอนนี้ - นักแปล) ผู้คนต้องการใส่ทุกอย่างลงใน div เพื่อให้พวกเขาสามารถกำหนดสไตล์ CSS ให้กับพวกเขาได้ ในอาการบวม
7. ใช้กฎการตั้งชื่อที่ดีกว่า
ดังที่แสดงด้านล่าง คลาส CSS ของ Cat มีชื่อว่า red italic ซึ่งหมายความว่า Cat ใช้ตัวเอียงสีแดง จะเป็นอย่างไร
8. ลองใช้ CSS เพื่อควบคุมการจัดรูปแบบของข้อความ
ดังรูปด้านล่าง อย่าใช้อักษรตัวพิมพ์ใหญ่โดยตรง
9. กำหนดคลาส/id อิสระให้กับเนื้อหา กำหนด
คลาส/id อิสระให้กับแท็ก body ซึ่งสามารถค้นหาวัตถุใดๆ ในเพจได้อย่างง่ายดาย เนื่องจากวัตถุทั้งหมดในเพจอยู่ในเนื้อหา
10. การยืนยัน
คุณควรตรวจสอบโค้ดของหน้าเว็บให้มากที่สุด แม้ว่าข้อผิดพลาดของโค้ดบางอย่างจะสามารถแก้ไขได้โดยอัตโนมัติโดยเบราว์เซอร์ แต่ข้อผิดพลาดบางอย่างอาจส่งผลเสีย โดยเฉพาะอย่างยิ่งเมื่อคุณอยู่ในโหมดเข้มงวด แม้ว่าคุณจะไม่ได้ทำอะไรเลย แต่อย่างน้อยการได้เห็นเครื่องหมายยืนยัน W3C สีเขียวก็ทำให้คุณรู้สึกดีขึ้นได้
ไม่จำเป็นต้องเข้มงวดในการผ่านการตรวจสอบ W3C มีข้อควรพิจารณาเพิ่มเติมในการออกแบบเว็บไซต์ การยึดถือผลการตรวจสอบ W3C เท่านั้นที่อาจส่งผลต่อปัจจัยที่สำคัญบางประการ เช่น IE6 มีข้อบกพร่องมากมายในมาตรฐาน W3C 100 %การประกาศผ่านการยืนยันของ W3C ว่าเว็บไซต์ของตนไม่รองรับ IE6 อย่างน้อยในประเทศจีน จะสูญเสียมากกว่ากำไร - นักแปล
11. ลำดับโครงสร้างที่สมเหตุสมผล
รักษาโครงสร้างหน้าเว็บตามลำดับตรรกะ
12. ทำดีที่สุดเท่าที่จะทำได้
หากคุณเขียนตั้งแต่ต้น แน่นอนว่าการรักษาหลักการข้างต้นจะง่ายกว่ามาก หากคุณต้องแก้ไขโค้ดเก่า การเขียนโค้ดที่ไม่ดีของระบบ CMS บางอย่างจะทำให้คุณลำบากใจ หรือของคุณ มีหลายสิ่งที่ต้องเปลี่ยนแปลงบนเว็บไซต์ขนาดใหญ่ ไม่ว่าจะเป็นอะไรก็ตาม การรักษานิสัยที่ดีอยู่เสมอเป็นสิ่งสำคัญมาก