Google Play badge

হাইপারটেক্সট মার্কআপ ভাষা


হাইপারটেক্সট মার্কআপ ল্যাঙ্গুয়েজ ( HTML )

HTML হল হাইপারটেক্সট মার্কআপ ল্যাঙ্গুয়েজ। এটি ওয়েব ব্রাউজারে প্রদর্শনের জন্য ডিজাইন করা ডকুমেন্টের জন্য স্ট্যান্ডার্ড মার্কআপ ল্যাঙ্গুয়েজ। HTML ক্যাসকেডিং স্টাইল শিট ( CSS ) এবং জাভাস্ক্রিপ্টের মতো স্ক্রিপ্টিং ল্যাঙ্গুয়েজ দ্বারা সহায়তা করা যেতে পারে।

ওয়েবের ভিত্তি

এর মূলে, ইন্টারনেট হল বিশ্বব্যাপী সংযুক্ত কম্পিউটারের একটি বিশাল নেটওয়ার্ক। এই নেটওয়ার্কের সাথে আমাদের যোগাযোগের প্রাথমিক উপায় হল ওয়ার্ল্ড ওয়াইড ওয়েব ( WWW ) এর মাধ্যমে, যা ইন্টারনেটের মাধ্যমে অ্যাক্সেস করা আন্তঃসংযুক্ত হাইপারটেক্সট ডকুমেন্টের একটি সিস্টেম। WWW এর কেন্দ্রবিন্দুতে রয়েছে ওয়েব পৃষ্ঠা, যা HTML এ লেখা ডকুমেন্ট। HTML সাইটের মৌলিক কাঠামো প্রদান করে, যা পরবর্তীতে CSS এবং JavaScript এর মতো অন্যান্য প্রযুক্তি দ্বারা উন্নত এবং পরিবর্তিত হয়।

HTML ডকুমেন্ট স্ট্রাকচার

একটি HTML ডকুমেন্ট নেস্টেড ট্যাগের একটি সেট অনুসারে গঠন করা হয়, যা কোণ বন্ধনীতে আবদ্ধ উপাদান। এই ট্যাগগুলি ওয়েব ব্রাউজারকে কীভাবে সামগ্রী প্রদর্শন করতে হয় তা বলে। একটি সাধারণ HTML ডকুমেন্ট কাঠামোর একটি উদাহরণ হল:

 <!ডক্টাইপ html>
<html>
    <head>>
        <title>পৃষ্ঠার শিরোনাম</title>
    </head>
    <শরীর>>
        <h1>এটি একটি শিরোনাম</h1>
        <p>এটি একটি অনুচ্ছেদ।</p>
    </শরীরের>
</html>

এই কোডটি একটি শিরোনাম, একটি শিরোনাম এবং পাঠ্যের একটি অনুচ্ছেদ সহ একটি মৌলিক ওয়েবপৃষ্ঠাকে সংজ্ঞায়িত করে।

HTML এলিমেন্ট এবং ট্যাগ

HTML ডকুমেন্টগুলি HTML উপাদান দিয়ে তৈরি। প্রতিটি উপাদান একটি স্টার্ট ট্যাগ, কিছু কন্টেন্ট এবং একটি এন্ড ট্যাগ দ্বারা প্রতিনিধিত্ব করা হয়। একটি এলিমেন্টের স্টার্ট এবং এন্ড ট্যাগ একই রকম, তবে এন্ড ট্যাগে এলিমেন্টের নামের আগে একটি ফরোয়ার্ড স্ল্যাশ থাকে।

উদাহরণস্বরূপ, <code><p></code> ট্যাগটি একটি অনুচ্ছেদের টেক্সটকে আবদ্ধ করে, এবং এটি নিম্নরূপ গঠন করা হয়েছে:

 <p>এটি একটি উদাহরণ অনুচ্ছেদ।</p>

বিভিন্ন উপাদান বিভিন্ন উদ্দেশ্যে কাজ করে। উদাহরণস্বরূপ:

গুণাবলী

HTML এলিমেন্টগুলিতে এমন অ্যাট্রিবিউট থাকতে পারে যা এলিমেন্ট সম্পর্কে অতিরিক্ত তথ্য প্রদান করে। অ্যাট্রিবিউটগুলি একটি এলিমেন্টের স্টার্ট ট্যাগের মধ্যে স্থাপন করা হয় এবং প্রায়শই নাম/মান জোড়ায় দেওয়া হয় যেমন <code>name="value"</code>।

উদাহরণস্বরূপ, একটি ছবি এম্বেড করার জন্য, আমরা <code><img></code> ট্যাগ ব্যবহার করি যার সাথে <code>src</code> (source) অ্যাট্রিবিউট থাকে এবং ছবির URL নির্দিষ্ট করে:

 <img src="url to image.jpg" alt="ছবির বর্ণনা">

যদি ছবিটি প্রদর্শিত না হয়, তাহলে <code>alt</code> অ্যাট্রিবিউটটি বিকল্প টেক্সট প্রদান করে।

লিঙ্ক এবং নেভিগেশন

<code><a></code> ট্যাগ ব্যবহারের ফলে হাইপারলিঙ্ক তৈরি হয়, যা ওয়েবের আন্তঃসংযোগের ভিত্তি। একটি হাইপারলিঙ্ক অন্য ওয়েব পৃষ্ঠা, একই পৃষ্ঠার একটি ভিন্ন অংশ, এমনকি একটি ডাউনলোডযোগ্য ফাইলের সাথে লিঙ্ক করতে পারে। উদাহরণস্বরূপ:

 <a href="https://example.com">Example.com দেখুন</a>

এটি <code>https://example.com</code> এর একটি লিঙ্ক তৈরি করে।

তালিকা

HTML তালিকা তৈরির জন্য উপাদান প্রদান করে। দুটি প্রাথমিক ধরণের তালিকা রয়েছে:

তালিকার প্রতিটি আইটেম <code><li></code> (তালিকা আইটেম) ট্যাগের মধ্যে আবদ্ধ।

HTML5

HTML5 হল স্ট্যান্ডার্ডের সর্বশেষ বিবর্তন, যা মাল্টিমিডিয়া এবং ইন্টারেক্টিভ ডকুমেন্টের জন্য আধুনিক চাহিদা প্রতিফলিত করে এমন অনেক নতুন বৈশিষ্ট্য প্রবর্তন করে। এর মধ্যে রয়েছে নতুন কাঠামোগত উপাদান (<code><header></code>, <code><footer></code>, <code><article></code>, <code><section></code>), গ্রাফিক উপাদান (<code><canvas></code> অঙ্কনের জন্য, <code><svg></code> স্কেলেবল ভেক্টর গ্রাফিক্সের জন্য), এবং মিডিয়া উপাদান (<code><audio></code> এবং <code><video></code>)।

শব্দার্থিক HTML

সিমান্টিক HTML বলতে ওয়েবপেজে তথ্যের শব্দার্থবিদ্যা বা অর্থকে শক্তিশালী করার জন্য HTML মার্কআপের ব্যবহারকে বোঝায়। উপাদানগুলি কীভাবে দেখায় বা আচরণ করে তা কেবল সংজ্ঞায়িত করার পরিবর্তে (এটি CSS এবং JavaScript এর কাজ), সিমান্টিক HTML সঠিকভাবে কাঠামো এবং বিষয়বস্তুর ধরণ বর্ণনা করে। উদাহরণস্বরূপ, একটি <code><article></code> ট্যাগ নির্দেশ করে যে ভিতরের বিষয়বস্তু একটি নিবন্ধ, যখন একটি <code><nav></code> ট্যাগ একটি নেভিগেশন মেনুকে নির্দেশ করে।

শব্দার্থিক HTML ব্যবহার ওয়েব কন্টেন্টের অ্যাক্সেসযোগ্যতা এবং অনুসন্ধানযোগ্যতা উন্নত করে, এটিকে আরও ব্যবহারযোগ্য এবং আবিষ্কারযোগ্য করে তোলে।

উপসংহার

HTML হল ওয়ার্ল্ড ওয়াইড ওয়েবের একটি মূল প্রযুক্তি, যা ওয়েব পৃষ্ঠাগুলির জন্য মৌলিক কাঠামো প্রদান করে। ট্যাগ, বৈশিষ্ট্য এবং উপাদান ব্যবহারের মাধ্যমে, HTML কাঠামোগত নথি তৈরির সুযোগ করে দেয়। HTML বোঝার এবং ব্যবহার করার মাধ্যমে, কেউ ওয়েবে অ্যাক্সেসযোগ্য বিস্তৃত সামগ্রী তৈরি করতে পারে, সাধারণ টেক্সট ডকুমেন্ট থেকে শুরু করে জটিল ইন্টারেক্টিভ মাল্টিমিডিয়া অভিজ্ঞতা পর্যন্ত। ওয়েব ডেভেলপমেন্টের ভিত্তি হিসেবে, ওয়েব ডিজাইন বা ডেভেলপ করতে চাওয়া যে কারও জন্য HTML এর উপর দক্ষতা অপরিহার্য।

Download Primer to continue