آموزش مقدماتی HTML5 | فرم‌ها در HTML

تگ <form> برای ساخت فرم

تگ <form> یکی از عناصر کلیدی در HTML است که برای ایجاد فرم‌ها استفاده می‌شود. فرم‌ها به ما این امکان را می‌دهند که داده‌ها را از کاربران دریافت کنیم و آن‌ها را به سرور ارسال کنیم. این داده‌ها می‌توانند شامل اطلاعات مختلفی مانند نام، ایمیل، نظرات و غیره باشند.

ساختار تگ <form>

تگ <form> می‌تواند ویژگی‌های مختلفی داشته باشد که به ما کمک می‌کند تا نحوه رفتار فرم را کنترل کنیم. دو ویژگی مهم این تگ عبارتند از:

• action: این ویژگی مشخص می‌کند که داده‌های فرم به کجا ارسال شوند. این می‌تواند یک URL باشد که سرور آن را پردازش می‌کند.
• method: این ویژگی تعیین می‌کند که داده‌ها چگونه به سرور ارسال شوند. دو روش متداول عبارتند از:
  • GET: داده‌ها به صورت پارامترهای URL ارسال می‌شوند. این روش معمولاً برای دریافت اطلاعات استفاده می‌شود.
  • POST: داده‌ها به عنوان بخشی از بدنه درخواست HTTP ارسال می‌شوند. این روش معمولاً برای ارسال اطلاعات حساس‌تر یا بزرگ‌تر استفاده می‌شود.

مثال ساده از تگ <form>

در زیر یک مثال ساده از یک فرم HTML آورده شده است:

<form action="submit_form.php" method="post">
    <label for="name">نام:</label>
    <input type="text" id="name" name="name">

    <label for="email">ایمیل:</label>
    <input type="email" id="email" name="email">

    <input type="submit" value="ارسال">
</form>

در این مثال:

• تگ <form> با ویژگی‌های action و method مشخص شده است.
• تگ <label> برای ایجاد برچسب‌هایی برای ورودی‌ها استفاده شده است.
• تگ <input> برای دریافت ورودی‌ها از کاربر استفاده شده است. نوع ورودی‌ها به صورت text و email مشخص شده است.
• در نهایت، یک دکمه ارسال (<input type="submit">) وجود دارد که کاربر می‌تواند با کلیک بر روی آن اطلاعات را ارسال کند.

نکات مهم

• همیشه از تگ <label> برای ورودی‌ها استفاده کنید تا دسترسی‌پذیری فرم بهبود یابد.
• اطمینان حاصل کنید که ویژگی name برای هر ورودی مشخص شده باشد، زیرا این ویژگی برای شناسایی داده‌ها در سرور بسیار مهم است.
• می‌توانید از CSS برای استایل‌دهی به فرم‌ها استفاده کنید تا ظاهر بهتری داشته باشند.

فرم‌ها ابزارهای قدرتمندی برای تعامل با کاربران هستند و با استفاده صحیح از آن‌ها، می‌توانید تجربه کاربری بهتری ایجاد کنید.