เนื่องจากเบราว์เซอร์ที่แตกต่างกันมีการตีความแท็กและแผ่นสไตล์ที่แตกต่างกันจึงจำเป็นต้องกำหนดประเภทเอกสารมาตรฐานสำหรับไฟล์ HTML เพื่อให้เบราว์เซอร์ที่แตกต่างกันสามารถแยกวิเคราะห์และแสดงหน้าตามมาตรฐาน HTML แบบครบวงจร
! Doctype ประกาศ DTD ว่าเอกสารที่ระบุเป็นไปตามเช่น:
<! doctype html สาธารณะ -// w3c // dtd html 4.0 transitional // en http://www.w3.org/tr/html4/loose.dtd>
<! doctype html สาธารณะ -// w3c // dtd xhtml 1.0 transitional // en http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd>
เมื่อใช้แท็ก HTML มาตรฐานอย่างถูกต้องลองใช้เค้าโครง Div+CSS และอย่าใช้เค้าโครงตาราง
การใช้ตารางสำหรับเค้าโครงสามารถทำให้รหัสซ้ำซ้อนได้อย่างง่ายดายและเปรียบเทียบกับการเขียน <div> </div> มีรหัสมากมาย ยิ่งไปกว่านั้นตารางต้องดาวน์โหลดองค์ประกอบทั้งหมดและแสดงและหน้าเว็บที่เกี่ยวข้องก็เปิดช้า
ควรใช้โครงสร้างหน้ามาตรฐาน: DIV+CSS วิธีการเลย์เอาต์นี้ง่ายในรหัสความเร็วในการท่องเว็บที่รวดเร็วและเค้าโครงหน้าแบบยืดหยุ่น เมื่อทำการแก้ไขคุณจะต้องเปลี่ยนสไตล์ CSS เพื่อรับรู้การถ่ายทอดหน้าโดยไม่ต้องเปลี่ยนโปรแกรมซึ่งจะช่วยลดค่าใช้จ่ายในการแก้ไขเว็บไซต์
ให้ความสนใจกับความสัมพันธ์ปิดของแท็กโดยเฉพาะอย่างยิ่งเมื่อทำรังแท็กอื่น ๆ เช่น divs ในแท็กฟอร์มบางครั้งจะมีช่องว่างพิเศษในหน้าซึ่งไม่สามารถหลีกเลี่ยงได้แม้ว่ามาร์จิ้นจะถูกรีเซ็ต ในเวลานี้อาจเป็นไปได้ว่าฉลากองค์ประกอบหน้าถูกปิดและไม่มีการจับคู่เช่น:
<div class = ด้านนอก>
<form name = testform>
<div class = inner>
<ชื่ออินพุต = tite type = text />
</form>
</div>
</div>
ใช้องค์ประกอบ tbody เมื่อกำหนดตารางเพื่อให้แน่ใจว่าเบราว์เซอร์ทั้งหมดรวมถึง IE สามารถใช้งานได้อย่างถูกต้องแม้ว่าตารางจะไม่แสดงองค์ประกอบ tbody ที่กำหนดเบราว์เซอร์จะคิดว่าโหนดพาเรนต์ของโหนด TR เป็นโหนด tbody เริ่มต้นที่เพิ่มขึ้นโดยอัตโนมัติ เพื่อหลีกเลี่ยงความเข้าใจผิดที่เป็นไปได้เมื่อจัดการกับโหนด TR โดยใช้ JavaScript มันจะเป็นการดีกว่าที่จะเพิ่มหนึ่งครั้งด้วยตนเองเช่น:
<ตาราง = myTable>
<tbody id = mytablebody>
<tr>
<td>
</td>
</tr>
</tbody>
</table>
ให้ความสนใจกับกรณีของป้ายกำกับและคุณลักษณะบางครั้งเหตุการณ์บางอย่างที่ผูกพันกับองค์ประกอบตอบสนองในเบราว์เซอร์ IE แต่ไม่ใช่ใน Safari หรือเบราว์เซอร์อื่น ๆ ในเวลานี้คุณต้องตรวจสอบความถูกต้องของวิธีการผูกมัดเหตุการณ์ การผูกมัดของเหตุการณ์ขั้นสูงจะต้องแตกต่างจาก IE และเบราว์เซอร์อื่น ๆ เพื่อเขียน JavaScripts สองชุดในขณะที่โมเดลเหตุการณ์ง่าย ๆ จำเป็นต้องให้ความสนใจกับกรณีของชื่อเหตุการณ์ที่มีผลผูกพัน ชอบ:
<ประเภทอินพุต = ชื่อข้อความ = คำสำคัญ onfocus = clearValue ()>>
ควรใช้ OnFocus ตัวพิมพ์เล็กที่นี่และวิธีการเขียนมาตรฐานคือสัญลักษณ์การปิดแท็กที่เพิ่มขึ้นที่แสดง
<ประเภทอินพุต = ชื่อข้อความ = คำสำคัญ onfocus = clearValue () />
ให้ความสนใจกับการตั้งค่ามูลค่าทรัพย์สินของฉลากคุณสมบัติภาษาและประเภทของแท็ก <script>
แอตทริบิวต์ภาษาของแท็ก <script> ใช้เพื่อกำหนดเวอร์ชันภาษาสคริปต์ การกำหนดที่ถูกต้องควรเป็นเช่น <Script> เพื่อบอกเบราว์เซอร์ (ส่วนใหญ่คือ) เพื่อใช้ไวยากรณ์ JavaScript ของเวอร์ชัน 1.2 เพื่ออธิบาย แอตทริบิวต์ประเภทใช้เพื่อกำหนดประเภทสคริปต์มันเป็นแอตทริบิวต์มาตรฐานของ W3C และการใช้แอตทริบิวต์ตัวพิมพ์เล็กเป็นวิธีปฏิบัติมาตรฐานที่สอดคล้องกับมาตรฐาน หากคุณไม่จำเป็นต้องบอกเบราว์เซอร์ให้อธิบายในภาษา JavaScript รุ่นล่าง (เวอร์ชัน JavaScript ปัจจุบันที่ได้รับการสนับสนุนโดยเบราว์เซอร์ส่วนใหญ่คือ 1.5) โดยทั่วไปคุณไม่จำเป็นต้องกำหนดแอตทริบิวต์ภาษา แต่คุณลักษณะประเภทจะต้องกำหนด ดังนั้นรหัสควรเป็น
<ภาษาสคริปต์ = JavaScript> เปลี่ยนเป็น <script> แอตทริบิวต์ alt และชื่อของแท็ก <a>แม้ว่าค่าของแอตทริบิวต์ทั้งสองและชื่อจะแสดงในรูปแบบของเคล็ดลับเครื่องมือเมื่อวางเมาส์บนเมาส์ใน IE แต่ก็ยังมีความแตกต่างระหว่างทั้งสอง Alt เป็นจอแสดงผลทางเลือกเมื่อภาพไม่ปรากฏขึ้นและชื่อเรื่องเป็นพรอมต์เมื่อวางเมาส์ไว้
ตรวจสอบและอ่านคุณสมบัติอย่างเดียวของแท็ก <put>ใน HTML เวอร์ชันก่อนหน้านี้ไม่จำเป็นต้องมีการกำหนดค่าแอตทริบิวต์ทั้งหมด เมื่อเป็นตัวแทนของช่องทำเครื่องหมายวิธีการเขียนของ <การตรวจสอบอินพุต> ได้รับการยอมรับ อย่างไรก็ตามตามมาตรฐาน XHTML ไวยากรณ์ดังกล่าวไม่ใช่รูปแบบ XML ที่เข้มงวด ให้ความสนใจกับการกำหนดคุณสมบัติและการปิดแท็กเพื่อให้สอดคล้องกับแนวโน้มการพัฒนาของมาตรฐาน HTML มันเขียนดังนี้:
<อินพุตตรวจสอบ = ตรวจสอบ /> <อินพุต readonly = readonly /> คุณสมบัติเลือก ED ของแท็ก <potion>ด้วยเหตุผลเดียวกันกับบทความก่อนหน้านี้คุณสมบัติที่เลือกของแท็ก <potion> ในตัวเลือก <elect> ควรกำหนดค่า:
<เลือกตัวเลือก = เลือก />
แอตทริบิวต์ allign = absmiddle ของแท็ก <img>ตามมาตรฐาน XHTML แท็ก HTML ควรมุ่งเน้นไปที่การแสดงเนื้อหามากกว่าการควบคุมสไตล์และสไตล์ควรจะถูกทิ้งไว้ที่ CSS เพื่อปรับ ดังนั้นแท็กและแอตทริบิวต์เก่าบางตัวจึงถูกทิ้งเช่นแท็ก <em> และแท็ก <i> ที่จะทำให้ตัวละครจีนเป็นตัวเอียงปรากฏเป็นตัวเอียง แต่แท็ก <i> เพียงชื่อตามสไตล์เป็นมาตรฐานที่ถูกทอดทิ้งแล้วและถูกแทนที่ด้วยแท็ก <em> ที่แสดงถึงความหมายของการเน้น ในทำนองเดียวกันแอตทริบิวต์ allign = absmiddle ของแท็ก <IMG> บ่งชี้ว่าภาพนั้นมีศูนย์กลางในแนวตั้งและจัดแนวกับข้อความที่อยู่ติดกัน นี่เป็นคุณลักษณะที่แสดงถึงสไตล์ ควรใช้ CSS แทนแอตทริบิวต์นี้เพื่อควบคุมรูปแบบการจัดตำแหน่งของภาพเพื่อหลีกเลี่ยงอิทธิพลร่วมกันของการควบคุมสไตล์ทั้งสอง
คุณสมบัติ frameBorder ของแท็ก <frame>เมื่อใช้ IFRAME คุณไม่สามารถแสดงเส้นขอบของ IFRAME โดยการตั้งค่าเส้นขอบ = 0 ใน IE แต่แอตทริบิวต์เส้นขอบหน้าต่างเฟรมควบคุมมาตรฐานคือ FrameBorder คุณควรตั้งค่า frameBorder = 0 เพื่อซ่อนเส้นขอบของเฟรมในเบราว์เซอร์อื่น ๆ ที่อยู่ด้านนอกเช่น:
<iframe frameBorder = 0 />
คุณสมบัติ cellpadding ของแท็ก <bable>แอตทริบิวต์นี้เช่นแอตทริบิวต์การจัดตำแหน่งของแท็ก <IMG> ยังเป็นแอตทริบิวต์ที่เอาชนะความรับผิดชอบของ HTML เพื่อแสดงเนื้อหาและรูปแบบการควบคุม มันระบุช่องว่างระหว่างหน่วย จากมุมมองที่ใช้งานได้จริงมันเป็นการดีที่สุดที่จะไม่ระบุ CellPadding แต่ใช้ CSS เพื่อควบคุมระยะขอบด้านในของเซลล์
แอตทริบิวต์ NowRap ของแท็ก <td>NowRap เป็นแอตทริบิวต์ที่ระบุว่าเนื้อหาไม่ได้ห่อหุ้มโดยอัตโนมัติ แต่เช่นเดียวกับแอตทริบิวต์ข้างต้นนี่เป็นแอตทริบิวต์ที่ควบคุมสไตล์ ใน HTML 4.01, bgcolor, ความสูง, ความกว้างและ nowrap ของแท็ก <td> ไม่ได้รับการสนับสนุน ใน XHTML 1.0 DTD ที่เข้มงวด, BGCOLOR, ความสูง, ความกว้างและตอนนี้ไม่รองรับแท็ก <TD>