HTML <article> এলিমেন্ট কীভাবে ব্যবহার করবেন তা শিখুন।
HTML <article> ট্যাগ সেলফ-কন্টেইনড কন্টেন্টের জন্য আর্টিকেল এলিমেন্ট ডিফাইন করতে ব্যবহৃত হয়। সেলফ-কন্টেইনড মানে আর্টিকেল এলিমেন্টের ভিতরে যে কন্টেন্ট রাখবেন সেটি আপনার ওয়েবসাইটের বাকি অংশ থেকে স্বাধীনভাবে কাজ করা উচিত।
HTML <article> ট্যাগ কীভাবে ব্যবহার করবেন
<article> ট্যাগের ব্যবহারের ক্ষেত্র:
- ব্লগ
- ম্যাগাজিন
- নিউজ সাইট
<main> এলিমেন্টের মতো যা একটি কন্টেন্ট কন্টেইনার, <article> ট্যাগ একই HTML ডকুমেন্টে একবার বা একাধিকবার ব্যবহার করা যায়।
উদাহরণস্বরূপ, আর্টিকেল/পোস্টের জন্য একটি সিঙ্গেল <article> এলিমেন্ট মেইন পেজ কন্টেইনার হিসেবে ব্যবহার করা যায়:
<article> <h1>আপনার পোস্টের টাইটেল</h1> <p>প্যারাগ্রাফ</p> <p>প্যারাগ্রাফ</p> <img href="your-image.jpg" alt="ছবির বর্ণনা" /> <p>প্যারাগ্রাফ</p> <p>প্যারাগ্রাফ</p> </article>
আপনি যে ওয়েবসাইট পড়ছেন সেটিও সাদৃশ্য HTML মার্কআপ স্ট্রাকচার ফলো করে। রাইট-ক্লিক করে Inspect ক্লিক করলে নিজে দেখতে পাবেন।
<article> এলিমেন্টটি বিভিন্ন কন্টেন্টের লিস্ট দেখানোর জন্যও ব্যবহার করা যায়, প্রতিটা নিজস্ব আর্টিকেল এলিমেন্টের ভিতরে। উদাহরণস্বরূপ, אינডিভিজুয়াল পোস্টের লিংক সহ আর্টিকেল ফিড:
<div> <article> <a href="/path-to-blog-post-1"> <h3>ব্লগ পোস্ট ১</h3> </a> </article> <article> <a href="/path-to-blog-post-2"> <h3>ব্লগ পোস্ট ২</h3> </a> </article> <article> <a href="/path-to-blog-post-3"> <h3>ব্লগ পোস্ট ৩</h3> </a> </article> </div>
উপরের তিনটি আর্টিকেল ব্রাউজার দ্বারা স্বতন্ত্র, সেলফ-কন্টেইনড কন্টেন্ট হিসেবে পড়া হয়।
<article> ট্যাগ কন্টেইনার এলিমেন্ট ডিফাইন করার জন্য ব্যবহৃত অনেক HTML ট্যাগের একটি। সবচেয়ে কমন ব্যবহৃত HTML কন্টেইনার এলিমেন্টগুলো হচ্ছে:
<section>, <main> , <header>, <footer>,<form>, এবং <div> (যেটি একটি জেনেরিক ট্যাগ যা আমরা ব্যবহার করি যদি অন্য ট্যাগগুলো প্রযোজ্য না হয়)।