در حال بارگذاری...

آموزش کامل HTML

از مفاهیم پایه تا تکنیک‌های پیشرفته، همه چیز را درباره زبان HTML بیاموزید.

HTML چیست؟

HTML مخفف HyperText Markup Language است و زبان اصلی برای ساخت صفحات وب محسوب می‌شود. این زبان توسط Tim Berners-Lee در سال ۱۹۹۱ اختراع شد و از آن زمان تاکنون به عنوان ستون فقرات وب شناخته می‌شود.

چرا HTML مهم است؟
HTML به مرورگرها می‌گوید که چگونه محتوای یک صفحه را نمایش دهند. بدون HTML، وب‌سایت‌ها فقط متن‌های ساده و بدون ساختار بودند. HTML به ما امکان می‌دهد تا تیترها، پاراگراف‌ها، تصاویر، ویدئوها، فرم‌ها و لینک‌ها را به صفحات وب اضافه کنیم.

هر صفحه وب از یک ساختار سلسله‌مراتبی تشکیل شده است که با استفاده از تگ‌ها (Tags) مشخص می‌شود. تگ‌ها با علامت < > مشخص می‌شوند و به دو دسته تگ‌های باز و بسته تقسیم می‌شوند.

ساختار یک صفحه HTML

یک صفحه HTML استاندارد از بخش‌های زیر تشکیل شده است:

  • <!DOCTYPE html> — اعلام نوع سند
  • <html> — ریشه صفحه
  • <head> — اطلاعات متا و استایل‌ها
  • <body> — محتوای قابل مشاهده
ساختار پایه HTML 
<!DOCTYPE html>
<html lang="fa" dir="rtl">
    <head>
        <meta charset="UTF-8">
        <title>عنوان صفحه</title>
    </head>
    <body>
        <!-- محتوای صفحه در اینجا قرار می‌گیرد -->
        <h1>سلام دنیا!</h1>
        <p>این یک پاراگراف است.</p>
    </body>
</html>

تگ‌های پرکاربرد HTML

در اینجا مهم‌ترین تگ‌های HTML را به همراه توضیح مختصر و مثال آورده‌ام:

تگ توضیح مثال
<h1> تا <h6> تیترها (از بزرگترین تا کوچکترین) <h1>تیتر اصلی</h1>
<p> پاراگراف <p>متن پاراگراف</p>
<a> لینک (پیوند) <a href="https://google.com">گوگل</a>
<img> تصویر <img src="image.jpg" alt="توضیح">
<ul> و <ol> لیست‌های بدون ترتیب و با ترتیب <ul><li>مورد ۱</li></ul>
<table> جدول <table><tr><td>داده</td></tr></table>
<form> فرم <form><input type="text"></form>
<div> بلاک (برای گروه‌بندی) <div>محتوا</div>
<span> عنصر درون‌خطی <span>متن</span>

فرم‌ها در HTML

فرم‌ها به کاربران امکان می‌دهند تا اطلاعات خود را وارد کنند. مهم‌ترین تگ‌های فرم عبارتند از:

  • <form> — شروع و پایان فرم
  • <input> — فیلدهای ورودی (متن، رمز، چک‌باکس و ...)
  • <textarea> — فیلد متن چندخطی
  • <select> — منوی کشویی
  • <button> — دکمه
مثال یک فرم ساده 
<form action="submit.php" method="POST">
    <label>نام:</label>
    <input type="text" name="name">
    
    <label>ایمیل:</label>
    <input type="email" name="email">
    
    <button type="submit">ارسال</button>
</form>

سوالات متداول HTML

آیا HTML یک زبان برنامه‌نویسی است؟
خیر، HTML یک زبان نشانه‌گذاری (Markup Language) است و برای ساختاردهی محتوا استفاده می‌شود، نه برای منطق برنامه‌نویسی.
تفاوت HTML و HTML5 چیست؟
HTML5 نسخه جدیدتر HTML است که تگ‌های جدیدی مانند <header>، <footer> و <video> را معرفی کرده و امکانات بیشتری برای طراحی وب فراهم می‌کند.
آیا برای یادگیری HTML نیاز به دانش قبلی دارم؟
خیر، HTML یکی از ساده‌ترین زبان‌ها برای شروع است. اگر با کامپیوتر آشنا باشید، می‌توانید به راحتی HTML را یاد بگیرید.
چقدر زمان برای یادگیری HTML نیاز است؟
با مطالعه منظم، می‌توانید مفاهیم پایه HTML را در حدود ۱ تا ۲ هفته یاد بگیرید و یک صفحه وب ساده بسازید.