เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ · HTML บรรณาธิการ WYSIWYG
ต้นทุนที่ซ่อนอยู่ของมาร์กอัปที่ยุ่งเหยิง: การเข้าถึง น้ำหนักหน้า และการออกแบบใหม่
· เหตุใดจึงสำคัญ
html การเข้าถึง การล้างข้อความ
การโต้แย้งว่าช่วงที่ซ้อนกัน แบบอักษรอินไลน์ และย่อหน้าว่างนั้นไม่ใช่เรื่องสวยงาม แต่เป็นการทำลายเทคโนโลยีช่วยเหลือ ขยายหน้า และทำให้การออกแบบใหม่ทุกครั้งยากขึ้น
การออกแบบใหม่ที่ล้มเหลวในบทความเก่า - เปิดขึ้นด้วยสไตล์ชีตใหม่ที่ไม่สามารถแทนที่สไตล์อินไลน์นับพันได้
การออกแบบใหม่สามารถเปลี่ยนกฎส่วนหัวที่ได้รับอนุมัติทุกรายการ และยังคงทำให้บทความเก่าไม่สอดคล้องกันทางสายตา เมื่อบทความเหล่านั้นมีสไตล์ท้องถิ่นและ Wrapper แบบชั่วคราว Global CSS ไม่สามารถควบคุมการนำเสนอที่ฝังอยู่ในเนื้อหาได้อย่างง่ายดาย ToolAcre ลบแอตทริบิวต์สไตล์และคลาสออก โดยเผยให้เห็นว่าส่วนย่อยนั้นขึ้นอยู่กับส่วนเหล่านั้นมากน้อยเพียงใด
การเปลี่ยนแปลงทางสายตาที่เกิดขึ้นนั้นถือเป็นหลักฐาน ไม่ใช่แผนการโยกย้ายโดยอัตโนมัติ คลาสที่ถูกลบออกอาจให้ความหมายที่จำเป็นผ่านส่วนประกอบของแอปพลิเคชัน ในขณะที่การประกาศแบบอักษรแบบอินไลน์อาจเป็นการตกแต่งแบบใช้แล้วทิ้ง ตรวจสอบต้นทางและปลายทางร่วมกันก่อนที่จะใช้การล้างข้อมูลกับไฟล์เก็บถาวร
จริงๆ แล้ว 'ยุ่ง' หมายถึงอะไร — ให้นิยามอย่างเป็นรูปธรรม: การห่อหุ้มที่ซ้ำซ้อน การนำเสนอแบบอินไลน์ แท็กที่ไม่มีความหมาย และการแฮ็กการเว้นวรรค
มาร์กอัปที่ยุ่งเหยิงเป็นรูปธรรม: ช่วงที่ซ้อนกันโดยไม่มีงานเชิงความหมาย, Wrapper Div ที่ใช้สำหรับระยะห่างเท่านั้น, แท็ก b และ i แบบเดิม, รูปแบบอินไลน์, ย่อหน้าว่าง, คุณลักษณะของเหตุการณ์ และส่วนการนำเสนอที่ซ้ำกัน การนับไบต์เพียงอย่างเดียวไม่ใช่คำจำกัดความ โครงสร้างที่ไม่จำเป็นหรือทำให้เข้าใจผิดคือปัญหาการบำรุงรักษา
ToolAcre คลายคอนเทนเนอร์ธรรมดาที่ไม่รองรับ แมปแท็กอินไลน์แบบเดิมหลายแท็กให้เทียบเท่าความหมาย ลบแอตทริบิวต์ที่อยู่นอกรายการต่อองค์ประกอบ และสร้างสมดุลการซ้อนที่ยอมรับ ตรวจไม่พบองค์ประกอบที่ได้รับอนุญาตทุกรายการ องค์ประกอบที่แข็งแกร่งสององค์ประกอบที่ซ้อนกันสามารถคงอยู่ได้เนื่องจากทั้งสองเป็นสมาชิกที่ถูกต้องของคำศัพท์แคบ
การเข้าถึง: สิ่งที่โปรแกรมอ่านหน้าจอได้ยิน — อธิบายว่าโครงสร้างที่ขาดหายไปและส่วนหัวปลอมส่งผลต่อการนำทางอย่างไร
ความสามารถในการเข้าถึงเริ่มต้นด้วยโครงสร้างจริงที่ตัวแทนผู้ใช้และเครื่องมือช่วยเหลือสามารถเปิดเผยได้ ย่อหน้าตัวหนายังคงเป็นย่อหน้า ในขณะที่องค์ประกอบส่วนหัวจะเข้าสู่โครงสร้างส่วนหัวของเอกสาร ลำดับของขีดกลางที่พิมพ์คือข้อความ ul และ li จัดเตรียมความสัมพันธ์ของรายการที่เครื่องสามารถอ่านได้
อย่ากล่าวเกินจริงถึงการประกาศที่ชัดเจน เทคโนโลยีช่วยเหลือและการตั้งค่าผู้ใช้จะแตกต่างกันไป และที่เก็บนี้ไม่มีเมทริกซ์ทดสอบตัวอ่านข้าม คำแนะนำที่สามารถป้องกันได้คือการเข้ารหัสความหมายด้วยองค์ประกอบที่เหมาะสม รักษาลำดับส่วนหัวที่เป็นตรรกะ และทดสอบผลลัพธ์ของตัวแทนโดยใช้เครื่องมือช่วยสำหรับการเข้าถึงจริงที่ผู้ชมของคุณพึ่งพา
น้ำหนักหน้าและการแสดงผล — อธิบายว่ามาร์กอัปที่ขยายเพิ่มไบต์และทำให้เลย์เอาต์ซับซ้อนขึ้นได้อย่างไร
มาร์กอัปพิเศษจะเพิ่มอักขระที่ส่งและแยกวิเคราะห์ แต่บทความนี้ไม่มีเกณฑ์ประสิทธิภาพหรือการปรับการแสดงผลสากล ค่าใช้จ่ายเร่งด่วนที่มากขึ้นคือความซับซ้อน: ตัวเลือกการดีบักและการย้ายข้อมูลจะยากขึ้นเมื่อบทความที่เทียบเท่าแสดงแนวคิดเดียวกันผ่าน wrappers ที่ไม่เกี่ยวข้องและการประกาศในท้องถิ่น
ToolAcre นับ HTML อักขระที่ผ่านการฆ่าเชื้อแล้ว ซึ่งสามารถเปิดเผยการลดลงหลังจากการกรอง แต่ตัวนับนั้นไม่ใช่เกณฑ์มาตรฐานประสิทธิภาพ ความเร็วหน้าขึ้นอยู่กับเอกสาร สไตล์ สคริปต์ สื่อ แคช และอุปกรณ์ ถือว่าแหล่งที่มาขนาดเล็กเป็นสัญญาณการบำรุงรักษา จากนั้นวัดหน้าเว็บจริงก่อนทำการอ้างสิทธิ์ประสิทธิภาพ
การออกแบบใหม่และการย้ายข้อมูล — อธิบายว่าทำไมสไตล์อินไลน์และมาร์กอัปแบบครั้งเดียวจึงต่อต้านการเปลี่ยนแปลงระดับโลก
การออกแบบสไตล์ชีทใหม่จะทำงานได้ดีที่สุดเมื่อเนื้อหาที่ทำซ้ำใช้ความหมายที่เสถียรและการนำเสนอแบบรวมศูนย์ รูปแบบอินไลน์ต้านทานการเปลี่ยนแปลงสี ระยะห่าง และตัวพิมพ์โดยรวม ชื่อคลาสที่ไม่รู้จักสามารถผูกเนื้อหาเข้ากับธีมที่เลิกใช้แล้วได้ บล็อกว่างและตัวแบ่งด้วยตนเองจะรักษาสมมติฐานเค้าโครงเก่าไว้นานหลังจากการเปลี่ยนแปลงเทมเพลตโดยรอบ
การโยกย้ายจึงควรแยกความหมายออกจากการนำเสนอ รักษาระดับหัวเรื่อง ย่อหน้า รายการ ใบเสนอราคา รหัส และลิงก์ที่ต้องการ ย้ายลักษณะที่ปรากฏที่ได้รับอนุมัติไปเป็นรูปแบบปลายทาง ตัวแก้ไขช่วยตรวจสอบส่วนย่อยเดียว แต่ไม่สามารถอนุมานโมเดลส่วนประกอบทั่วทั้งไซต์หรือบันทึกการอัปเดตจำนวนมากที่เก็บไว้ได้
ตัวอย่างการทำงาน: การทำความสะอาดบทความหนึ่ง - นำบทความที่วาง ตรวจสอบมาร์กอัปและแสดงเวอร์ชันที่สะอาดกว่าที่มีลักษณะเหมือนกัน
คัดลอกบทความที่มีสไตล์ div, หัวเรื่องตัวหนาปลอม, สองย่อหน้า และรายการเส้นประที่พิมพ์ด้วยมือ การกรองจะลบ div สไตล์ และคลาส แต่ไม่ทราบว่าเส้นหนาควรกลายเป็น h2 หรือขีดกลางควรกลายเป็น li บุคคลจะต้องสร้างตัวเลือกเชิงความหมายเหล่านั้นขึ้นมาใหม่
เปรียบเทียบผลลัพธ์ภาพและแหล่งที่มาหลังการแก้ไขแต่ละครั้ง แทนที่ส่วนหัวปลอมด้วยระดับส่วนหัวที่เลือก และขีดกลางด้วยรายการจริง จากนั้นตรวจสอบรูปแบบลิงก์และขอบเขตของย่อหน้า เวอร์ชันที่สะอาดกว่าอาจดูง่ายกว่าในแซนด์บ็อกซ์เนื่องจากยังไม่ได้ใช้ปลายทาง CSS
สิ่งที่ไม่ครอบคลุมถึง ได้แก่ การล้างข้อมูลจำนวนมากแบบอัตโนมัติ สถาปัตยกรรม CSS หรือการวัดประสิทธิภาพ
บทความนี้ไม่ได้กำหนดอัลกอริทึมการล้างข้อมูลจำนวนมาก สถาปัตยกรรม CSS หรืองบประมาณด้านประสิทธิภาพ นอกจากนี้ยังไม่ได้อ้างว่าสุขอนามัยเพียงอย่างเดียวสร้างเนื้อหาที่เข้าถึงได้ ข้อความแสดงแทน ภาษา วัตถุประสงค์ของลิงก์ ลำดับชั้นของส่วนหัว และความชัดเจนของบรรณาธิการ จำเป็นต้องมีข้อมูลที่นอกเหนือจากรายการแท็กที่อนุญาต
และไม่ควรเผยแพร่ไฟล์เก็บถาวรที่ไม่น่าเชื่อถือเพียงเพราะ ToolAcre ยอมรับส่วนย่อยของไฟล์เหล่านั้น โทเค็นไนเซอร์ที่เขียนด้วยลายมือเตือนเกี่ยวกับส่วนต่างของตัวแยกวิเคราะห์เบราว์เซอร์ ใช้น้ำยาฆ่าเชื้อฝั่งเซิร์ฟเวอร์ที่ได้รับการบำรุงรักษาภายใต้นโยบายของระบบที่รับ และทดสอบผลลัพธ์ที่แยกจากแบบร่างในเครื่อง
ประเด็นสำคัญ: มาร์กอัปที่สะอาดจะมีราคาถูกลงทุกปีหลังจากนั้น — สรุปกรณีและวิธีที่การตรวจสอบเอาต์พุตในตัวแก้ไข HTML WYSIWYG ของ ToolAcre ช่วยป้องกันความยุ่งเหยิงที่แหล่งที่มา
มาร์กอัปแบบสะอาดจะมีราคาถูกกว่าในการทำความเข้าใจในแต่ละปีหลังจากการตีพิมพ์ เนื่องจากผู้แก้ไขในอนาคตสามารถระบุโครงสร้างได้โดยไม่ต้องแฮ็กการนำเสนอแบบวิศวกรรมย้อนกลับ ประโยชน์ที่ได้รับจะมาจากการออกแบบใหม่ การส่งออก และการย้ายข้อมูล แม้ว่าการลดจำนวนไบต์ในทันทีจะเล็กน้อยก็ตาม
ป้องกันความยุ่งเหยิงที่แหล่งกำเนิดโดยการตรวจสอบเอาต์พุตตัวแทนก่อนที่จะเข้าสู่ CMS ใช้ ToolAcre เพื่อแสดงและกรองสัมภาระ จากนั้นจงใจระบุความหมายที่ขาดหายไปและจัดรูปแบบที่ปลายทาง ทบทวนบทความหนึ่งบทความอย่างลึกซึ้งก่อนปรับขนาดการเปลี่ยนแปลงเป็นหลักพัน