تخفیف ویژه زمستانه پی استور

تا 60 درصد تخفیف

شامل پروژه‌ها و دوره‌های آموزشی
روز
ساعت
دقیقه
ثانیه
آخرین فرصت‌ها

با خرید اشتراک ویژه ، با هزینه بسیار کمتر به فایل های پاورپوینت دسترسی داشته باشید!

تگ DOCTYPE در HTML

تگ DOCTYPE در HTML
گاهی ممکنه یه صفحه html طراحی کنیم اما صفحه مون در مرورگرهای مختلف به یک شکل نمایش داده نشه. مثلا توی کروم نمایش خوبی داشته باشه اما در سافاری بعضی چیزا نا مرتب و بی نظم باشن. میایین کدهاتون رو بررسی می‌کنین و می‌بینین که تقریبا همه چیز رو رعایت کردین.

فهرست مطالب

صفحه ریسپانسیوه. استایل‌ها به دقت اعمال شدن و تو مرورگر خودتون عالیه. اما دقیقا چه اتفاقی واسه کدهاتون افتاده؟ گاهی ممکنه یه تگ که از نظر شما هیچ اهمیتی نداره رو کلا ننویسین یا ناقص بنویسین. یکی از این تگ‌ها، تگ DOCTYPE هستش. عدم استفاده از دستور DOCTYPE یا استفاده نادرست ازش می‌تونه صدمه زیادی به سایت یا صفحه‌تون بزنه.

تگ DOCTYPE در HTML

دستور DOCTYPE در واقع جزو تگ‌‎های اچ تی ام ال نیست و صرفا یه راهنماست. یه راهنما واسه مرورگرهای اینترنته که به مرورگرها می‌‎فهمونه نسخه html ای که ازش استفاده می‌کنیم چیه. واضح‌تر می‌گم، نوشتن این دستور هیچ تگی رو به html القا نمی‌کنه. پس هیچ چیز خاصی رو هم در صفحه‌مون نمایش نمیده چون تگ اچ تی ام ال نیست.

صرفا یه دستور العمل واسه معرفی ورژن اچ تی ام ال صفحه‌مون به مرورگر هاست و همچنین به مرورگرها می‌گه که این صفحه کاملا با اچ تی ام ال نوشته شده. اگه می‌خواین یه مطالعه کامل از تگ‌های html داشته باشین به مقاله آموزش HTML سر بزنین.

لزوم استفاده از دستور DOCTYPE

آیا استفاده از تگ doctype الزامیه یا اختیاریه؟ در جواب به این سوال می‌تونیم بگیم که صفحه html شما بدون این تگ هم کار خواهد کرد. همه تگ‌ها و المان‌ها نمایش داده می‌شن اما W3C به عنوان کنسرسیوم جهانی وب، چون نسخه‌های متعددی از اچ تی ام ال رو معرفی کرده، الان خودش تاکید می‌کنه که حتما نسخه html صفحه‌تون رو به مرورگرها اعلام کنین. چرا؟ چون ما چندین نسخه از اچ تی ام ال رو معرفی کردیم و داریم.

اما اگه از این دستور سرپیچی کنیم و نسخه اچ تی ام ال رو به مرورگرها معرفی نکنیم چی می‌شه؟ در جواب این سوال باید شما رو با قسمت اعتبار سنجی کنسرسیوم جهانی وب آشنا کنم:

اعتبارسنجی صفحه

برای اینکه بدونین کدوم قسمت از کدهای صفحه‌تون با قوانین W3c مغایره باید به این آدرس validator.w3.org مراجعه کنین و آدرس صفحه‌ای که قراره بررسی کنین رو در قسمت جستجوش (که با فلش سبز مشخص شده) تایپ کنین و دکمه check رو بزنین:

 

دستور و تگ doctype

 

بعد از انجام این کار، کدهای اشتباه، ناقص و تعداد خطاهایی که در صفحه html تون مرتکب شدین رو میاره. خوب اگه صفحه شما فاقد تگ doctype باشه یه خطای بزرگ به اندازه یه هندوونه خدمتتون ارائه می‌ده. اما نمی‌دونین اصلاح این خطاها چه بلایی سر سایت شما میاره؟ من می‌گم. سایت شما رو به کل دنیای وب، بی اعتبار نشون می‌ده. رتبه سایتتون خراب می‌شه و شما انگار فقط دفتر خاطرات نوشتین نه یه سایت.

معایب استفاده نکردن از دستور DOCTYPE

اولا نتیجه منفی روی اعتبار و رتبه سایت شما می‌ذاره.

دوما از لحاظ نمایش هم که صفحه شما رو در مرورگرهای مختلف، به درستی نشون نمی‌ده.

پس اگه یه روزی متوجه شدین صفحه html شما در مرورگرهای مختلف، رفتار مختلف و نمایش متفاوتی داره بدونین یادتون رفته از تگ DOCTYPE استفاده کنین. اما نحوه استفاده درست از اون چیه؟ جواب این سوال بستگی به این داره که شما از کدوم نسخه اچ تی ام ال می‌خوایین استفاده کنین.

نحوه استفاده از تگ doctype

طرز نوشتن دستور doctype در نسخه‌های مختلف html متفاوته اما به دو دلیل نمی‌خوام درمورد نسخه‌های دیگه حرف بزنم:

دلیل اول: امروزه دیگه همه از نسخه آخر html که همون نسخه ۵ هستش استفاده می‌کنن. چرا؟ فرض کنین الان گوشی آیفون رایگان بود. به هرکی یه آیفون مفت می‌دادن. شما ترجیح می‌دادین یه مدل قدیمیش رو بردارین؟ نه. اچ تی ام ال هم عین آیفون مفت می‌مونه. هیشکی نمیخاد از نسخه قدیمیش استفاده کنه.

دلیل دوم: شما به عنوان کسی که می‌خوایین برنامه نویسی رو شروع کنین باید از نسخه آخر html استفاده کنین.

اما نسخه آخرش تا این تاریخ نسخه پنجمه. HTML5 . در این نسخه هم کافیه دستور زیر رو تایپ کنین:

<!DOCTYPE HTML>

جای تگ DOCTYPE

هرچند تگ doctype جزو تگ‌ها و دستورات html نیست اما هنگام نوشتن صفحات و اسناد html، اولین دستور یا تگی که نوشته می‌شه دستور doctype هست. به عبارتی شما باید همه صفحات اچ تی ام ال خودتون رو با این تگ شروع کنین. همه تگ‌های html بعد از این دستور نوشته می‌شن. پس یادتون نره که سطر اول سند اhtml تون رو به این دستور اختصاص می‌دین.

در زیر نمونه یه صفحه استاندارد اچ تی ام ال آورده شده:

<!DOCTYPE html>
<html>
<head>
<title>عنوان صفحه</title>
</head>

<body>
 اجزای داخلی صفحه html
</body>

</html>

حساسیت دستور DoCtYpE به حروف بزرگ و کوچک

عارضم خدمتتون که تگ DOCTYPE هیچ حساسیتی به حروف بزرگ و کوچیک نداره. یعنی لازم نیست زیاد دقت به خرج بدین و فسفر بسوزونین. خود سایت w3school نوشته که اینجوریا هم می‌تونین از تگ doctype استفاده کنین:

<!DOCTYPE html>

<!DocType html>

<!Doctype html>

<!doctype html>

اما خاطر مبارک باشه که علامت تعجب رو اولش بذارین.

پشتیبانی مرورگر ها از تگ DOCTYPE

نام تگ حمایت کروم از تگ دستور doctype حمایت اکسپلورر از تگ دستور doctype حمایت موزیلا از تگ دستور doctype حمایت سافاری از تگ دستور doctype حمایت اپرا از تگ دستور doctype
DOCTYPE پشتیبانی می کند پشتیبانی می کند پشتیبانی می کند پشتیبانی می کند پشتیبانی می کند

همونطور که مشاهده می‌کنین همه مرورگرهای حال حاضر دنیای اینترنت از دستور doctype حمایت می‌کنن پس می‌تونین با خیال راحت از این تگ استفاده کنین.

در پایان اگه قصد دارین html رو به صورت کامل، جامع و پیشرفته ولی با یک زبان ساده یاد بگیرین، من اثر زیر رو بهتون پیشنهاد می‌کنم:

فیلم آموزش HTML به صورت کامل به مدت زمان ۳ ساعت و ۳۰ دقیقه با انواع مثال‌های عملی و طراحی یک صفحه زیبای html و css

منابع:

https://www.w3schools.com/tags/tag_doctype.asp

https://www.w3.org/QA/2002/04/valid-dtd-list.html

 

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *