আসসালামু আলাইকুম! এইচটিএমএল (HTML) শেখার এই চমৎকার জার্নিতে আপনাকে আরও একবার স্বাগতম। আশা করি আগের তিনটি পর্ব আপনারা খুব ভালোভাবে অনুশীলন করেছেন এবং কোডিং এর বেসিক বিষয়গুলো বুঝতে পেরেছেন। গত পর্বে আমরা আলোচনা করেছিলাম এইচটিএমএল এলিমেন্ট, অ্যাট্রিবিউট এবং একটি ওয়েবসাইটের মূল স্ট্রাকচার নিয়ে। আপনি যদি সেই পর্বটি মিস করে থাকেন, তবে আমি অনুরোধ করব সেটি আগে দেখে নেওয়ার জন্য। কারণ ওয়েব ডেভেলপমেন্টের প্রতিটি ধাপ একটির সাথে আরেকটি দারুণভাবে যুক্ত।
আগের পর্বগুলি যারা এখনো দেখেননি নিচের দেওয়া লিংকে থেকে দেখে নিন।
HTML Tutorial Bangla পর্ব ০১ | HTML Introduction বিস্তারিত শিখুন
HTML Tutorial Bangla পর্ব ০২ – HTML Basic Examples (সহজ বাংলা গাইড)
HTML Tutorial Bangla পর্ব ০৩ | HTML Elements & Attributes
আজকের চার নম্বর পর্বে আমরা এমন একটি বিষয় নিয়ে কথা বলব যা একটি ওয়েবসাইটের প্রাণ বলা চলে। আমরা যখন কোনো বই পড়ি বা খবরের কাগজ খুলি, তখন সবার আগে আমাদের চোখ কোথায় যায়? অবশ্যই বড় বড় অক্ষরে লেখা শিরোনাম বা হেডিংয়ের দিকে। ঠিক তেমনি একটি ওয়েবসাইটকে সুন্দরভাবে সাজাতে এবং তার গুরুত্বপূর্ণ বিষয়গুলোকে ফুটিয়ে তুলতে হেডিং ট্যাগের ভূমিকা অপরিসীম। আজ আমরা এইচটিএমএল হেডিং ট্যাগের (H1 থেকে H6) নাড়িভুঁড়ি সবকিছু একদম সহজ ভাষায়, বাস্তব জীবনের উদাহরণের মাধ্যমে শিখব। খাতা-কলম আর ল্যাপটপ নিয়ে রেডি হয়ে যান, চলুন শুরু করা যাক!
HTML Heading Tags কী?
খুব সহজ ভাষায় বলতে গেলে, একটি ওয়েব পেজে কোনো বড় শিরোনাম বা উপ-শিরোনাম তৈরি করার জন্য যে ট্যাগগুলো ব্যবহার করা হয়, সেগুলোকে HTML Heading Tags বলে। আপনি যখন কোনো আর্টিকেল লেখেন, তখন পুরো লেখার একটি মূল নাম থাকে, তারপর কিছু সাব-সেকশন থাকে। এই পুরো বিন্যাসটি তৈরি করার জন্য এইচটিএমএল আমাদের ছয়টি বিশেষ ট্যাগ উপহার দিয়েছে।
বাস্তব জীবনের একটি উদাহরণ দেওয়া যাক। মনে করুন আপনি একটি দৈনিক খবরের কাগজ পড়ছেন। পত্রিকার একদম ওপরে বড় করে লেখা থাকে মূল খবরটির শিরোনাম। এরপর খবরের ভেতরে ছোট ছোট অংশে আলাদা বিশ্লেষণ দেওয়ার জন্য মাঝারি আকারের শিরোনাম ব্যবহার করা হয়। আবার সেই বিশ্লেষণের ভেতরে যদি কোনো পয়েন্ট থাকে, তবে তা আরও ছোট অক্ষরে লেখা হয়। এইচটিএমএলের হেডিং ট্যাগগুলো ঠিক এই কাজটিই করে। এটি আপনার ওয়েবসাইটের ভিজিটর এবং সার্চ ইঞ্জিন (যেমন গুগল) উভয়কেই বুঝতে সাহায্য করে যে আপনার পেজের কোন অংশটি কতটা গুরুত্বপূর্ণ।
HTML Heading Tags-এর ধরন
এইচটিএমএলে মোট ৬ ধরনের হেডিং ট্যাগ রয়েছে। এগুলো হলো <h1>, <h2>, <h3>, <h4>, <h5> এবং <h6>। এখানে ‘h’ দিয়ে মূলত Heading বোঝানো হয় আর সংখ্যাগুলো দিয়ে তাদের গুরুত্বের স্তর (Importance Level) নির্দেশ করা হয়। মনে রাখবেন, সংখ্যার মান যত ছোট (যেমন ১), সেই হেডিংয়ের গুরুত্ব এবং আকার তত বেশি। আর সংখ্যার মান যত বড় (যেমন ৬), তার গুরুত্ব এবং আকার তত কম। চলুন প্রতিটির বিস্তারিত রূপ দেখে নেওয়া যাক:
১. H1 Tag (সবচেয়ে গুরুত্বপূর্ণ হেডিং)
কাজ: এটি একটি ওয়েব পেজের প্রধান শিরোনাম বা টাইটেল তৈরি করতে ব্যবহৃত হয়।
কখন ব্যবহার করবেন: পুরো আর্টিকেলের মূল বিষয়বস্তু বা একটি ওয়েবসাইটের ল্যান্ডিং পেজের প্রধান স্লোগান লিখতে এটি ব্যবহার করা উচিত।
SEO-তে ভূমিকা: এসইও বা সার্চ ইঞ্জিন অপ্টিমাইজেশনের জন্য H1 ট্যাগ সবচেয়ে শক্তিশালী হাতিয়ার। সার্চ ইঞ্জিনের ক্রলার এই ট্যাগটি দেখেই বোঝে পেজটি মূলত কী নিয়ে লেখা হয়েছে।
কোড উদাহরণ:
<h1>ওয়েব ডেভেলপমেন্ট শিখুন একদম শূন্য থেকে</h1>
ব্রাউজারে যেমন দেখাবে: এটি ব্রাউজারে সবচেয়ে বড় এবং মোটা (Bold) অক্ষরে প্রদর্শিত হবে।
২. H2 Tag (উপ-শিরোনাম)
কাজ: প্রধান শিরোনামের অধীনে থাকা বড় বড় সেকশন বা অধ্যায়গুলোর নাম দিতে এটি ব্যবহৃত হয়।
কখন ব্যবহার করবেন: আপনার আর্টিকেলের প্রধান পয়েন্ট বা মূল উপবিভাগগুলো লেখার সময় এটি ব্যবহার করবেন।
SEO-তে ভূমিকা: H1 এর পর এটি দ্বিতীয় গুরুত্বপূর্ণ ট্যাগ। এটি আর্টিকেলের মূল কাঠামো ফুটিয়ে তোলে।
কোড উদাহরণ:
<h2>এইচটিএমএল হেডিং ট্যাগের প্রকারভেদ</h2>
ব্রাউজারে যেমন দেখাবে: H1 এর চেয়ে আকারে কিছুটা ছোট কিন্তু বেশ স্পষ্ট ও মোটা দেখাবে।
৩. H3 Tag (উপ-সেকশনের ভেতরের শিরোনাম)
কাজ: H2 ট্যাগের অধীনে যদি আরও কোনো সাব-পয়েন্ট থাকে, তবে তা নির্দেশ করতে H3 ব্যবহৃত হয়。
কখন ব্যবহার করবেন: কোনো মূল পয়েন্টের ভেতরে ছোট ছোট উদাহরণ বা ব্যাখ্যা যোগ করার সময়।
SEO-তে ভূমিকা: এটি সার্চ ইঞ্জিনকে আপনার কন্টেন্টের গভীর বিন্যাস বুঝতে সাহায্য করে।
কোড উদাহরণ:
<h3>H3 ট্যাগের বাস্তব উদাহরণ ও ব্যবহার</h3>
ব্রাউজারে যেমন দেখাবে: H2 এর চেয়ে আকারে ছোট কিন্তু সাধারণ টেক্সটের চেয়ে বড় দেখাবে।
৪. H4 Tag (চতুর্থ স্তরের হেডিং)
কাজ: H3 এর ভেতরে আরও ছোট কোনো উপবিভাগ তৈরি করতে এটি ব্যবহৃত হয়।
কখন ব্যবহার করবেন: খুব বড় এবং গবেষণাধর্মী আর্টিকেলে যখন অনেক বেশি সাব-পয়েন্ট থাকে, তখন এর প্রয়োজন হয়। সাধারণ ব্লগে এর ব্যবহার কম।
SEO-তে ভূমিকা: এটি কন্টেন্টের গভীরতা বাড়াতে এবং রিডাবিলিটি উন্নত করতে সাহায্য করে।
কোড উদাহরণ:
<h4>হেডিং ট্যাগের ফন্ট সাইজ পরিবর্তন করার নিয়ম</h4>
ব্রাউজারে যেমন দেখাবে: এটি মাঝারি আকারের টেক্সট হিসেবে দৃশ্যমান হবে।
৫. H5 Tag (পঞ্চম স্তরের হেডিং)
কাজ: H4 ট্যাগের ভেতরের আরও ক্ষুদ্র কোনো পয়েন্টকে হাইলাইট করা।
কখন ব্যবহার করবেন: জটিল ডকুমেন্টেশন বা টেকনিক্যাল গাইডলাইন লেখার সময়।
SEO-তে ভূমিকা: তুলনামূলকভাবে এসইও-তে এর প্রভাব অনেক কম, তবে সাইটের আর্কিটেকচার ঠিক রাখতে এটি কাজ করে।
কোড উদাহরণ:
<h5>ইনলাইন সিএসএস দিয়ে হেডিং স্টাইল</h5>
ব্রাউজারে যেমন দেখাবে: এটি সাধারণ টেক্সটের প্রায় কাছাকাছি আকারের কিন্তু সামান্য বোল্ড দেখাবে।
৬. H6 Tag (সর্বনিম্ন স্তরের হেডিং)
কাজ: এটি এইচটিএমএলের সবচেয়ে ছোট এবং শেষ স্তরের হেডিং ট্যাগ।
কখন ব্যবহার করবেন: অত্যন্ত সুনির্দিষ্ট এবং ছোট কোনো নোট, ফুটনোট বা সাইডবারের একদম ছোট শিরোনামে এটি ব্যবহার করা যেতে পারে।
SEO-তে ভূমিকা: এটি খুব কম ব্যবহৃত হয়, তবে এটি ব্যবহারের মাধ্যমে কোডের নিখুঁত ক্রমানুসরণ বজায় থাকে।
কোড উদাহরণ:
<h6>অতিরিক্ত সতর্কতা এবং নিয়মাবলী</h6>
ব্রাউজারে যেমন দেখাবে: এটি দেখতে সাধারণ টেক্সটের চেয়েও আকারে কিছুটা ছোট হতে পারে, তবে এটি ডিফল্টভাবে বোল্ড থাকে।
H1 Tag কেন সবচেয়ে গুরুত্বপূর্ণ?
অনেকেই মনে করেন সব হেডিং ট্যাগই তো একই রকম, শুধু সাইজ ছোট-বড়। কিন্তু আসলে তা নয়। এর মধ্যে H1 ট্যাগটি হলো একটি পেজের রাজা। সার্চ ইঞ্জিন অপ্টিমাইজেশন বা SEO এর দৃষ্টিকোণ থেকে H1 ট্যাগের গুরুত্ব অপরিসীম। গুগল বা অন্য কোনো সার্চ ইঞ্জিন যখন আপনার সাইটটি স্ক্র্যান করে, তখন তারা সবার আগে H1 ট্যাগের ভেতরের লেখাটি পড়ে। এটি দেখে তারা নিশ্চিত হয় যে আপনার পেজটি মূলত কোন বিষয়ের ওপর তৈরি।
একটি স্ট্যান্ডার্ড এবং প্রফেশনাল ওয়েব পেজে সাধারণত একটি মাত্র H1 ট্যাগ থাকা উচিত। একাধিক H1 ট্যাগ ব্যবহার করলে সার্চ ইঞ্জিন কনফিউজড হয়ে যেতে পারে যে পেজের আসল উদ্দেশ্য কোনটি। যেমন একটি বইয়ের কভার পৃষ্ঠায় বা একটি গল্পের একটিই মূল নাম থাকে, ঠিক তেমনি একটি ওয়েব পেজেও একটিই H1 থাকা বাঞ্ছনীয়। এটি আপনার ওয়েবসাইটের র্যাংকিং বাড়াতে সরাসরি সাহায্য করে।
H2 ও H3 Tag কোথায় ব্যবহার হয়?
চলুন একটি বাস্তব ব্লগ পোস্টের কাঠামোর মাধ্যমে বিষয়টি সহজ করে নেওয়া যাক। মনে করুন আপনি “বাংলাদেশের পর্যটন কেন্দ্র” নিয়ে একটি বড় ব্লগ পোস্ট লিখছেন। তাহলে আপনার লেখার গঠন কেমন হবে?
- H1: বাংলাদেশের সেরা দর্শনীয় স্থানসমূহ (পুরো আর্টিকেলের মূল নাম)
- H2: কক্সবাজার সমুদ্র সৈকত (একটি প্রধান সেকশন)
- H3: ইনানী বিচ (কক্সবাজারের ভেতরের একটি স্পট)
- H3: হিমছড়ি ঝরনা (কক্সবাজারের ভেতরের আরেকটি স্পট)
- H2: সিলেট অঞ্চলের রূপকথা (আরেকটি প্রধান সেকশন)
- H3: জাফলং (সিলেটের ভেতরের স্পট)
- H3: রাতারগুল সোয়াম্প ফরেস্ট (সিলেটের ভেতরের আরেকটি স্পট)
উপরের উদাহরণটি লক্ষ্য করলে বুঝতে পারবেন কীভাবে H2 এবং H3 ট্যাগগুলো একটি বড় লেখাকে ছোট ছোট অংশে ভাগ করে পড়ার উপযোগী করে তুলেছে। এর ফলে পাঠকদের পড়তে আরাম হয় এবং তারা সহজেই তাদের প্রয়োজনীয় তথ্যটি খুঁজে পায়।
Heading Hierarchy (হেডিংয়ের ক্রমানুসরণ)
ওয়েব ডিজাইনে হেডিংয়ের ক্রমানুসরণ বা Hierarchy বজায় রাখা অত্যন্ত গুরুত্বপূর্ণ। আপনি হুট করে H1 এর পর H4 ব্যবহার করতে পারেন না। এটি একটি নির্দিষ্ট নিয়ম মেনে নিচে নেমে আসে। নিচের চার্টটি লক্ষ্য করুন:
H1
├── H2
│ ├── H3
│ ├── H3
├── H2
│ ├── H3
│ ├── H4
সঠিক Hierarchy কেন গুরুত্বপূর্ণ? প্রথমত, এটি আপনার ওয়েবসাইটের কোডকে প্রফেশনাল ও ক্লিন রাখে। দ্বিতীয়ত, যারা চোখে কম দেখেন বা বিশেষ সফটওয়্যার (Screen Reader) ব্যবহার করে ওয়েবসাইট শোনেন, তাদের সেই সফটওয়্যারগুলো এই হেডিংয়ের সিরিয়াল দেখেই পুরো পেজটি পড়ে শোনায়। তাই লজিক্যাল স্ট্রাকচার মেইনটেইন করা একটি ভালো অভ্যাসের লক্ষণ।
বাস্তব জীবনের ৫টি কোড উদাহরণ
নতুন শিক্ষার্থীদের সুবিধার্থে নিচে ৫টি ভিন্ন ধরনের ওয়েবসাইটের জন্য প্রফেশনাল হেডিং স্ট্রাকচারের কোড দেওয়া হলো। এগুলো সম্পূর্ণ এনকোড করা হয়েছে যেন আপনার এডিটরে কোনো সমস্যা না হয়:
১. ব্লগ আর্টিকেলের উদাহরণ (Blog Article)
<h1>সুস্থ থাকার ১০টি সহজ উপায়</h1>
<h2>১. প্রতিদিন সুষম খাদ্য গ্রহণ</h2>
<h3>সবুজ শাকসবজির উপকারিতা</h3>
<h2>২. পর্যাপ্ত ঘুমানো</h2>
ব্যাখ্যা: এখানে মূল আর্টিকেলের নামের জন্য H1, প্রধান দুটি নিয়মের জন্য H2 এবং খাদ্যের ভেতরের বিষয়ের জন্য H3 ব্যবহার করা হয়েছে।
২. নিউজ ওয়েবসাইটের উদাহরণ (News Website)
<h1>বাজেট ২০২৬: শিক্ষা খাতে বরাদ্দ বাড়ল</h1>
<h2>প্রাথমিক ও গণশিক্ষা মন্ত্রণালয়ের প্রতিক্রিয়া</h2>
<h3>নতুন শিক্ষকদের প্রশিক্ষণ প্রজেক্ট</h3>
ব্যাখ্যা: এটি একটি ব্রেকিং নিউজের কাঠামো। প্রধান খবরের শিরোনাম H1 এ এবং বাকি বিশ্লেষণগুলো H2 ও H3 তে সাজানো হয়েছে।
৩. পোর্টফোলিও ওয়েবসাইটের উদাহরণ (Portfolio)
<h1>হ্যালো, আমি এস এ সামিম – একজন ওয়েব ডেভেলপার</h1>
<h2>আমার সেবাসমূহ</h2>
<h3>ওয়ার্ডপ্রেস থিম কাস্টমাইজেশন</h3>
<h2>আমার সাম্প্রতিক প্রজেক্টস</h2>
ব্যাখ্যা: নিজের পরিচিতি দেওয়ার জন্য H1 এবং নিজের কাজের সার্ভিস ও প্রজেক্ট সেকশন ভাগ করার জন্য H2 ব্যবহার করা হয়েছে।
৪. স্কুলের ওয়েবসাইটের উদাহরণ (School Website)
<h1>ঢাকা মডেল হাই স্কুল</h1>
<h2>আমাদের একাডেমিক কার্যক্রম</h2>
<h3>বিজ্ঞান বিভাগ</h3>
<h3>ব্যবসায় শিক্ষা বিভাগ</h3>
ব্যাখ্যা: স্কুলের নাম প্রধান হেডিংয়ে রেখে বিভিন্ন ডিপার্টমেন্ট বা বিভাগগুলোকে সাব-হেডিংয়ের মাধ্যমে সুন্দরভাবে ফুটিয়ে তোলা হয়েছে।
৫. বিজনেস ওয়েবসাইটের উদাহরণ (Business Website)
<h1>আপনার ব্যবসার জন্য সেরা ডিজিটাল মার্কেটিং সলিউশন</h1>
<h2>কেন আমাদের বেছে নেবেন?</h2>
<h3>দক্ষ ও অভিজ্ঞ টিম</h3>
<h3>২৪/৭ কাস্টমার সাপোর্ট</h3>
ব্যাখ্যা: ব্যবসার মূল স্লোগানকে H1 এবং কোম্পানির বৈশিষ্ট্যগুলোকে H2 ও H3 দিয়ে প্রফেশনাল লুক দেওয়া হয়েছে।
নতুনরা সচরাচর যে ভুল করে
নতুন অবস্থায় কোডিং করার সময় কিছু ভুল হওয়া খুবই স্বাভাবিক। তবে আগে থেকে জেনে রাখলে এই ভুলগুলো এড়ানো সম্ভব। চলুন দেখে নিই নতুনরা কী কী ভুল করে এবং তার সমাধান কী:
১. সব জায়গায় H1 ব্যবহার করা: অনেকে মনে করেন পেজের সব লেখাই বড় দেখানো দরকার, তাই তারা একাধিক H1 ব্যবহার করে বসেন। এটি এসইও-র জন্য মারাত্মক ক্ষতিকর। সমাধান হলো—পুরো পেজে কেবল একটিই H1 ব্যবহার করবেন।
২. সিরিয়াল বা Hierarchy বাদ দেওয়া: H1 এর পরেই হঠাৎ করে H4 বা H5 ব্যবহার করা একটি বড় ভুল। সমাধান—সবসময় ক্রমানুসারে (<h1> -> <h2> -> <h3>) কোড লিখবেন।
৩. শুধু ফন্ট বড় করার জন্য হেডিং ব্যবহার করা: কোনো সাধারণ প্যারাগ্রাফের ফন্ট সাইজ বড় দেখানোর জন্য অনেকেই হেডিং ট্যাগ ব্যবহার করেন, যা একদমই অনুচিত। সমাধান—লেখার সাইজ বড় করতে চাইলে CSS ব্যবহার করুন, হেডিং ট্যাগ নয়।
৪. হেডিংয়ের পরিবর্তে বোল্ড ব্যবহার করা: কোনো শিরোনামকে হেডিং ট্যাগ না দিয়ে শুধু বোল্ড (<strong>) করে দিলে তা সার্চ ইঞ্জিন বুঝতে পারে না। সমাধান—শিরোনামের ক্ষেত্রে অবশ্যই নির্দিষ্ট হেডিং ট্যাগ ব্যবহার করুন।
মনে রাখবেন: Heading Tag শুধু লেখাকে বড় করার জন্য নয়; এটি একটি Web Page-এর গঠন এবং বিষয়বস্তু বোঝাতে ব্যবহৃত হয়।
Best Practices (প্রফেশনাল নিয়মাবলী)
- একটি ওয়েব পেজে সর্বদা একটি মাত্র মূল H1 ট্যাগ ব্যবহার নিশ্চিত করুন।
- হেডিংয়ের মধ্যে আপনার আর্টিকেলের মূল কিওয়ার্ডগুলো প্রাকৃতিকভাবে (Naturally) ব্যবহার করার চেষ্টা করুন, এতে গুগল র্যাংকিংয়ে সুবিধা পাবেন।
- ভিজিটরদের পড়ার সুবিধার্থে (Readability) প্রতিটি বড় হেডিংয়ের পর পর্যাপ্ত ফাঁকা জায়গা ও প্যারাগ্রাফ রাখুন।
- অ্যাক্সেসিবিলিটি (Accessibility) নিশ্চিত করতে হেডিং টেক্সটগুলো যেন স্পষ্ট এবং অর্থপূর্ণ হয় সেদিকে খেয়াল রাখুন।
Comparison Table (হেডিং ট্যাগ সমূহের তুলনা)
| Heading Tag | প্রধান ব্যবহার | SEO গুরুত্ব |
|---|---|---|
| <h1> | ওয়েব পেজের মূল শিরোনাম বা নাম | সর্বোচ্চ (Critical) |
| <h2> | প্রধান উপবিভাগ বা সেকশনের নাম | অনেক বেশি (High) |
| <h3> | H2 এর অভ্যন্তরীণ সাব-সেকশন | মাঝারি (Medium) |
| <h4> | H3 এর ভেতরের গভীর পয়েন্ট | স্বল্প (Low) |
| <h5> | বিশেষ টেকনিক্যাল গাইড বা সাব-পয়েন্ট | খুবই কম (Very Low) |
| <h6> | ফুটনোট বা সর্বনিম্ন গুরুত্বের শিরোনাম | নগণ্য (Minimal) |
সারসংক্ষেপ
আজকের পর্বে আমরা শিখলাম এইচটিএমএল হেডিং ট্যাগ কী এবং কেন এটি ব্যবহার করা হয়। আমরা জানলাম H1 থেকে H6 পর্যন্ত মোট ছয়টি হেডিং ট্যাগ রয়েছে এবং এদের সঠিক ক্রমানুসরণ (Hierarchy) বজায় রাখা কতটা জরুরি। এছাড়া এসইও-তে H1 ট্যাগের বিশেষ গুরুত্ব এবং নতুনদের কিছু কমন ভুল নিয়ে আমরা বিস্তারিত আলোচনা করেছি। আশা করি হেডিং ট্যাগ নিয়ে আপনাদের মনে আর কোনো দ্বিধা নেই।
সাধারণ জিজ্ঞাসা
১. আমি কি একটি পেজে দুটি H1 ট্যাগ ব্যবহার করতে পারি?
উত্তর: প্রযুক্তিগতভাবে ব্রাউজারে কোনো সমস্যা হবে না, তবে প্রফেশনাল কোডিং এবং এসইও এর নিয়ম অনুযায়ী একটি পেজে একটিই H1 ব্যবহার করা উচিত।
২. H1 এবং H6 এর মধ্যে মূল পার্থক্য কী?
উত্তর: H1 হলো সবচেয়ে বড় এবং সবচেয়ে গুরুত্বপূর্ণ হেডিং, আর H6 হলো সবচেয়ে ছোট এবং সর্বনিম্ন গুরুত্বের হেডিং।
৩. হেডিং ট্যাগের টেক্সটের কালার কি পরিবর্তন করা যায়?
উত্তর: হ্যাঁ, এইচটিএমএল হেডিংয়ের কালার, ফন্ট স্টাইল বা সাইজ পরিবর্তন করার জন্য সিএসএস (CSS) ব্যবহার করতে হয়।
৪. সার্চ ইঞ্জিন কি হেডিং ট্যাগ দেখে সাইট র্যাংক করে?
উত্তর: হ্যাঁ, গুগল বা অন্যান্য সার্চ ইঞ্জিন হেডিং ট্যাগের কিওয়ার্ড এবং এর সঠিক বিন্যাস দেখে পেজের কোয়ালিটি বিচার করে।
৫. আমি কি হেডিং ট্যাগের ভেতরে অন্য কোনো ট্যাগ ব্যবহার করতে পারি?
উত্তর: হ্যাঁ, প্রয়োজন বোধে হেডিং ট্যাগের ভেতরে লিংক ট্যাগ বা ইতালিক ট্যাগ ব্যবহার করা যায়।
৬. হেডিং ট্যাগ ব্যবহার না করে শুধু CSS দিয়ে বড় করলে কি কোনো সমস্যা আছে?
উত্তর: দেখতে বড় হলেও সার্চ ইঞ্জিন বা স্ক্রিন রিডার সেটিকে শিরোনাম হিসেবে চিনবে না, ফলে আপনার ওয়েবসাইটের এসইও স্কোর কমে যাবে।
৭. H2 এর পর সরাসরি H4 ব্যবহার করলে কী হবে?
উত্তর: এটি কোডের ধারাবাহিকতা বা স্ট্রাকচার নষ্ট করে, যা প্রফেশনাল ওয়েব ডেভেলপমেন্টের পরিপন্থী।
৮. কোন হেডিং ট্যাগটি সবচেয়ে বেশি ব্যবহৃত হয়?
উত্তর: সাধারণত একটি পেজে H1 একবার এবং H2 ও H3 ট্যাগগুলো কন্টেন্টের গভীরতার ওপর ভিত্তি করে সবচেয়ে বেশি ব্যবহৃত হয়।
References (বিশ্বস্ত উৎস)
- W3Schools – HTML Headings
- MDN Web Docs – HTML sections and headings
- WHATWG HTML Living Standard – The h1, h2, h3, h4, h5, and h6 elements
আজকের পর্বটি আপনার কেমন লেগেছে তা কমেন্ট করে আমাদের জানাতে ভুলবেন না। কোনো অংশে বুঝতে সমস্যা হলে অবশ্যই প্রশ্ন করবেন, আমি উত্তর দেওয়ার চেষ্টা করব। আগামী পর্বে আমরা এইচটিএমএল প্যারাগ্রাফ এবং টেক্সট ফরম্যাটিং নিয়ে আলোচনা করব। সে পর্যন্ত সবাই ভালো থাকুন, সুস্থ থাকুন আর নিয়মিত প্র্যাকটিস করতে থাকুন। ধন্যবাদ!
