About Lesson
TEXT - HTML এর ধারণা - Concept of HTML | HTML এর মৌলিক বিষয়সমূহ - HTML basics
HTML (HyperText Markup Language) হলো একটি মার্কআপ ভাষা যা ওয়েব পেজের মূল গঠন তৈরির জন্য ব্যবহৃত হয়। এটি বিভিন্ন ট্যাগের মাধ্যমে টেক্সট, ইমেজ, লিঙ্ক, এবং অন্যান্য উপাদান ব্রাউজারে দেখানোর নির্দেশনা দেয়।
ব্যবহার করতে হয় কেন ?
HTML ব্যবহার করা হয় ওয়েব পেজ তৈরি ও গঠন নির্ধারণের জন্য। এটি সহজভাবে টেক্সট, ইমেজ, এবং লিঙ্ক যুক্ত করতে সাহায্য করে এবং সব ব্রাউজারে সমর্থিত। এছাড়া, HTML ওয়েব ডেভেলপমেন্টের ভিত্তি হিসেবে CSS ও JavaScript-এর সাথে মিলিত হয়ে কাজ করে।
HTML এর মূল বৈশিষ্ট্যসমূহ:
মার্কআপ ভাষা: HTML একটি মার্কআপ ভাষা, যা ডকুমেন্টে তথ্যের কাঠামো এবং উপস্থাপনায় সাহায্য করে।
স্ট্রাকচারাল উপাদান: HTML ডকুমেন্টে বিভিন্ন স্ট্রাকচারাল উপাদান যেমন প্যারাগ্রাফ, হেডিং, লিস্ট, টেবিল ইত্যাদি
তৈরি করতে ব্যবহৃত হয়।
হাইপারলিঙ্ক: HTML হাইপারলিঙ্ক তৈরি করতে সহায়তা করে, যা ব্যবহারকারীদের এক পৃষ্ঠা থেকে অন্য পৃষ্ঠায় যেতে
সক্ষম করে।
মাল্টিমিডিয়া সমর্থন: HTML ছবি, অডিও, ভিডিও এবং অন্যান্য মাল্টিমিডিয়া উপাদান সমর্থন করে।
স্টাইল এবং স্ক্রিপ্ট: HTML-এর সাথে CSS (Cascading Style Sheets) এবং JavaScript ব্যবহার করে ওয়েব পেজের
ডিজাইন এবং ইন্টারেকশন উন্নত করা যায়।
HTML-এ ট্যাগ (Tag) হলো একটি মৌলিক উপাদান যা ওয়েব পেজের বিভিন্ন উপাদানকে চিহ্নিত এবং গঠন করতে ব্যবহৃত হয়। প্রতিটি ট্যাগ একটি নির্দেশনা দেয় যে একটি নির্দিষ্ট অংশ কীভাবে প্রদর্শিত হবে।
ট্যাগের গঠন:
-
- Open Tag (খোলা ট্যাগ):
<tagname>(যেখানেtagnameহলো ট্যাগের নাম)
- Open Tag (খোলা ট্যাগ):
-
- Close Tag (বন্ধ ট্যাগ):
</tagname>
- Close Tag (বন্ধ ট্যাগ):
-
- Self-Closing Tag (স্বয়ংসম্পূর্ণ ট্যাগ):
<tagname/>(যেখানে ট্যাগ বন্ধ করার জন্য/ব্যবহার করা হয়)
- Self-Closing Tag (স্বয়ংসম্পূর্ণ ট্যাগ):
-
<!DOCTYPE html>:-
- এই ঘোষণা ব্রাউজারকে জানায় যে ডকুমেন্টটি HTML5 ফরম্যাটে লেখা হয়েছে।
-
-
<html>ট্যাগ:-
- এটি HTML ডকুমেন্টের মূল উপাদান। এর ভিতরে সবকিছু থাকে।
-
-
<head>ট্যাগ:-
- এখানে ডকুমেন্টের মেটাডেটা, টাইটেল, স্টাইলশিট, এবং স্ক্রিপ্ট উল্লেখ করা হয়।
-
- উদাহরণ:
<meta charset="UTF-8">(কোডিং) এবং<title>(শিরোনাম)।
- উদাহরণ:
-
-
<body>ট্যাগ:-
- এখানে ওয়েব পেজের দৃশ্যমান উপাদান যেমন টেক্সট, ইমেজ, লিংক, ফর্ম ইত্যাদি থাকে।
-
VIDEO - HTML ট্যাগ – Tag ও সিনট্যাক্স -Syntax
HTML সিনট্যাক্সের মৌলিক উপাদানডকটাইপ ঘোষণা:
HTML ডকুমেন্টের শুরুর দিকে ডকটাইপ ঘোষণা করা হয়, যা ব্রাউজারকে জানায় যে এটি কোন ধরনের HTML ডকুমেন্ট।
-
-
-
- উদাহরণ:
<!DOCTYPE html>
- উদাহরণ:
-
-
-
- HTML ডকুমেন্টটি
<html>ট্যাগ দিয়ে শুরু হয় এবং এটি<html>ট্যাগ দিয়ে শেষ হয়।
- HTML ডকুমেন্টটি
-
- উদাহরণ:
<html> ... </html>
- উদাহরণ:
-
<head>: ডকুমেন্টের মেটাডেটা, শিরোনাম, এবং লিঙ্ক সংযুক্ত করার জন্য ব্যবহৃত হয়।
-
<body>: ওয়েব পেজের দৃশ্যমান উপাদানগুলি এখানে রাখা হয়।
-
- উদাহরণ:
<head> <title>My Page Title</title> </head> <body> <h1>Hello, World!</h1> </body>
- উদাহরণ:
-
- একটি ট্যাগের মধ্যে কনটেন্ট থাকতে পারে। ট্যাগগুলি সাধারণত একটি খোলা ট্যাগ এবং একটি বন্ধ ট্যাগের সমন্বয়ে গঠিত হয়।
-
- উদাহরণ:
<p>This is a paragraph.</p>
- উদাহরণ:
-
- ট্যাগের সাথে অতিরিক্ত তথ্য যুক্ত করতে অ্যাট্রিবিউট ব্যবহার করা হয়। অ্যাট্রিবিউটগুলোর নাম এবং মান থাকে।
-
- উদাহরণ:
<a href="https://www.example.com" target="_blank">Visit Example</a>
- উদাহরণ:
-
- কিছু ট্যাগ স্বয়ংসম্পূর্ণ, অর্থাৎ তারা খোলা ও বন্ধ ট্যাগ ছাড়া কাজ করে।
-
- উদাহরণ:
<img src="image.jpg" alt="Image Description"/>
- উদাহরণ:
ট্যাগের গঠন:
-
- Open Tag (খোলা ট্যাগ):
<tagname>(যেখানেtagnameহলো ট্যাগের নাম)
- Open Tag (খোলা ট্যাগ):
-
- Close Tag (বন্ধ ট্যাগ):
</tagname>
- Close Tag (বন্ধ ট্যাগ):
-
- Self-Closing Tag (স্বয়ংসম্পূর্ণ ট্যাগ):
<tagname/>(যেখানে ট্যাগ বন্ধ করার জন্য/ব্যবহার করা হয়)
- Self-Closing Tag (স্বয়ংসম্পূর্ণ ট্যাগ):
HTML সিনট্যাক্সের মৌলিক উপাদান
-
- ডকটাইপ ঘোষণা:
-
- HTML ডকুমেন্টের শুরুর দিকে ডকটাইপ ঘোষণা করা হয়, যা ব্রাউজারকে জানায় যে এটি কোন ধরনের HTML ডকুমেন্ট।
-
- উদাহরণ:
<!DOCTYPE html>
- উদাহরণ:
-
- ডকটাইপ ঘোষণা:
-
- HTML ট্যাগ:
-
- HTML ডকুমেন্টটি
<html>ট্যাগ দিয়ে শুরু হয় এবং এটি<html>ট্যাগ দিয়ে শেষ হয়।
- HTML ডকুমেন্টটি
-
- উদাহরণ:
<html> ... </html>
- উদাহরণ:
-
- HTML ট্যাগ:
-
- হেড এবং বডি:
-
<head>: ডকুমেন্টের মেটাডেটা, শিরোনাম, এবং লিঙ্ক সংযুক্ত করার জন্য ব্যবহৃত হয়।
-
<body>: ওয়েব পেজের দৃশ্যমান উপাদানগুলি এখানে রাখা হয়।
-
- উদাহরণ:
<head> <title>My Page Title</title> </head> <body> <h1>Hello, World!</h1> </body>
- উদাহরণ:
-
- হেড এবং বডি:
-
- ট্যাগের গঠন:
-
- একটি ট্যাগের মধ্যে কনটেন্ট থাকতে পারে। ট্যাগগুলি সাধারণত একটি খোলা ট্যাগ এবং একটি বন্ধ ট্যাগের সমন্বয়ে গঠিত হয়।
-
- উদাহরণ:
<p>This is a paragraph.</p>
- উদাহরণ:
-
- ট্যাগের গঠন:
-
- অ্যাট্রিবিউট:
-
- ট্যাগের সাথে অতিরিক্ত তথ্য যুক্ত করতে অ্যাট্রিবিউট ব্যবহার করা হয়। অ্যাট্রিবিউটগুলোর নাম এবং মান থাকে।
-
- উদাহরণ:
<a href="https://www.example.com" target="_blank">Visit Example</a>
- উদাহরণ:
-
- অ্যাট্রিবিউট:
-
- স্বয়ংসম্পূর্ণ ট্যাগ:
-
- কিছু ট্যাগ স্বয়ংসম্পূর্ণ, অর্থাৎ তারা খোলা ও বন্ধ ট্যাগ ছাড়া কাজ করে।
-
- উদাহরণ:
<img src="image.jpg" alt="Image Description"/>
- উদাহরণ:
-
- স্বয়ংসম্পূর্ণ ট্যাগ:
TEXT - HTML ট্যাগ – Tag ও সিনট্যাক্স -Syntax
HTML সিনট্যাক্স (Syntax) হলো HTML কোড লেখার নিয়মাবলী এবং কাঠামো যা ব্রাউজারকে নির্দেশ করে কিভাবে ওয়েব পেজের বিভিন্ন উপাদানগুলো প্রদর্শন করতে হবে। সঠিক সিনট্যাক্স ব্যবহারের মাধ্যমে ওয়েব পেজের কার্যকারিতা এবং রেন্ডারিং প্রক্রিয়া নিশ্চিত করা হয়।
HTML সিনট্যাক্সের মৌলিক উপাদান
-
- ডকটাইপ ঘোষণা:
-
- HTML ডকুমেন্টের শুরুর দিকে ডকটাইপ ঘোষণা করা হয়, যা ব্রাউজারকে জানায় যে এটি কোন ধরনের HTML ডকুমেন্ট।
-
- উদাহরণ:
<!DOCTYPE html>
- উদাহরণ:
-
- ডকটাইপ ঘোষণা:
-
- HTML ট্যাগ:
-
- HTML ডকুমেন্টটি
<html>ট্যাগ দিয়ে শুরু হয় এবং এটি<html>ট্যাগ দিয়ে শেষ হয়।
- HTML ডকুমেন্টটি
-
- উদাহরণ:
<html> ... </html>
- উদাহরণ:
-
- HTML ট্যাগ:
-
- হেড এবং বডি:
-
<head>: ডকুমেন্টের মেটাডেটা, শিরোনাম, এবং লিঙ্ক সংযুক্ত করার জন্য ব্যবহৃত হয়।
-
<body>: ওয়েব পেজের দৃশ্যমান উপাদানগুলি এখানে রাখা হয়।
-
- উদাহরণ:
<head> <title>My Page Title</title> </head> <body> <h1>Hello, World!</h1> </body>
- উদাহরণ:
-
- হেড এবং বডি:
-
- ট্যাগের গঠন:
-
- একটি ট্যাগের মধ্যে কনটেন্ট থাকতে পারে। ট্যাগগুলি সাধারণত একটি খোলা ট্যাগ এবং একটি বন্ধ ট্যাগের সমন্বয়ে গঠিত হয়।
-
- উদাহরণ:
<p>This is a paragraph.</p>
- উদাহরণ:
-
- ট্যাগের গঠন:
-
- অ্যাট্রিবিউট:
-
- ট্যাগের সাথে অতিরিক্ত তথ্য যুক্ত করতে অ্যাট্রিবিউট ব্যবহার করা হয়। অ্যাট্রিবিউটগুলোর নাম এবং মান থাকে।
-
- উদাহরণ:
<a href="https://www.example.com" target="_blank">Visit Example</a>
- উদাহরণ:
-
- অ্যাট্রিবিউট:
-
- স্বয়ংসম্পূর্ণ ট্যাগ:
-
- কিছু ট্যাগ স্বয়ংসম্পূর্ণ, অর্থাৎ তারা খোলা ও বন্ধ ট্যাগ ছাড়া কাজ করে।
-
- উদাহরণ:
<img src="image.jpg" alt="Image Description"/>
- উদাহরণ:
-
- স্বয়ংসম্পূর্ণ ট্যাগ:
<!DOCTYPE html>
<html>
<head>
<title>Sample HTML Page</title>
</head>
<body>
<h1>Welcome to My Website</h1>
<p>This is a simple paragraph.</p>
<a href="https://www.example.com" target="_blank">Click here to visit Example.com</a>
<img src="image.jpg" alt="Sample Image"/>
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
</body>
</html> সারসংক্ষেপ -
- ডকটাইপ: ব্রাউজারকে ডকুমেন্টের ধরন জানায়।
-
- ট্যাগ: উপাদানের গঠন নির্দেশ করে।
-
- অ্যাট্রিবিউট: ট্যাগগুলোর সাথে অতিরিক্ত তথ্য যোগ করে।
-
- স্বয়ংসম্পূর্ণ ট্যাগ: এককভাবে কাজ করে, বন্ধ ট্যাগের প্রয়োজন নেই
VIDEO - MCQ বহুনির্বাচনি
No Content
জ্ঞানমূলক ও অনুধাবন
হোমপেজ কী?
ওয়েবসাইটে প্রথম ঢুকলে যে পেজটি প্রদর্শিত হয় সেটিকে হোমপেজ বলা হয়।
ওয়েবসাইট কী?
একই ডোমেইনের অধীনে একাধিক ওয়েবপেজের সমষ্টিকে ওয়েবসাইট বলা হয়।
ওয়েব সার্ভার কী?
ওয়েবসাইটকে যেখানে হোস্ট করা হয় তাকে ওয়েবসার্ভার বলা হয়।
www কী?
World Wide Web কে সংক্ষেপে www বলা হয় যা সাধারণভাবে ওয়েব নামেই বেশি পরিচিত। মূলত ইন্টারনেটের মাধ্যমে পরস্পরের সাথে যুক্ত হাইপার টেক্সট ডকুমেন্টগুলো নিয়ে কাজ করার প্রক্রিয়াই ওয়ার্ল্ড ওয়াইড ওয়েব নামে পরিচিত।
wwww পরিচিতি বা পূর্ণরূপ লেখ।
wwww পরিচিতি বা পূর্ণরূপ হলো- World Wide Wireless Web.
আইপি অ্যাড্রেস কী?
ইন্টারনেটে যুক্ত প্রতিটি কম্পিউটারের একটি ঠিকানা থাকে। এ ঠিকানাকে আইপি এ্যাড্রেস (IP Address) বলা হয় ।
ডোমেইন নেম কী?
আইপি এ্যাড্রেসকে সহজে ব্যবহারযোগ্য করার জন্য ইংরেজি অক্ষরের কোন নাম ব্যবহার করা হয়। ক্যারেক্টার ফর্মের দেয়া কম্পিউটারের এরূপ নামকে ডোমেইন নেম বলা হয় ।
VIDEO - সৃজনশীল প্রশ্নোত্তর
No Content
