আজকে প্রকাশিত চাকরির পরীক্ষার নোটিশ গুলো পাবেন

HTML Head/হেড ট্যাগের ব্যবহার

HTML Head/হেড ট্যাগের ব্যবহার


 হেড ট্যাগ বা <head> এবং হেড ইলিমেন্ট যেকোন HTML পেজের একটি গুরুত্বপূর্ণ অংশ। কারণ <head>….</head> এর মধ্যে অর্থাৎ হেড ইলিমেন্ট হিসেবে <title> <link> <meta> <style> <script>    এ সকল গুরুত্বপূর্ণ ট্যাগ সমূহ রাখা হয়। এগুলোর মাধ্যমে ব্রাউজারে পেজ সম্পর্কিত বেশ কিছু তথ্য প্রদর্শন করার পাশাপাশি সার্চ ইন্জিন অপটিমাইজেশন এর মত গুরুত্বপূর্ণ কাজও সম্পন্ন হয়।


এইচটিএমএল হেড এলিমেন্ট

ট্যাগবর্ননা
<head>ডকুমেন্টের তথ্য ধারণ করে
<base>একটি পেজের সকল লিঙ্কের জন্য ডিফল্ট URL বা টার্গেট ধারণ করে
<link>একটি ডকুমেন্টের সাথে এক্সটার্নাল ফাইলের সম্পর্ক তৈরি করে
<meta>এইচটিএমএল ডকুমেন্টের মেটাডেটা ধারণ করে
<script>ক্লায়েন্ট সাইড স্ক্রিপ্ট ধারণ করে
<style>ডকুমেন্টের স্টাইল ধারণ করে
<title>ডকুমেন্টের টাইটেল ধারণ করে

<head> এলিমেন্ট

<head> এলিমেন্ট হলো মেটাডেটা(ডেটা সম্পর্কিত ডেটা) রাখার কন্টেইনার এবং এটি <html> ট্যাগ এবং <body> ট্যাগের মাঝে থাকে।

এইচটিএমএল মেটাডেটা হলো এইচটিএমএল ডকুমেন্ট সম্পর্কিত তথ্য যা ব্রাউজারে দেখানো হয় না।

মেটাডেটা সাধারণত ডকুমেন্টের টাইটেল, ক্যারেক্টার সেট, স্টাইল, লিঙ্ক, স্ক্রিপ্ট এবং অন্যান্য তথ্যকে বুঝায়।

এই ট্যাগগুলোর মাধ্যমে মেটাডেটা বর্ননা করা হয়ঃ <title>, <style>, <meta>, <link>, <script> এবং <base>

<base> এলিমেন্ট

একটি ওয়েব পেজের সকল URL এবং target এট্রিবিউটের একটি মূল URL এবং target সেট করার জন্য <base> এলিমেন্ট ব্যবহার করা হয়ঃ


উদাহরণ প্রোগ্রাম:

<!DOCTYPE html>

<html>

<head>

<title>এইচটিএমএল উদাহরণ</title>

<base href="https://biplobparbatipur.blogspot.com/" target="_blank">

</head>

<body>


<img src="sattacademy.jpg">

<p>যেহেতু আমরা URL এর একটি ভিত্তি নির্দিষ্ট করে দিয়েছি, ব্রাউজার "sattacademy.jpg" এই ছবিটি "https://biplobparbatipur.blogspot.com/" এই url এ অনুসন্ধান করবে।</p>


<p><a href="https://biplobparbatipur.blogspot.com/">sattacademy</a></p>

<p>উপরের লিংকটি একটি নতুন উইন্ডোতে ওপেন হবে কারণ আমরা লিংকের target এট্রিবিউটের ভিত্তি "_blank" সেট করে দিয়েছি।</p>


</body>

</html>


<title> এলিমেন্ট

<title> এলিমেন্ট একটি ডকুমেন্টের টাইটেল নির্দেশ করে এবং সকল এইচটিএমএল/এক্সএইচটিএমএল ডকুমেন্টে অবশ্যই দিতে হয়।

একটি সাধারণ এইচটিএমএল ডকুমেন্টঃ


উদাহরণ প্রোগ্রাম:

<!DOCTYPE html>

<html>

<head>

   <title>এইচটিএমএল উদাহরণ</title>

</head>

<body>


<p>body এলিমেন্টের কন্টেন্ট ব্রাউজারের উইন্ডোতে দেখানো হয়।</p>

<p>title এলিমেন্টের কন্টেন্ট ব্রাউজারের ট্যাবে দেখানো হয়।</p>


</body>

</html>


<style> এলিমেন্ট

শুধুমাত্র একটি এইচটিএমএল পেজের স্টাইল সম্পর্কিত তথ্য রাখার জন্য <style> এলিমেন্ট ব্যবহার করা হয়ঃ


উদাহরণ প্রোগ্রাম:

<!DOCTYPE html>

<html>

<head>

<title>এইচটিএমএল উদাহরণ</title>

<style>

body{background-color: teal;}

h2{color: white;}

p{color: powderblue;}

</style>

</head>

<body>


<h2>একটি হেডিং</h2>

<p>একটি প্যারাগ্রাফ</p>


</body>

</html>


       বি:দ্র:  Output  দেখার জন্যে একটা  নোটপ্যাড  open  করে  উপরের উদাহরনের code  টুকু  লিখে  file  মেনু  থেকে  Save as এ ক্লিক করে File name:  index.html  ,   Save as type : All files,  দিয়ে save করে index.html ফাইলটি যে কোন Browser  দিয়ে open করুন।

☞ এই পোষ্ট সম্পর্কে যদি আপনার কোন প্রশ্ন☞জিজ্ঞাসা☞সমস্যা☞তথ্য জানার থাকে তাহলে আপনি☞কমেন্ট করলে আপনাকে আমরা প্রয়োজনীয় তথ্য দিয়ে সাহায্য করার চেষ্টা করব☞☞☞ "HTML Head/হেড ট্যাগের ব্যবহার"

একটি মন্তব্য পোস্ট করুন

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel