ساختار کلی یک سند HTML
ترکیب مناسب المان های مختلف HTML در کنار یکدیگر یک صفحه HTML را به وجود می‌آورد. در این قسمت از مجموعه آموزشی HTML با ساختار کلی یک سند اچ‌تی‌ام‌ال که در قسمت قبل مشاهده کردید بیشتر آشنا می‌شوید.
بخش‌های تشکیل دهنده یک سند HTML
در قطعه کد HTML زیر می‌توانید نمونه یک سند اچ‌تی‌ام‌ال ساده و ساختار آن را مشاهده کنید.
<!DOCTYPE html>
<html>
<head>
<title>Hello World!</title>
<meta charset="utf-8">
</head>
<body>
<p>Hello World!</p>
</body>
</html>جزئیات اجزای تشکیل دهنده سند
اجزای تشکیل دهنده سند فوق عبارتند از:
<!DOCTYPE html>: این اظهاریه (یا Declaration)، نوع سند (یا Document type) را مشخص می‌کند و به مرورگرها در نمایش صحیح صفحه‌های وب کمک می‌کند. به عبارت بهتر این عبارت به مرورگر اعلام می‌کند چگونه می‌بایست سند را تفسیر کند.
اظهاریه نوع سند برای HTML5 به صورت <!DOCTYPE html> مشخص می‌شود. اما برای اسناد قدیمی‌تر از اظهاریه‌های طولانی‌تری استفاده می‌شود. به عنوان مثال برای HTML 4.01 از اظهاریه نوع سند زیر استفاده می‌شود:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"><html></html>: المان <html> المان ریشه‌ای (Root element) در صفحه‌های HTML است. به عبارت بهتر این المان تمام محتوا و المان‌های دیگر صفحه را دربرمی‌گیرد.
<head></head>: المان <head> محتواهای غیرنمایشی صفحه را شامل می‌شود (مانند اطلاعاتی پیرامون صفحه). عنوان صفحه، توصیف صفحه (که در نتایج موتورهای جستجو نمایش داده می‌شود) و انواع متادیتاهای دیگر، استایل های داخلی یا ارجاع به استایل های خارجی CSS و … از جمله مواردی هستند که در این بخش قرار می‌گیرد.
<body></body>: المان <body> بدنه سند را مشخص می‌کند. تمام محتواهایی که در صفحه نمایش داده می‌شود شامل عناوین، پاراگراف‌ها، تصاویر، پیوندها و … داخل این المان قرار می‌گیرند.
<title></title>: المان <title> عنوان صفحه را مشخص می‌کند. این عنوان روی زبانه یا نوار عنوان مرورگر نمایش داده می‌شود.
<meta charset=”utf-8″>: این المان مجموعه کاراکتر یا نویسه (Character set) سند را به UTF-8 تنظیم می‌کند. این مجموعه از کاراکترهای موجود در بسیاری از زبان‌های بشری پشتیبانی می‌کند و درنتیجه امکان نمایش نوشته‌هایی به زبان‌های مختلف را در صفحه وب فراهم می‌کند. این المان از جمله المان های خالیست و تنها شامل تگ شروع است.
همانطور که می‌بینید دو المان فوق داخل المان <head> قرار گرفته‌اند و بنابراین جزء محتوای آشکار صفحه نیستند.
<p></p>: المان <p> یک پاراگراف یا بند را تعریف می‌کند. با توجه به اینکه پاراگراف ها از جمله محتواهای قابل مشاهده در صفحه هستند این المان داخل المان <body> قرار گرفته است.
