ساختار کلی یک فایل HTML
یک فایل HTML شامل مجموعهای از تگهای استاندارد است که به مرورگر کمک میکند محتوای صفحه را نمایش دهد. ساختار کلی یک فایل HTML به شکل زیر است:
<!DOCTYPE html>
<html lang="fa">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>عنوان صفحه</title>
</head>
<body>
<h1>سلام دنیا!</h1>
<p>این یک مثال از ساختار پایهای HTML است.</p>
</body>
</html>
<html lang="fa">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>عنوان صفحه</title>
</head>
<body>
<h1>سلام دنیا!</h1>
<p>این یک مثال از ساختار پایهای HTML است.</p>
</body>
</html>
توضیح اجزای اصلی فایل HTML:
-
<!DOCTYPE html>
- مشخص میکند که این فایل از استاندارد HTML5 استفاده میکند.
-
<html lang="fa">
- تگ اصلی که تمامی محتوای صفحه را در بر میگیرد.
- مقدار lang="fa" نشان میدهد که زبان صفحه فارسی است.
-
<html lang="fa">
- شامل اطلاعات متا (metadata) مربوط به صفحه است.
-
<html lang="fa">
- تعیین میکند که صفحه از UTF-8 برای نمایش کاراکترها (مانند فارسی) استفاده کند.
-
<html lang="fa">
- باعث میشود صفحه در دستگاههای مختلف (مانند موبایل و تبلت) به درستی نمایش داده شود.
-
<html lang="fa">
- عنوان صفحه که در نوار مرورگر نمایش داده میشود.
-
<html lang="fa">
- بخش اصلی صفحه که محتوای نمایشی مانند متن، تصاویر، لینکها و دکمهها در آن قرار میگیرد.
نمونهای از یک صفحه کامل با چند عنصر اضافی:
<!DOCTYPE html>
<html lang="fa">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>صفحه نمونه</title>
</head>
<body>
<header>
<h1>به سایت ما خوش آمدید</h1>
</header>
<nav>
<ul>
<li><a href="#">خانه</a></li>
<li><a href="#">درباره ما</a></li>
<li><a href="#">تماس با ما</a></li>
</ul>
</nav>
<section>
<p>این یک بخش از محتوای صفحه است.</p>
<img src="image.jpg" alt="تصویر نمونه">
</section>
<footer>
<p>تمامی حقوق محفوظ است © 2025</p>
</footer>
</body>
</html>
<html lang="fa">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>صفحه نمونه</title>
</head>
<body>
<header>
<h1>به سایت ما خوش آمدید</h1>
</header>
<nav>
<ul>
<li><a href="#">خانه</a></li>
<li><a href="#">درباره ما</a></li>
<li><a href="#">تماس با ما</a></li>
</ul>
</nav>
<section>
<p>این یک بخش از محتوای صفحه است.</p>
<img src="image.jpg" alt="تصویر نمونه">
</section>
<footer>
<p>تمامی حقوق محفوظ است © 2025</p>
</footer>
</body>
</html>
نتیجه: این ساختار یک صفحه استاندارد HTML را نشان میدهد که از بخشهای اصلی مانند هدر، ناوبری، محتوا و فوتر تشکیل شده است.
