কিভাবে একটি এইচটিএমএল অ্যাঙ্কর লিঙ্ক পৃষ্ঠার একটি নির্দিষ্ট অংশে জাম্প করতে হয়?

আপনি অ্যাঙ্কর ব্যবহার করতে পারেন (<a> ) একটি ভিন্ন পৃষ্ঠা বা একটি ভিন্ন ওয়েবসাইটের সাথে লিঙ্ক করার জন্য HTML এ লিঙ্কগুলি। কিন্তু কিভাবে আপনি একটি ওয়েব পৃষ্ঠার একটি নির্দিষ্ট অংশ লিঙ্ক করতে পারেন?

উত্তর হল জাম্প লিঙ্ক .

জাম্প লিঙ্কগুলি এমন লিঙ্ক যা কেবল পৃষ্ঠাটি লোড করবে না, তবে তারা একটি ওয়েব পৃষ্ঠার একটি নির্দিষ্ট অংশে "জাম্প" করবে। আপনি আপনার ওয়েবসাইটের একটি ভিন্ন পৃষ্ঠায় লিঙ্ক করতে অভ্যন্তরীণভাবে ব্যবহার করতে পারেন, এবং এমনকি আপনি বাহ্যিকভাবে লিঙ্কগুলি ভাগ করতে পারেন৷

ব্যবহারকারী যেখান থেকে আসুক না কেন এই লিঙ্কগুলি কাজ করবে, এবং তাদের কাজ করার জন্য মৌলিক HTML ছাড়া অন্য কিছুর প্রয়োজন নেই৷

অ্যাঙ্কর জাম্প লিঙ্ক তৈরি করা হচ্ছে

HTML এ, আপনি <a> এর সেট ব্যবহার করে একটি অ্যাঙ্কর লিঙ্ক তৈরি করতে পারেন ভিতরে টেক্সট সহ ট্যাগ। এখানে একটি উদাহরণ:

<a>Here is a link that doesn't go anywhere!</a>

লিঙ্ক টার্গেটের জন্য আইডি অ্যাট্রিবিউট ব্যবহার করুন

এখন, একটি জাম্প লিঙ্ক তৈরি করতে, আমাদের একটি লিঙ্ক প্রয়োজন এবং আমাদের একটি লক্ষ্য প্রয়োজন। লক্ষ্য ওয়েব পৃষ্ঠার যেকোন উপাদান হতে পারে যার একটি "আইডি" বৈশিষ্ট্য রয়েছে৷

একটি সত্যিই সাধারণ লক্ষ্য হবে একটি শিরোনাম বা উপশিরোনাম একটি H ট্যাগ ব্যবহার করে যেমন <h1> , <h2> , <h3> , এবং তাই। সাধারণত, এই উদ্দেশ্যে যেকোন H ট্যাগে একটি আইডি যোগ করা একটি ভাল অভ্যাস।

ধরা যাক আমাদের একটি সত্যিই দীর্ঘ ওয়েব পৃষ্ঠা আছে, এবং আমরা পৃষ্ঠার এমন একটি বিভাগে লিঙ্ক করতে চাই যা দেখতে এইরকম:

<h2 id="extra_content">Extra content we don't want to link to</h2>
<p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque sed porta est, nec pretium lectus. Quisque sit amet porta risus, sed faucibus magna. 
</p>

<h2 id="linked_content">Subheadline of a section to link to</h2>
<p>
    Vivamus orci erat, sagittis vitae aliquam at, pretium sagittis neque. Curabitur vel eros in turpis elementum sollicitudin. 
</p>

ইউআরএলে উপাদানটির সাথে লিঙ্ক করুন

এখন যেহেতু আমাদের লক্ষ্য উপাদান রয়েছে, আমরা #linked_content যোগ করে এটিতে একটি জাম্প লিঙ্ক তৈরি করতে পারি পৃষ্ঠার URL এর শেষে। টার্গেটের আইডি যাই হোক না কেন, # এর পরে যোগ করুন (পাউন্ড/হ্যাশট্যাগ) প্রতীক।

আমরা যদি একটি পৃষ্ঠায় থাকি এবং একই পৃষ্ঠার একটি বিভাগে যেতে চাই, তাহলে আমরা একটি অভ্যন্তরীণ লিঙ্ক তৈরি করতে পারতাম। একটি অভ্যন্তরীণ লিঙ্কের জন্য https://www.WebsiteName.com প্রয়োজন হয় না লিঙ্কের href-এ বৈশিষ্ট্য।

একটি অভ্যন্তরীণ জাম্প লিঙ্কের একটি উদাহরণ হতে পারে:

<a href="#linked_content">Link to the subheadline on the same page</a>

আপনি যদি একটি ভিন্ন ওয়েবসাইটে লিঙ্কটি যোগ করেন বা এমনকি সামাজিক মিডিয়া বা ইমেলে অন্যদের সাথে শেয়ার করেন তাহলে কী হবে? আপনি এখনও #linked_content যোগ করে একই জিনিস করতে পারেন সম্পূর্ণ ইউআরএলের শেষে এভাবে:

<a href="https://www.WebsiteName.com/PageName/#linked_content">Link to the subheadline on the same page</a>

"নাম" বৈশিষ্ট্যের নোট

অতীতে, এই ধরনের জাম্প লিঙ্কগুলি একটি ফাঁকা অ্যাঙ্কর লিঙ্কে "নাম" বৈশিষ্ট্য ব্যবহার করে লক্ষ্যবস্তু করা হয়েছিল। মোজিলা ডেভেলপার নেটওয়ার্কের মতে, এই অভ্যাসটি HTML5 থেকে অপ্রচলিত। এটি এখনও কিছু ব্রাউজারে কাজ করতে পারে, তবে আমি উচ্চতর সুপারিশ করব যে আপনি লিঙ্ক করার আরও বর্তমান পদ্ধতি ব্যবহার করুন৷

আমি আশা করি এটি আপনাকে ওয়েব পৃষ্ঠার একটি নির্দিষ্ট অংশে জাম্প লিঙ্ক তৈরি করতে সাহায্য করবে!