What's HTML? HTML কি ?

HTML কি ?

Educational Blogs



HTML এর পূর্ণরূপ Hyper text markup language। ওয়েব পেজ তৈরিতে সাধারণ এবং সবচেয়ে বহুল ব্যবহৃত ল্যাঙ্গুয়েজ হচ্ছে HTML।এই ল্যাঙ্গুয়েজ এর মাধ্যমে wwwএর বিভিন্ন ধরনের উপাদান ও উপকরণ তৈরি করা যায়। ইন্টারনেট,  ইন্ট্রানেট ওয়েব পেইজ ওয়েবসাইট তৈরিতে HTMLব্যবহৃত হয়। HTML হচ্ছে SGML  বা Standard Generalized Markup Languageএর উন্নত সংস্করণ। টিম বার্নার্স লি সুইজারল্যান্ডের জেনেভায় অবস্থিত CERN (The European Center for Nuclear Research)-  এ  ইন্টারনেটে তথ্য বিতরনের বিভিন্ন ধরনের সীমাবদ্ধতা নিয়ে কাজ করার সময় HTML তৈরি করেন। HTML এর বিভিন্ন ভার্সন ও সালগুলো হলো HTML ১৯৯১ সাল, HTML+  ১৯৯৩ সাল, HTML ২.০ ১৯৯৩  সাল, HTML ৩.২ ১৯৯৭ সাল, HTML-৫ ২০১০ সাল।


HTML ডকুমেন্ট ফাইল হল সাধারণ টেক্সট ফাইল এর মত। একটি HTML ফাইলে টেক্সট ছাড়া শব্দ, সচল ও স্থির ছবি কিছুই থাকে না। এর সাথে উল্লেখিত প্রয়োজনীয় মিডিয়া যুক্ত করা হয় মাত্র। যেমন- HTML টেক্সট ফাইলে বাংলাদেশ জাদুঘর সম্পর্কে বিবরণ লেখা হয়েছে। এবার বিবরনের সাথে জাদুঘরের ছবি যোগ করতে জাদুঘরের ছবি সংগ্রহ করে একটি ফাইল হিসেবে সংরক্ষণ করতে হবে। এরপর HTML ফাইল পড়তে পারে এমন ব্রাউজিং সফটওয়্যার ( যেমন-Mozilla Firefox, Google Chrome, Microsoft Edge, Internet Explorer, Netscape, Front Page ইত্যাদি) এর সাহায্যে ফাইলটি খুলতে হবে। খোলার পর দেখা যাবে টেক্সট ফাইল টির একটি জায়গায় জাদুঘরের ছবি পাতসহ ফাইলের নাম  আন্ডারলাইন যুক্ত নীল রঙের চিহ্নিত হয়েছে। ওয়েব পেজে অনেক ট্যাগ তৈরি করতে HTML ব্যবহৃত হয়। এটি একটি ভিত্তিক ল্যাঙ্গুয়েজ। HTML এর কোণাকৃতি  ব্র্যাকেটের (<>) হয়। HTML এ রং,  অবজেক্ট ও লে-আউট ব্যবহার করা হয়। ওয়েব ডিজাইন নতুন ব্যবহারকারীদের কাছে খুবই গুরুত্বপূর্ণ।


HTML এর সুবিধা: HTML এর অনেক সুবিধা রয়েছে। যেমন-

  • HTML সহজে ব্যবহার করা যায় এবংHTML দ্বারা তৈরিকৃত পেইজ সহজে লোড করা হয়।

  •  কোন পেইজের তথ্যকে যেকোন স্থানে সরানো যায়।

  •  প্রতিটি ব্রাউজার HTML সমর্থন করে।

  •  শেখা ও ব্যবহার করার পদ্ধতি সহজ।

  • পেইজের সাইজ কম হওয়ায় খরচ কম পড়ে।

  •  যেকোনো টেক্সট এডিটরে এডিট করা যায়।

  • HTML  সবার জন্য বিনামূল্যে উন্মুক্ত।

  •  সহজে আকর্ষণীয় ওয়েব পেইজ তৈরি করা যায়।

  •  অতিরিক্ত সফটওয়্যার কেনার প্রয়োজন হয় না।

  •  ওয়েব ফর্ম ডিজাইন করা যায় এবং বিভিন্ন ধরনের ফরমেটিং করা যায়।

  • CSS, PHP, Javascript, ASP, JSP  প্রভৃতি প্রোগ্রামিং টুলস সমর্থন করে।


HTML এর অসুবিধা: HTML এর  সুবিধা সুবিধার পাশাপাশি বিভিন্ন অসুবিধাও পরিলক্ষিত হয়. যেমন-

  • HTML স্ট্যাটিক (স্থির) পেইজ তৈরি করতে পারলেও ডায়নামিক (পরিবর্তনশীল)  পেইজ তৈরি করতে পারে না।

  •  সাধারণ ওয়েব পেইজ তৈরীর জন্য প্রচুর কোড লিখতে হয়।

  •  বেশি  কোড যুক্ত ওয়েব পেইজ চালানোর ক্ষেত্রে জটিলতার সৃষ্টি করে।

  • HTML এ নিরাপত্তা ব্যবস্থা দুর্বল। 


HTML এর ট্যাগ ও সিনটেক্স পরিচিতি (Introduction to HTML Tags & HTML syntax)


HTML ব্যবহার করে ওয়েব পেইজ ডিজাইন করা হয়। HTML- এর দুটি অংশ- একটি Head  এবং অপরটি Body। 

Head  অংশ: Head  অংশে ওয়েব পেইজের টাইটেল,  স্টাইল,  স্ক্রিপ্ট ও ওয়েব পেইজ সম্পর্কে ধারণা দেওয়া থাকে। এটি  ডকুমেন্টের মূল অংশ যাতে তথ্য প্রদর্শন করা হয়।


Body  অংশ: Body  অংশে যাবতীয় তথ্য যেমন- লেখা, ছবি, টেবিল, অডিও, ভিডিও ইত্যাদি থাকে। এটি ডকুমেন্ট এর মূল অংশ যাতে তথ্য প্রদর্শন করা হয় ।


 ট্যাগ (Tag):

<>  ও </>  এবং এর মধ্যে লেখা একটি কিওয়ার্ড কে একত্রে ট্যাগ বলা হয়। HTML প্রোগ্রাম লেখার জন্য <>  ও </>  দুটি চিহ্ন এবং এর মধ্যে কিছু শব্দ যেমন html, head, title, body  ইত্যাদি কিওয়ার্ড ব্যবহার করা হয়। 

একটি ট্রাকের মূলত: তিনটি অংশ থাকে। যথা- ক.  শুরু  ট্যাগ,  খ.  তথ্য বা ধারণকৃত অংশ,  গ. শেষ ট্যাগ।

 যেমন- <h1> This is heading Tag </h1> । এখানে <h1>  হলো শুরু  ট্যাগ।This is heading Tag  হল ধারণকৃত অংশ এবং </h1>  হলো  শেষ ট্যাগ। 


নিম্নে কিছু HTML  ট্যাগ দেওয়া হলোঃ




<html></html>

HTML এর  ডকুমেন্ট বর্ণনা করে।

<head></head>

প্রোগ্রামের হেড অংশ নির্দেশ করে।

<title></title>

ডকুমেন্ট টাইটেল নির্দেশ করে।

<body></body>

প্রোগ্রামের মূল অংশ নির্দেশ করে।

<h1>…..<h6>

</h1>….</h6>

হেডিং ১ থেকে হেডিং ৬ পর্যন্ত বর্ণনা করে।

<p></p>

একটি প্যারাগ্রাফ বর্ণনা করে।

<a></a>

Anchor ট্যাগ এবং লিঙ্ক তৈরী করে।

<b></b>

Bold টেক্সট নির্দেশ করে।

<i></i>

Italic টেক্সট নির্দেশ করে।

<u></u>

Underline  টেক্সট নির্দেশ করে।

<abbr></abbr>

Abbreviation   ট্যাগ নির্দেশ করে।

<em></em>

Emphasized টেক্সট নির্দেশ করে।

<del></del>

টেক্সটে কাঁটা নির্দেশ করে।

<mark></mark>

টেক্সটের মার্ক নির্দেশ করে।

<s></s>

Strick টেক্সট নির্দেশ করে।

<command>

কমান্ড বাটন তৈরীতে ব্যবহৃত হয়।

<strong></strong>

Strong টেক্সট নির্দেশ করে।

<span></span>

Span টেক্সট নির্দেশ করে।

<small></small>

স্বাভাবিকের চেয়ে ছোট টেক্সট নির্দেশ করে।

<big></big>

স্বাভাবিকের চেয়ে বড় টেক্সট নির্দেশ করে।

<sub></sub>

Subscripted টেক্সট নির্দেশ করে।

<sup></sup>

Superscripted টেক্সট নির্দেশ করে।

<q></q>

টেক্সটকে কোটেশনের মধ্যে প্রদর্শন করে।

<br>

এক লাইন ফাঁকা বা ব্রেক তৈরী করে।

<hr>

একটি হরিজন্টাল রূল বর্ণনা করে।

<div></div>

ডকুমেন্ট এর মধ্যে কোন অংশকে বিভক্ত করে।

<img>

ছবিকে বর্ণনা করে।

<table></table>

টেবিল তৈরীতে ব্যবহৃত হয়।

<tr></tr>

টেবিলের সারি তৈরীতে ব্যবহৃত হয়।

<th></th>

টেবিলের হেডিং তৈরীতে ব্যবহৃত হয়।

<td></td>

টেবিলের সেল তৈরীতে ব্যবহৃত হয়।

<code></code>

প্রোগ্রামিং টেক্সটগুলো যেভাবে লেখা হয় সেভাবে দেখার জন্য ব্যবহৃত হয়।

<pre></pre>

ট্যাব, স্পেস, লাইন ব্রেক যেভাবে দেওয়া থাকবে সেভাবে দেখার জন্য ব্যবহৃত হয়।

<tt></tt>

টাইপ রাইটারের লেখার মতো দেখার জন্য ব্যবহৃত হয়।

<ol></ol>

Order list তৈরীতে ব্যবহৃত হয়।

<ul></ul>

Unorder list তৈরীতে ব্যবহৃত হয়।

<li></li>

List item তৈরীতে ব্যবহৃত হয়।



এই  ট্যাগ গুলির মাধ্যমে ওয়েব পেইজ ডিজাইন করা হয়।



এ ধরণের আরো মজার মজার গল্প পড়তে ক্লিক করুন Educational Blogs এবং Subscribe করে পাশেই থাকবেন।


9 Comments


  1. "The articles are well-written and thought-provoking."

    ReplyDelete
  2. "The 'Contact Us' page is informative and user-friendly – reaching out is easy."

    ReplyDelete
  3. I appreciate the depth of your exploration

    ReplyDelete
  4. Your commitment to quality content is evident in every post. Thanks for the consistency!"

    ReplyDelete
  5. The subtle use of animation enhances the overall user engagement.

    ReplyDelete
  6. "The comment section is a goldmine. Great to see a community so actively sharing insights."

    ReplyDelete
  7. It was really interesting to learn about, Great work!

    ReplyDelete
  8. "Great post! Your insights really opened my eyes to a new perspective."

    ReplyDelete
Previous Post Next Post