آموزش جامع HTML برای طراحی وب


🎯 اهداف یادگیری

  • درک مفهوم HTML و نقش آن در طراحی وب
  • آشنایی با ساختار پایه یک سند HTML
  • یادگیری تگ‌های اصلی و کاربرد آنها
  • آشنایی با مفاهیم Semantic HTML
  • یادگیری ایجاد فرم‌های ساده

📌 HTML چیست؟

HTML (HyperText Markup Language) زبان استاندارد برای ایجاد صفحات وب است:

HTML یا Hyper Text Markup Language یک زبان نشانه گذاری ابر متنی می باشد HTML عناصر مختلفی ازجمله عنوان ، پاراگراف، عکس و ... را کنار هم قرار می دهد تا چهارچوب اصلی صفحه وب را ایجاد کند. به زبان ساده تر ما با HTML بدنه اصلی صفحه وب را می سازیم.

html
<!DOCTYPE html>
<html dir="rtl" lang="fa">
<head>
<meta charset="UTF-8">
<title>عنوان صفحه</title>
</head>
<body>
<h1>سلام دنیا!</h1>
</body>
</html>
امتحان کنید

ویژگی‌های کلیدی HTML:

  • زبان نشانه‌گذاری: از تگ‌ها برای ساختاردهی محتوا استفاده می‌کند
  • پایه صفحات وب: همراه با CSS و JavaScript سه پایه اصلی وب هستند
  • مستقل از پلتفرم: در تمام دستگاه‌ها و مرورگرها کار می‌کند

📌 تگ‌های اصلی HTML

تگ‌های HTML عناصر سازنده صفحات وب هستند:

html
<h1>عنوان اصلی</h1>
<h2>عنوان فرعی</h2>
<p>این یک پاراگراف نمونه است.</p>
<a href="https://example.com">متن لینک</a>
<img src="image.jpg" alt="توضیح تصویر">

سند زیر یک سند HTML می باشد.

html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>page title</title>
</head>
<body>
<h1>This is a heading</h1>
<p>this is a paragraph</p>
<p>this is a another paragraph</p>
</body>
</html>
امتحان کنید

📌 قدم بعدی

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

در درس بعدی با ساختار پایه یک سند html آشنا خواهیم شد!