มาตรฐานเว็บแบ่งหน้าเว็บออกเป็นสามองค์ประกอบอิสระ:
* โครงสร้าง: HTML, XHTML, XML
* ประสิทธิภาพ: CSS1, CSS2
* พฤติกรรม: ECMAScript, DOM
มาตรฐานเว็บยังไม่มีหลักเกณฑ์หรือหลักเกณฑ์เกี่ยวกับรูปลักษณ์และความสวยงาม และไม่ได้กำหนดข้อจำกัดใดๆ เกี่ยวกับรูปลักษณ์และความรู้สึกของเว็บไซต์ พวกเขาเพียงแต่ทำให้เบราว์เซอร์สามารถแสดงเว็บไซต์ที่สร้างโดยนักออกแบบได้อย่างถูกต้อง และช่วยให้ลูกค้าตอบสนองความต้องการของบริษัทได้ ความต้องการและความต้องการของตลาด การวิเคราะห์ผู้ใช้เพื่อกำหนดเป้าหมาย
มาตรฐานเว็บสามารถทำได้:
* การควบคุม ตำแหน่ง และเค้าโครงที่แม่นยำยิ่งขึ้นบนเบราว์เซอร์แบบกราฟิก
* พฤติกรรมการโต้ตอบที่ซับซ้อน
*การเข้าถึง
* รองรับหลายเบราว์เซอร์
* ใช้งานได้ทั้งบนเบราว์เซอร์เก่าและใหม่
* รับประกันว่าจะใช้ได้กับเบราว์เซอร์ในอนาคต
* ลดเวลาการออกแบบเว็บไซต์ใหม่
* รองรับอุปกรณ์ที่ไม่ใช่แบบดั้งเดิม
* จัดทำหน้าเว็บเวอร์ชันที่เหมาะกับการพิมพ์ได้อย่างง่ายดาย
* ออกแบบเอกสารใหม่ได้อย่างง่ายดายในระหว่างกระบวนการเผยแพร่
* แปลง HTML เป็นภาษามาร์กอัปที่ใช้ XML
เหตุผลในการใช้มาตรฐานเว็บ:
* เพิ่มความสามารถในการโต้ตอบ
* ปรับปรุงการเข้าถึง
* ลดภาระงานบำรุงรักษา
* ลดแบนด์วิธ
* ลดต้นทุน
XHTML เป็นภาษามาร์กอัปที่ใช้ XML ซึ่งมีลักษณะคล้ายกับ HTML มีความแตกต่างเล็กน้อยแต่สำคัญ คุณสามารถดูได้ด้วยวิธีนี้ XHTML คือ XML ที่มีบทบาทคล้ายกับ HTML
โดยพื้นฐานแล้ว XHTML เป็นเทคโนโลยีการเชื่อมโยง (การเปลี่ยนผ่าน) ที่รวมพลังของ XML (ค่อนข้าง) เข้ากับความเรียบง่ายของ HTML (ส่วนใหญ่)
----เจฟฟรี่ เซลด์แมน
10 เหตุผลที่ควรเปลี่ยนมาใช้ XHTML:
*XHTML เป็นการแทนที่มาตรฐานในปัจจุบันสำหรับภาษามาร์กอัป HTML4
* XHTML สามารถโต้ตอบได้ดีกับภาษามาร์กอัป แอปพลิเคชัน และโปรโตคอลที่ใช้ XML อื่นๆ ได้ดี
* XHTML มีความสอดคล้องดีกว่า HTML
* XHTML1.0 เป็นสะพานเชื่อมไปยัง XHTML เวอร์ชันอนาคต
* เบราว์เซอร์รุ่นเก่าสามารถปรับให้เข้ากับ XHTML ได้
* เบราว์เซอร์ใหม่ชอบ XHTML มากกว่า HTML
* XHTML ทำงานได้ดีบนอุปกรณ์ไร้สายและตัวแทนผู้ใช้อื่นๆ
* XHTML เป็นส่วนหนึ่งของกลุ่มมาตรฐานเว็บ
* XHTML สามารถช่วยคุณกำจัดนิสัยที่ไม่ดีของโค้ดเลเยอร์การนำเสนอได้
* XHTML สามารถช่วยให้คุณติดนิสัยการตรวจสอบแท็กเพื่อทดสอบว่าเพจของคุณใช้งานได้
กฎ XHTML:
* เริ่มต้นด้วย DOCTYPE และเนมสเปซที่ถูกต้อง
* ใช้องค์ประกอบเนื้อหา META เพื่อประกาศภาษาการเข้ารหัสเนื้อหาของคุณ
* เขียนชื่อองค์ประกอบและคุณลักษณะทั้งหมดด้วยอักษรตัวพิมพ์เล็ก
* เพิ่มเครื่องหมายคำพูดให้กับค่าแอตทริบิวต์ทั้งหมด และแยกแอตทริบิวต์ด้วยการเว้นวรรค
* กำหนดค่าให้กับแอตทริบิวต์ทั้งหมด
* ปิดแท็บทั้งหมด
* ปิดแท็กว่างด้วยการเว้นวรรคและเครื่องหมายทับ
* ห้ามใช้ในเนื้อหาแสดงความคิดเห็น
* ตรวจสอบให้แน่ใจว่าใช้ < และ & สำหรับ < และ &
DTD ที่ได้รับจาก XHTML1 มีสามประเภท:
* เฉพาะกาล เปลี่ยนผ่าน DTD ที่ผ่อนปรนมากที่สุด DTD เดียวที่ยอมรับแท็กเลเยอร์การนำเสนอ องค์ประกอบขยะ และคุณลักษณะ
* เคร่งครัด เคร่งครัด
* เฟรมเซต, เฟรม,
วิธีการเข้ารหัสเนื้อหาการประกาศ XHTML:
* XML prolog นั่นคือ แต่เบราว์เซอร์ส่วนใหญ่ไม่รองรับสิ่งนี้
* แทรกองค์ประกอบ Content-Type เพื่อระบุภาษาการเข้ารหัส
* ตั้งค่าภาษาการเข้ารหัสผ่านส่วนหัว HTTP ที่ส่งคืนบนเว็บเซิร์ฟเวอร์ วิธีนี้แนะนำโดย w3c
กลไกทั่วไปในการเพิ่มโครงสร้าง
* องค์ประกอบ DIV และ SPAN รวมกับแอตทริบิวต์ id และคลาส ถือเป็นกลไกทั่วไปในการเพิ่มโครงสร้างให้กับเอกสาร
* องค์ประกอบเหล่านี้กำหนดเนื้อหาในตัว (SPAN) และระดับบล็อก (DIV) โดยไม่ต้องแนะนำเลเยอร์การนำเสนออื่น ๆ เข้าไปในเนื้อหา
* แอตทริบิวต์ ID คล้ายกับป้ายกำกับของพื้นที่พิเศษในโค้ด ซึ่งระบุว่าพื้นที่ดังกล่าวต้องมีการประมวลผลพิเศษ เมื่อใช้ค่าแอตทริบิวต์ ID ใน CSS ที่ตั้งค่าเป็นพิเศษ จะเรียกว่าตัวเลือก CSS ID เป็นวิธีที่ง่ายและหลากหลายที่สุดในการสร้างตัวเลือก
* ชื่อ ID ต้องขึ้นต้นด้วยตัวอักษรและขีดล่าง และไม่สามารถขึ้นต้นด้วยตัวเลขได้
ฟังก์ชันรหัส
* ในฐานะตัวเลือกสไตล์ชีต ให้ย่อขนาดไฟล์เพจ XHTML
* เป็นจุดยึดของไฮเปอร์ลิงก์ แทนที่แอตทริบิวต์ชื่อที่ล้าสมัย
* วิธีการอ้างอิงองค์ประกอบในสคริปต์ DOM;
* เป็นชื่อองค์ประกอบวัตถุที่ประกาศ;
* เป็นเครื่องมือสำหรับการประมวลผลกระบวนการทั่วไป
# สไตล์ชีตคือชุดของคำจำกัดความกฎตั้งแต่หนึ่งข้อขึ้นไปที่กำหนดวิธีการแสดงองค์ประกอบที่เลือก
# คำจำกัดความ CSS ประกอบด้วยสองส่วน: ตัวเลือกและการประกาศ ในหมู่พวกเขาการประกาศยังเป็นคอลเลกชัน องค์ประกอบคอลเลกชันจะถูกวางไว้ภายในคู่ของ {} แต่ละองค์ประกอบประกอบด้วยสองส่วน: คุณลักษณะและค่าจะถูกคั่นด้วย:
# ตัวเลือกที่ขึ้นต้นด้วย # คือตัวเลือก id และตัวเลือกที่ขึ้นต้นด้วย .
# ตัวเลือกหลายตัวสามารถใช้คำสั่งเดียวกันได้ ซึ่งในกรณีนี้ตัวเลือกที่แตกต่างกันจะถูกคั่นด้วยเครื่องหมายจุลภาค
# ตาม CSS องค์ประกอบลูกของเพจสืบทอดคุณสมบัติจากองค์ประกอบหลัก แต่เบราว์เซอร์เก่าบางตัวไม่รองรับ (เช่น Netscape 4) หากคุณไม่ต้องการให้องค์ประกอบลูกสืบทอดคุณสมบัติขององค์ประกอบหลัก องค์ประกอบย่อยสามารถกำหนดแอตทริบิวต์ที่เกี่ยวข้องได้อย่างอิสระ
# CSS ไม่คำนึงถึงขนาดตัวพิมพ์ แต่เมื่อเชื่อมโยงกับไฟล์ HTML ชื่อหมวดหมู่และรหัสจะคำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่
# เพื่อความสะดวกในการแก้ไข CSS คุณสามารถเพิ่มช่องว่างหรือขึ้นบรรทัดใหม่ได้
# สไตล์ชีตอาจส่งผลต่อการแสดงเพจได้สามวิธี
1. การเข้าถึง/นำเข้า
<link rel=StyleSheet href=/styles/mystylesheet.css type=text/css media=all />
หรือ
<ประเภทสไตล์=ข้อความ/css สื่อ=ทั้งหมด>
@นำเข้า /styles/mystylesheet.css;
</สไตล์>
หรือ
<ประเภทสไตล์=ข้อความ/css สื่อ=ทั้งหมด>
@นำเข้า URL(/styles/mystylesheet.css);
</สไตล์>
หมายเหตุ: วิธีการ @Import รองรับเฉพาะเบราว์เซอร์เวอร์ชันสูงกว่า 5.0 เท่านั้น