বোল্ড (বা বোল্ডফেস) টাইপোগ্রাফিতে একটি স্ট্রং টাইপের এমফেসিস হিসেবে বিবেচিত হয়। আধুনিক HTML-এ দুটি HTML এলিমেন্ট আছে যা ডিফল্টভাবে বোল্ড ফন্ট-ওয়েইট (একেও "বোল্ডফেস" বলা হয়) একটি টেক্সট এলিমেন্টে প্রয়োগ করে (বেশিরাগ ব্রাউজারে)।
আপনি অথবা <strong> ট্যাগ বা <b> ট্যাগ ব্যবহার করতে পারেন, এভাবে:
<p>The strong tag is used to <strong>emphasize</strong> text.</p> <p>The b tag is used to <b>emphasize</b> text.</p>আধুনিক HTML (HTML5)-এ, <strong> এবং <b> উভয়েই সিম্যান্টিক এবং বৈধ মনে হয়। যদিও আধুনিক ব্রাউজারে উভয়েরই একই বোল্ডফেস প্রেজেন্টেশনাল স্টাইলিং হয়, তবুও তাদের অর্থ বা উদ্দেশ্য এক নয়।
তাহলে strong এবং b-র মধ্যে পার্থক্য কী, এবং কোনটি কিসের জন্য ব্যবহার করা উচিত?
<strong>এলিমেন্টটি গুরুত্বপূর্ণ কন্টেন্টের জন্য ব্যবহৃত হয় (যেমন সতর্কতা)।<b>এলিমেন্টটি গমনাকর্ষণ করার জন্য ব্যবহৃত হয়, গুরুত্ব সাজেস্ট না করে।
<b> ব্যবহারের উদাহরণ:
The Spanish word <b>idioma</b> means “language”. It originates from Greek.উপরের উদাহরণে, আমি একটি টাইপোগ্রাফার হিসেবে idioma শব্দটি হাইলাইট করেছি না কেনো এটার মহৎ গুরুত্ব, বরং কারণ এটি একটি বিদেশী, নন-ইংরেজি শব্দ যা আমি আশেপাশের টেক্সট থেকে আলাদা দেখাতে চাই। এটি একটি স্টাইল-ডিসিশন, এমন কিছু নয় যা মানে কনভে করতে হয়।
তাই যদি আপনি কোনো কিছুর প্রতি গমনাকর্ষণ করতে চান নির্দিষ্ট সিম্যান্টিক মানে ছাড়া, <b> ঐতিহাসিকভাবে (HTML5-এ আগে) সঠিক হত। そsaid, আধুনিক কালে, আমরা প্রেজেন্টেশনের জন্য HTML ব্যবহার করি না, আমরা CSS ব্যবহার করি, তাই আমি <b> ব্যবহার করি না।
<strong> ব্যবহারের উদাহরণ:
In 2020, <strong>security</strong> and <strong>performance</strong> are are crucial for your SEO.উপরের উদাহরণে, আমি security এবং performance-কে স্ট্রংলি এমফেসাইজ করেছি কারণ সেই টপিকগুলো আপনার ওয়েবসাইটের SEO (এবং UX)-র জন্য নিঃসন্দেহে গুরুত্বপূর্ণ।
ডিফল্টভাবে, <strong> এবং <b> অধিকাংশ ব্রাউজারে টেক্সটে একই বোল্ডফেস স্টাইলিং প্রয়োগ করে, যা বোঝাবোঝাই প্রচুর কনফিউশন সৃষ্টি করে। কেন তাদের একই দেখাবে যখন তারা ভিন্ন টুলส์ ভিন্ন ইউজ কেসের জন্য?
আমি আপনার সাথে একমত। এটি বিরক্তিকর।
এটি কারণ আপনি ব্রাউজার ডিফল্ট ওভাররাইড করে তাদের আলাদা স্টাইলিং প্রয়োগ করতে চাইতে পারেন।
<strong> এবং <b> প্রেজেন্টেশনালি ডিফারেনশিয়েট করার একটি ভালো উপায় হচ্ছে <strong> এলিমেন্টে CSS দিয়ে ফন্ট ওয়েইট ৫০০ থেকে ৯০০ (ফন্ট ফ্যামিলি অনুযায়ী) প্রয়োগ করা। এভাবে:
strong { font-weight: 700; }তারপর <b>-র জন্য ভিন্ন স্টাইলিং ব্যবহার করুন, যেমন:
b { font-weight: 400; color: green; }উপরেরটি কোনো স্টাইল সাজেশন নয়, বরং একটি উদাহরণ কীভাবে আপনি রেন্ডারড পেজ ব্রাউজারে দেখার সময় মনে রাখতে পারেন কোনটি ব্যবহার করেছেন।
আপনি যদি মার্কডাউন ব্যবহার করেন
আপনি যদি <b> বা <strong>-কে মার্কডাউন-এ কনভার্ট করার চেষ্টা করেন HTML to Markdown কনভার্টার Browserling-এ, তবে দেখবেন সেগুলো উভয়ই একই ** ** পায় — যা ব্রাউজারে <strong>-এ রেন্ডার হয়।
তাহলে কী ঘটল?
আমি নিশ্চিত নই। আমি কোনো মার্কডাউন গাইড খুঁজে পাইনি যা দেখায় <b>-কে ব্রাউজারে রেন্ডার করা যাবে মার্কডাউন সিনট্যাক্স দিয়ে, কমপক্ষে।
চিন্তা করবেন না, আপনি এখনও HTML সিনট্যাক্স সরাসরি মার্কডাউন ফাইলের ভিতরে প্রয়োগ করতে পারেন (যদি পুরনো ভার্সন ব্যবহার না করেন)। তাই যদি আপনি <strong>-এর বদলে <b> ব্যবহার করতে চান বা প্রয়োজন হয়, তবে সেটি এভাবে যোগ করতে পারেন:
Here is a line of text inside a <b>markdown</b> file which automatically gets wrapped by paragraph tagsআমি এই টিউটোরিয়ালটি মার্কডাউন-এ লিখছি। এখন আমি এই টেক্সট-কে <b> এলিমেন্ট দিয়ে হাইলাইট করছি। আপনি এই প্যারাগ্রাফ সিলেক্ট করে "Inspect" ক্লিক করলে দেখবেন সেটি নিঃসন্দেহে <b> এলিমেন্ট ব্যবহার করেছে।
এটা কি ততটাই মানে কোনটি ব্যবহার করবেন?
এটি স্পষ্টভাবে লাইফ অর ডেথ ইশ্যু নয়, নাহলে আধুনিক ব্রাউজার <b> এবং <strong>-কে একই বোল্ডফেস স্টাইলিংয়ে রেন্ডার করত না।
তবে, সিম্যান্টিকলি পার্থক্য আছে, যা আমি বুঝাতে চেয়েছিলাম। তাই যদি আপনি এমন জব ইন্টারভিউতে যান যেখানে সিম্যান্টিক মার্কআপের ওপর খুব বেশি ফোকাস করা হয়, তবে পার্থক্য জানা গুরুত্বপূর্ণ।
সংক্ষেপে:
<b>নির্দিষ্ট টেক্সটের প্রতি গমনাকর্ষণ করার জন্য ব্যবহৃত হয়।<strong>গুরুত্বপূর্ণ টেক্সটের জন্য ব্যবহৃত হয়।- সন্দেহ হলে,
<strong>ব্যবহার করুন।
একটি ভালো রুল অফ থাম্ব হচ্ছে এমফেসিস অপব্যবহার এড়ানো। আপনি যখন সবকিছুই এমফেসাইজ করার চেষ্টা করেন, এমফেসিস তার ক্ষমতা হারায়। আপনি যদি সবকিছুই এমফেসাইজ করেন, তবে আপনি কিছুই এমফেসাইজ করেন না (আমি জেনেরিক মার্কেটিং ল্যান্ডিং পেজ সাইটগুলোর দিকে তাকাচ্ছি)।
