บทความนี้ให้ความสำคัญกับแท็ก html ในเทพนิยายที่สมบูรณ์แบบก่อนหน้านี้ แท็กเหล่านี้เป็นอันตราย ไม่ดี น่าเกลียดอย่างเห็นได้ชัด และควรแยกออกจาก html มาตรฐาน หากต้องการให้ใช้งานได้เพียงครึ่งเดียว ให้ล้มล้างเบราว์เซอร์หรือใช้แท็กใหม่ที่ง่ายกว่าและแนะนำ ฉลาก.
แม้ว่าบทช่วยสอนพื้นฐานก่อนหน้านี้จะให้คำแนะนำที่ตรงตามมาตรฐาน แต่ผู้เริ่มต้นก็มีพื้นฐานที่แตกต่างกันหรือแบบฝึกหัดที่ไม่ถูกต้อง นี่คือบทสรุป
HTML พยายามเปลี่ยนจากประสิทธิภาพไปสู่ความหมาย จากนั้นแยกความหมาย (HTML) และประสิทธิภาพ (CSS) ออก สิ่งนี้มีการใช้กันอย่างแพร่หลายบนหน้าเว็บเนื่องจากคำสั่งการนำเสนอเดียว (ไฟล์ CSS) สามารถใช้ได้กับหลายหน้า ด้วยวิธีนี้ เว็บไซต์จะจัดการได้ง่ายขึ้น และหากคุณต้องการเปลี่ยนแปลงทั้งเว็บไซต์ คุณเพียงแค่ต้องเปลี่ยนโค้ดง่ายๆ เท่านั้น
แท็กที่เป็นอันตรายบางแท็กจริงๆ แล้วเป็นแท็กการนำเสนอธรรมดา (เช่น แท็กขนาดเล็ก) ซึ่งสามารถแทนที่ด้วยโค้ดที่มีความหมายเหมือนกันใน CSS แท็กอื่นๆ ไม่ชัดเจน แต่ไม่จำเป็น (เช่น แท็กแบบอักษร) หรือเป็นอันตรายต่อการใช้งาน (เช่น การกะพริบ)
แท็ก
แท็กที่แสดงด้านล่างอาจใช้ตัวเลือกที่ดีกว่า:
แท็ก b หมายถึงตัวหนา คุณสามารถใช้ strong แทน หรือเพิ่ม font-weight:bold ใน css
i แสดงถึงองค์ประกอบตัวเอียง คุณสามารถใช้ em แทน หรือเพิ่ม font-style: italic ใน css
Big ใช้เพื่อแสดงข้อความขนาดใหญ่ คุณสามารถใช้ h1, h2 ฯลฯ ในหัวเรื่องแทนได้
Small ใช้เพื่อแสดงข้อความขนาดเล็ก และสามารถควบคุมได้ในขนาด cssfont
hr แสดงถึงเส้นแนวนอน ซึ่งสามารถแทนที่ด้วย border-top หรือ border-bottom ใน CSS หรืออาจแสดงด้วยรูปภาพก็ได้
แท็กที่กล่าวถึงข้างต้นทั้งหมดเป็นไปตามมาตรฐาน HTML ล่าสุด แต่ไม่ได้ให้ความหมายเชิงความหมายแก่เนื้อหา อาจมีประโยชน์มากกว่าแต่ไม่เป็นอันตรายมากนัก และอาจเป็นเรื่องง่ายมากที่จะทำผิดพลาดเมื่อยืนอยู่บนฉลากเส็งเคร็งด้านล่าง
คุณแสดงถึงองค์ประกอบที่ขีดเส้นใต้ มันทำให้ข้อความขีดเส้นใต้เหมือนการเชื่อมโยงกัน ซึ่งอาจเป็นสาเหตุว่าทำไมแท็กนี้จึงหายไป ผู้คนไม่ชอบให้ขีดเส้นใต้ข้อความที่ไม่เชื่อมต่อกัน
center สามารถจัดองค์ประกอบให้อยู่ตรงกลางได้ การจัดตำแหน่งข้อความของคุณสมบัติ CSS ไม่เพียงแต่สามารถจัดกึ่งกลางได้เท่านั้น แต่ยังรวมไปถึงซ้าย ขวา และจัดชิดขอบอีกด้วย menu ใช้เพื่อสร้างรายการเมนู มันทำได้สวยงามกว่า ul แต่รายการที่ไม่เรียงลำดับนั้นพบได้บ่อยกว่า และ ul จะแทนที่เมนู
องค์ประกอบเลเยอร์คล้ายกับองค์ประกอบ div มาก แต่ใช้งานได้เฉพาะในเบราว์เซอร์ Netscape เวอร์ชันเก่าเท่านั้นและมีประโยชน์เพียงเล็กน้อย
กระพริบตาหรือกระโจม ปฏิเสธอย่างเด็ดขาดกับพวกเขา
สามารถใช้ฟอนต์เพื่อกำหนดชื่อ ขนาด และสีของฟอนต์ได้ เว็บไซต์เก่า (และแม้แต่เว็บไซต์ปัจจุบัน) ที่ใช้แท็กแบบอักษรอย่างต่อเนื่องตลอดทั้งหน้าก็เหมือนกับโรคระบาดของปลวก ซอฟต์แวร์สร้างเว็บบางตัวจะวางแท็กแบบอักษรไว้รอบๆ แต่ละองค์ประกอบเพื่อควบคุมสีหรือขนาดข้อความ ใช้แท็กแบบอักษรเพื่อนำไปใช้กับทุกองค์ประกอบ หากแสดงใน CSS จะใช้เพียงประโยคง่ายๆ เท่านั้นและสามารถเปลี่ยนแปลงได้ทั่วทั้งไซต์ เมื่อใช้วิธีการนี้ คุณไม่เพียงสามารถลดขนาดของหน้าเว็บเท่านั้น แต่ยังเปลี่ยนเนื้อหาที่แสดงด้วยแบบอักษรด้วยการเปลี่ยนคำสั่ง css แบบง่ายอีกด้วย สิ่งนี้ทำให้รูปแบบเว็บไซต์สอดคล้องกัน แท็กแบบอักษรและการใช้ตารางในทางที่ผิดเป็นสาเหตุหลักของหน้าเว็บป่อง
คุณสมบัติ
ตอนนี้คุณอาจใช้ฉลากได้อย่างถูกต้อง แต่ฉลากเหล่านี้มีคุณสมบัติในการเป็นปรสิตที่น่ารำคาญซึ่งอาจทำให้เสียรสชาติได้
name กำหนดชื่อให้กับองค์ประกอบ ซึ่งทำงานได้อย่างสมบูรณ์แบบในองค์ประกอบของแบบฟอร์ม เช่น อินพุต แต่ในส่วนอื่น งานของชื่อจะถูกยึดครองโดยแอตทริบิวต์ id
ข้อความและ bgcolor ใช้เพื่อระบุสีข้อความพื้นฐานและสีพื้นหลังของแท็ก open body คุณสมบัติสีและสีพื้นหลังใน CSS สามารถนำไปใช้กับตัวเลือกเนื้อหาได้เป็นอย่างดี
พื้นหลังสามารถระบุภาพพื้นหลังสำหรับแท็กเนื้อหาได้ CSS สามารถให้แอตทริบิวต์ภาพพื้นหลังที่ดีกว่า เช่น ภาพพื้นหลัง
link, alink, vlink สามารถระบุสีลิงค์ให้กับแท็ก body ได้ คุณสมบัติ CSS: :link, :active, :visited มีผลเช่นเดียวกัน align สามารถควบคุมการจัดเรียงองค์ประกอบ เช่น <div align="center">Stuff</div> แต่เช่นเดียวกับแท็กกึ่งกลาง คุณสามารถใช้แอตทริบิวต์ text-align ใน css ได้
ลิงก์เป้าหมายถูกเปิดในสถานะที่แตกต่างกัน เช่น การเปิดหน้าต่างใหม่ <a href="wherever.html" target="_blank">ช่วยเหลือฉัน</a> ฟังดูดีแต่ไม่รู้สึกคุ้นเคยกับเว็บไซต์นี้ ผู้ใช้ไม่คาดหวังว่าสิ่งเหล่านี้ (เช่น การเปิดหน้าต่างใหม่) จะปรากฏเหมือนเวทย์มนตร์ ผู้ใช้ส่วนใหญ่ชอบใช้ปุ่ม "ย้อนกลับ" และการเปิดหน้าต่างใหม่หมายความว่าฟังก์ชันนี้ถูกปิดใช้งาน คุณลักษณะด้านประสิทธิภาพของแท็ก เช่น ความกว้างและความสูงของรูปภาพ เซลล์แพดดิ้ง และระยะห่างเซลล์ของตาราง จะเป็นตัวกำหนดการนำแอตทริบิวต์ต่างๆ ไปใช้กับองค์ประกอบต่างๆ สิ่งเหล่านี้ไม่ใช่วิธีแก้ปัญหาที่สมบูรณ์แบบ แต่หากเพจของคุณมีรูปภาพหรือตารางจำนวนมาก คุณอาจไม่มีตัวเลือกอื่นที่ใช้งานได้
คุณลักษณะการนำเสนอที่อธิบายไม่ได้ส่วนใหญ่เป็นของแท็ก textarea ซึ่งไม่เพียงแต่มีแอตทริบิวต์ที่ถูกต้องของคอลัมน์และแถวเท่านั้น แต่ยังต้องใช้คุณลักษณะเหล่านี้ในมาตรฐาน HTML ล่าสุดอีกด้วย
ฉลากดี การใช้งานไม่ดี
เข้าไปในบ้านอาจจะคุกเข่าคลานผ่านรูสุนัขก็ได้ แต่เดี๋ยวก่อน มีประตูที่ออกแบบสำหรับคนโดยเฉพาะ ที่จับ 555 ดูสิ ประตูมีขนาดพอให้คนลอดผ่านได้
แท็ก HTML ได้รับการออกแบบมาเพื่อรายละเอียด และเชื่อถือหรือไม่ เมื่อคุณใช้อย่างถูกต้อง คุณจะได้รับผลลัพธ์ที่ดีที่สุด
เมื่อ HTML เป็นแบบความหมาย หน้าเว็บจะใช้งานได้มากขึ้นสำหรับผู้ใช้ที่มีความพิการ เช่น โปรแกรมอ่านหน้าจอที่มักจะเน้นรายการโดยใช้แท็ก ul หรือส่วนหัวโดยใช้แท็ก h1 หรือ h2
การใช้ HTML ในทางที่ผิดที่ร้ายแรงที่สุดคือตารางใช้สำหรับการจัดวาง แต่จะใช้เพื่อแสดงข้อมูลแบบตารางเท่านั้น แนวคิดของการไม่ใช้เค้าโครงตารางไม่ได้เกี่ยวกับการแสวงหาการตรัสรู้แบบชาวพุทธ แต่มีประโยชน์จริง ๆ ไม่เพียงแต่ลดขนาดของหน้าเว็บ แต่ยังทำให้ง่ายต่อการดูแลรักษาและออกแบบหน้าเว็บใหม่อีกด้วย
บางครั้งนักออกแบบบางคนใช้แท็กและคุณลักษณะบางอย่างในการออกแบบการเปลี่ยนผ่านให้เสร็จสมบูรณ์ (โดยเฉพาะเค้าโครงตาราง) ประการแรก พวกเขาสามารถรองรับเบราว์เซอร์เวอร์ชันเก่า (Netscape 4) ตารางทำงานได้ดีกว่า CSS ใน Netscape 4 แต่ผู้ใช้มีขนาดเล็กมากและลดลง เนื่องจากขณะนี้ผู้ใช้อุปกรณ์เคลื่อนที่มีจำนวนเพิ่มขึ้น เค้าโครงตารางจึงแย่มาก ข้อดีของตารางที่กล่าวถึงข้างต้นมีมากกว่าข้อเสียอย่างมาก และเหตุผลก็คือ หน้าเว็บจำเป็นต้องคำนึงถึงฟังก์ชันเบราว์เซอร์ทั้งหมดที่มีสไตล์น้อยที่สุดเท่าที่จะทำได้
เฟรม
โกลดิล็อคส์คิดว่าเป็นความคิดที่ดีที่จะช่วยเธอถือชามโจ๊ก แต่แล้วนักล่าตัวใหญ่ 3 ตัวก็ปรากฏตัวขึ้นและโยนเธอออกไปนอกหน้าต่าง กรอบก็เหมือนชามข้าวต้มที่เป็นของหมี พวกมันดูดี แต่ก็มีอันตรายอยู่เสมอ
เว็บไซต์ส่วนใหญ่ไม่ใช้เฟรม และผู้ใช้เว็บไซต์ส่วนใหญ่ใช้เพียงหน้าเดียวเท่านั้น
แต่จะเกิดอะไรขึ้นหากคุณจำเป็นต้องป้องกันไม่ให้ผู้ใช้เพิ่มหน้าใดหน้าหนึ่งลงในบุ๊กมาร์กของตน หรือคุณต้องการป้องกันไม่ให้มีการแนะนำหน้าใดหน้าหนึ่งทางอีเมลหรือข้อความโต้ตอบแบบทันที หรือคุณต้องการเพิ่มความซับซ้อนโดยรวมอีกระดับหนึ่งในการใช้งาน การอ่านหน้าจอ สำหรับผู้ใช้เบราว์เซอร์ที่พิการซึ่งจำเป็นต้องนำทางระหว่างเฟรมหรือหากคุณต้องการเข้าสู่นรกของเครื่องมือค้นหาให้ใช้เฟรม
โดยพื้นฐานแล้ว เฟรมเวิร์กไม่ได้ทำอะไรเลยนอกจากเพิ่มความซับซ้อนและสูญเสียความสามารถในการใช้งาน
สุดท้ายนี้ หากคุณปฏิบัติตามกฎด้านล่าง คุณจะไม่ผิดไปไกลเกินไป
1) หากชื่อของฉลากหรือคุณลักษณะค่อนข้างไม่คุ้นเคยแนะนำให้แสดงความคิดเห็นหรือไม่ใช้ ประสิทธิภาพของการใช้ CSS จะได้รับการปรับปรุงในลักษณะนี้
2) ปล่อยให้ป้ายกำกับทำงานตามที่ตั้งชื่อไว้ ตารางใช้สำหรับข้อมูลแบบตาราง เพียงใช้ชื่อเรื่องสำหรับชื่อเรื่องและอื่น ๆ
3) เมื่อคุณมีเนื้อหาที่ชัดเจน ให้ใช้แท็กที่เหมาะสม ใช้รายการสำหรับรายการ ชื่อเรื่องสำหรับชื่อเรื่อง และอื่นๆ