Website Simple Form 

ওয়েবসাইটে ফর্মের গুরুত্ব ও ব্যবহার

ফর্ম কী?

ফর্ম হলো একটি ইনপুট ফিল্ডের সমষ্টি যেখানে ব্যবহারকারী নির্দিষ্ট তথ্য লিখে সাবমিট করতে পারে। সাধারণত নাম, ইমেইল, মোবাইল নম্বর, বার্তা বা ফাইল আপলোড করার জন্য ফর্ম ব্যবহার করা হয়। HTML, CSS এবং জাভাস্ক্রিপ্ট ব্যবহার করে একটি ফর্ম তৈরি করা যায়। এছাড়া কন্টাক্ট ফর্মের মাধ্যমে সরাসরি ইমেইল নোটিফিকেশন পাঠানো যায়, যা ব্যবসায়িক ওয়েবসাইটের জন্য খুবই উপকারী।

ওয়েবসাইটে ফর্ম ব্যবহারের সুবিধা

একটি ভালো ফর্মের বৈশিষ্ট্য

<form action="#" method="post">
  <label for="name">Name:</label>
  <input type="text" id="name" name="Enter Your name" required><br><br>
  <label for="email">Email:</label>
  <input type="email" id="email" name="example@email.com" required><br><br>
  <label for="message">Message:</label><br>
  <textarea id="message" name="Enter Your message here..." rows="4" required></textarea><br><br>
  <button type="submit">Submit</button>
</form>
```

<style>

/* Form Container */

form {

  max-width: 400px;

  margin: 50px auto;

  padding: 25px;

  background: #fff;

  border-radius: 10px;

  box-shadow: 0 4px 15px rgba(0,0,0,0.1);

  font-family: Arial, sans-serif;

}

/* Labels */

form label {

  display: block;

  margin-bottom: 5px;

  font-weight: 600;

  color: #333;

}

/* Inputs & Textarea */

form input[type="text"],

form input[type="email"],

form textarea {

  width: 100%;

  padding: 10px 12px;

  margin-bottom: 15px;

  border: 1px solid #ccc;

  border-radius: 6px;

  font-size: 14px;

  box-sizing: border-box;

  transition: border-color 0.3s;

}

/* Focus state */

form input[type="text"]:focus,

form input[type="email"]:focus,

form textarea:focus {

  border-color: #2563eb;

  outline: none;

}

/* Textarea height */

form textarea {

  resize: vertical;

  min-height: 100px;

}

/* Submit Button */

form button[type="submit"] {

  width: 100%;

  padding: 12px;

  background: #2563eb;

  color: white;

  font-size: 16px;

  font-weight: 600;

  border: none;

  border-radius: 6px;

  cursor: pointer;

  transition: background 0.3s;

}

form button[type="submit"]:hover {

  background: #1e4bb8;

}

</style>

এই ফর্ম কোডটি যেকোনো ওয়েবসাইটে ব্যবহার করলে নাম, ইমেইল এবং বার্তা সংগ্রহ করা যাবে।

ব্যবসায়িক ক্ষেত্রে ফর্মের ব্যবহার

উপসংহার