XHTML چیست؟

0
118
XHTML چیست؟

آشنایی با XHTML

به زبان ساده، XHTML همان HTML است که به صورت XML نوشته شده باشد. XHTML مخفف EXtensible HyperText Markup Language و به معنی «زبان امتدادپذیر نشانه‌گذاری فرامتنی» است اما نگذارید این اسم های قلمبه و سلمبه شما را فریب دهد! XHTML دقیقا مانند HTML نوشته می شود اما قوانین سخت گیرانه تری دارد و همانطور که گفتیم انگار می خواهیم HTML را به صورت یک برنامه ی XML بنویسیم. همچنین قابل ذکر است که XHTML توسط تمام مرورگر های مطرح پشتیبانی می شود.

چرا XHTML ؟

بسیاری از صفحات وب دارای HTML بد و غیر معتبر هستند. به طور مثال کد HTML زیر در تمام مرورگر ها کار می کند اما از نظر فنی غیر صحیح است:

به نظر شما مشکل کد بالا چیست؟

کد بالا در وهله ی اول هیچ DOCTYPE ای ندارد و مشخص نکرده است که از چه ورژنی از HTML استفاده می کند. همچنین تگ <html> را در آخر سند بسته نشده است و هیچ تگ پایانی را مشاهده نمی کنیم. این اتفاق برای تگ های <head> و <h1> و <p> نیز اتفاق افتاده است.

این کد HTML کاملا غیر معتبر و غیر صحیح است اما در اکثر مرورگر های وب بدون مشکل به نمایش در می آید چرا که خود مرورگر ها متوجه اشکالات می شوند و آن ها را در هنگام نمایش تصحیح می کنند. اما این مسئله برای مرورگر های تلفن های همراه اتفاق نمی افتد. معمولا گوشی های هوشمند آنقدر پیشرفته نشده اند که هر نوع خطایی را متوجه شوند و تصحیحش کنند. بنابراین علاوه بر ضربه خوردن از جهت سئو، ممکن است کاربران تلفن های هوشمند نتوانند سایت شما را ببینند و کاربران زیادی را از دست بدهید.

از طرفی XML نوعی زبان نشانه گذاری است که در آن باید قوانین نشانه گذاری را به طور کامل رعایت کرد. همانطور که حدس می زنید ترکیب XML و HTML همان XHTML می باشد.

خصوصیات XHTML

برخی از مهم ترین خصوصیات زبان XHTML از این قرار اند:

  • تعریف DOCTYPE در این زبان اجباری است
  • تعریف attribute ای به نام xmlns در <html> اجباری است
  • وجود داشتن تگ های <html> و <head> و <title> و <body> در یک سند اجباری است
  • عناصر XHTML باید به صورت کاملا صحیح nest شوند (تو در تو قرار بگیرند)
  • تمام عناصر XHTML باید همیشه بسته شوند (تگ پایانی)
  • تمام عناصر XHTML باید با حروف کوچک نوشته شوند
  • اسناد XHTML باید حتما یک عنصر root (ریشه ای) داشته باشند
  • نام attribute ها باید همیشه با حروف کوچک نوشته شود
  • مقدار attribute ها باید در Quotation قرار بگیرد
  • خلاصه سازی attribute ها غیر مجاز است1

1- خلاصه سازی attribute ها یعنی مواردی مثل مورد زیر:

اگر به جای نوشتن <"option selected="selected> بنویسید <option selected> می گوییم attribute (در اینجا selected) را خلاصه کرده اید.

می خواهیم این موارد را به صورت خلاصه بررسی کنیم.

اعلام DOCTYPE

یک سند XHTML باید علاوه بر DOCTYPE شامل تگ های <html> و <head> و <title> و <body> باشد.

یک نمونه سند صحیح به این شکل است:

DOCTYPE ای که در بالا می بینید، نحوه ی اعلام DOCTYPE به عنوان XHTML است.

تو در تو بودن (nesting)

در زبان HTML بعضا می توانیم اشتباها عناصر را nest کنیم:

در این کد تگ های پایانی جا به جا بسته شده اند.

اما در XHTML باید کاملا صحیح nest شوند:

تگ های پایانی

در HTML این کد غلط است:

و این حالت صحیح است:

حتی تگ هایی که در HTML تگ پایانی ندارند باید در XHTML بسته شوند. در HTML این تگ ها به این صورت هستند:

اما در XHTML باید به این شکل نوشته شوند:

همچنین همیشه باید تگ هایتان با حروف کوچک باشند بنابراین کد زیر غلط است:

حالت صحیح این کد به این صورت است:

Attribute ها

کوچک بودن حروف برای attribute ها نیز صدق می کند، بنابراین کد زیر غلط است:

و شکل صحیح آن بدین صورت است:

همچنین باید مقدار این attribute ها در quotation باشد. کد زیر غلط است:

و شکل صحیح آن بدین صورت است:

خلاصه سازی attribute ها نیز غیر مجاز است. به نمونه های صحیح و غلط زیر نگاه کنید.

کد غلط:

حالت صحیح آن:

کد غلط:

حالت صحیح آن:

سوال: چطور می توانیم از HTML به XHTML مهاجرت کنیم؟

پاسخ: ابتدا باید یک DOCTYPE برای XHTML بنویسید و DOCTYPE قبلی را حذف کنید. سپس attribute ای به نام xmlns را به خودِ عنصر html اضافه کنید. سپس نام تمامی عناصر را با حروف کوچک بنویسید و این کار را با attribute ها نیز انجام دهید. در آخر تگ های خالی (تگ هایی که تگ پایانی ندارند) را ببندید و برای مقادیر attribute ها Quotation قرار دهید.

یک مثال از یک سند XHTML برای شما آورده ام:

مشاهده ی خروجی در JSBin

با نگاهی به این سند کوتاه متوجه می شوید که تمام موارد بالا در آن رعایت شده است.

امیدوارم از این قسمت نیز لذت برده باشید.

ترتیبی که روکسو برای یادگیری مطالب سری آموزش صفر تا صد HTML به شما توصیه می‌کند:

ارسال دیدگاه

لطفا دیدگاه خود را وارد کنید!
نام خود را وارد کنید