কম্পিউটার টিউটোরিয়াল

HTML এলিমেন্ট ব্যবহার: SEO, Viewport, Robots ট্যাগ গাইড

HTML <meta> এলিমেন্ট ব্যবহার শিখুন।

<meta> এলিমেন্ট HTML ডকুমেন্টের সম্পর্কে বিভিন্ন ধরনের মেটাডেটা ডিফাইন করতে ব্যবহৃত হয়। মেটাডেটা মানে তথ্য। বা আরও স্পষ্টভাবে, মেটাডেটা হলো ডেটা যা অন্য ডেটা বর্ণনা করে এবং তার সম্পর্কে তথ্য দেয়।

<meta> এলিমেন্টের অনেক অ্যাট্রিবিউট এবং ভ্যালু রয়েছে।

name অ্যাট্রিবিউট সবচেয়ে গুরুত্বপূর্ণ موارد এক।

name چندین মান নেয়। উদাহরণস্বরূপ description, যা content অ্যাট্রিবিউটের সাথে মিলিয়ে একটি পেজ বর্ণনা করতে ব্যবহৃত হয়:

<head>
  <meta name="description" content="Learn about the HTML meta element" />
</head>

<meta> এলিমেন্টগুলো শুধু <head> এলিমেন্টের ভিতরে থাকে।

মেটাডেটা আপনার ওয়েব পেজে দৃশ্যমান নয় কিন্তু মেশিনগুলো (সার্ভার, ব্রাউজার, সার্চ ইঞ্জিন) দ্বারা পার্স (পড়া) ও প্রসেস করা হয়।

এটি <meta> এলিমেন্টকে SEO-এর জন্য সবচেয়ে গুরুত্বপূর্ণ HTML এলিমেন্টের একটি করে তোলে, কারণ এটি গুগল যেন সার্চ ইঞ্জিনকে আপনার ওয়েবসাইটের কন্টেন্ট ছাড়া অতিরিক্ত ডেটা দেয় যা তাদের বলে আপনার ওয়েবসাইট কী সম্পর্কে এবং মানুষ কী সার্চ করছে তার সাথে কতটুকু রিলেভেন্ট।

মেটা description কখনও কখনও সার্চ ইঞ্জিন দ্বারা ব্যবহার হয় SERPs (Search Engine Results Pages)-এ আপনার ওয়েবসাইটের পেজ ডেসক্রিপশন জেনারেট করতে, যদি সেটি আপনার অন-পেজ কন্টেন্টের চেয়ে ভালো পায়।

ভিউপোর্ট ট্যাগ

viewport মেটা ট্যাগ নন-মোবাইল-ফ্রেন্ডলি ওয়েবসাইটকে ছোট স্ক্রিনে ভালো দেখাতে সাহায্য করে। নিচের ভিউপোর্ট ট্যাগ কনফিগারেশন মোবাইল-এর জন্য অপ্টিমাইজড এবং ডিফল্টভাবে ব্যবহার করা উচিত যদি না আপনার—Noindex, nofollow আপনার পুরো ওয়েবসাইটে গ্লোবালি প্রয়োগ করলে SEO আহত হবে। আপনি কখনও কখনও এটা চাইবেন না।

একটি সাধারণ ইউজ কেস noindex-এর জন্য: আপনার ওয়েবসাইট এখনও ডেভেলপমেন্টে আছে, এবং পাবলিকের জন্য প্রস্তুত নয়। WordPress-এ পেজ ইন্ডেক্সিং অস্থায়ীভাবে ডিজেবল (nofollow) করার অপশন রয়েছে।

এবং লিংকের জন্য, nofollow গ্লোবালি (সব লিংকে) প্রয়োগ করার বদলে, আরও প্র্যাক্টিক্যাল ইউজ কেস: নির্দিষ্ট আউটবাউন্ড (এক্সটার্নাল) লিংকে nofollow ব্যবহার করা, যেমন পেইড লিংকে, যেগুলো সার্চ ইঞ্জিন দ্বারা ফলো করা উচিত নয়। আপনি সেটি সরাসরি অ্যাঙ্কর এলিমেন্টে করবেন:

<a href="#" rel="nofollow">Click to see our sponsor</a>

ডিফল্টভাবে, হাইপারলিংকগুলো follow সেট থাকে।

  1. HTML পেজে href অ্যাট্রিবিউট ব্যবহার করা

  2. HTML পেজে title ট্যাগ ব্যবহার করা

  3. HTML পেজে অ্যানিমেটেড ইমেজ (Animated Image) ব্যবহার করা

  4. HTML-এ required অ্যাট্রিবিউট কীভাবে ব্যবহার করবেন?