<data>
বর্ণনা ঃ
<datalist>
<dd>
<dl>
<details>
<dfn>
<dialog>
<div>
<dl>
<dt>
<em>
<embed>
<fieldset>
<figure>
<figcaption>
Friday, May 11, 2018
html tags list description
Md Ashikuzzaman
May 11, 2018
0
<data>
বর্ণনা ঃ
<datalist>
<dd>
<dl>
<details>
<dfn>
<dialog>
<div>
<dl>
<dt>
<em>
<embed>
<fieldset>
<figure>
<figcaption>
Monday, May 7, 2018
html tags list example
Md Ashikuzzaman
May 07, 2018
0
HTML TAGS LIST EXAMPLE ২য় পর্ব
html tags list example. Tag আর attribute এর মাধ্যমে এইচটিএমএল প্রকাশিত হয় কিন্তু Tag আর attribute এর নাম প্রকাশিত হয় না ; Tag এর মাঝে যা থাকে তাই প্রকাশিত হয় | নিচে উদাহরণ সহ ব্যাখ্যা করা হলো ঃ
<b>
বর্ণনা ঃ এটা হচ্ছে কোন Word বা Sentence কে মোটা করার ট্যাগ |উদাহরনঃ
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>
<!-- This Tutorial created by Md Ashikuzzaman -->
<p> <b>Bangladesh</b>is a beautifull country </p>
</body>
</html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>
<!-- This Tutorial created by Md Ashikuzzaman -->
<p> <b>Bangladesh</b>is a beautifull country </p>
</body>
</html>
উপরের কোড টি ব্রাউজারে রান করলে দেখতে পাবেন ঃ
Bangladesh is a beautifull country
নোট ঃ কোন Word বা Sentence কে css দিয়ে মোটা করায় ভালো |
<bdo>
বর্ণনা ঃ word বা sentence কে ডান পাশ থেকে বাম পাশে অথবা বাম পাশ থেকে ডান পাশে নেওয়ার ট্যাগ |উদাহরণ ঃ
লেখা বাম পাশ থেকে শুরু করার জন্য <bdo> ট্যাগ যেভাবে লিখতে হয় ঃ
<bdo dir="ltr">
<p> লেখা বামপাশ থেকে শুরু হবে </p>
</bdo>
<p> লেখা বামপাশ থেকে শুরু হবে </p>
</bdo>
রেজাল্ট ঃ লেখা বামপাশ থেকে শুরু হবে
লেখা ডান পাশ থেকে শুরু করার জন্য <bdo> ট্যাগ যেভাবে লিখতে হয় ঃ
<bdo dir="rtl">
<p> লেখা ডানপাশ থেকে শুরু হবে </p>
</bdo>
<p> লেখা ডানপাশ থেকে শুরু হবে </p>
</bdo>
রেজাল্ট ঃ লেখা ডানপাশ থেকে শুরু হবে
নোট ঃ <bdo> ট্যাগ টি direction attribute এর সাহায্যে পরিচালিত হয় | direction কে সংক্ষেপে dir লেখা হয় |
dir="ltr" মানে হলো ঃ Left To Right
dir ="rtl" মানে হলো ঃ Right to Left
dir="ltr" মানে হলো ঃ Left To Right
dir ="rtl" মানে হলো ঃ Right to Left
<blockquote>
বর্ণনা ঃ এটা হচ্ছে উক্তি বা মন্তব্য দেওয়ার ট্যাগ |উদাহরণ ঃ
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>
<!-- This Tutorial created by Md Ashikuzzaman -->
<p> পাপ সম্পর্কে কাজী নজরুল ইসলাম বলেছেন</p>
<blockquote>---------------------------------------------- <!-- <blockquote> শুরু -->
এ পাপ মুলুকে পাপ করেনি ক কে আছে পুরুষ নারী , আমরা ত ছার - পাপে পঙ্কিল পাপীদের কাণ্ডারি
</blockquote>-------------------------------------------------- <!-- </blockquote> শেষ -->
</body>
</html>
উপরের কোড টি ব্রাউজারে রান করলে দেখতে পাবেন ঃ<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>
<!-- This Tutorial created by Md Ashikuzzaman -->
<p> পাপ সম্পর্কে কাজী নজরুল ইসলাম বলেছেন</p>
<blockquote>---------------------------------------------- <!-- <blockquote> শুরু -->
এ পাপ মুলুকে পাপ করেনি ক কে আছে পুরুষ নারী , আমরা ত ছার - পাপে পঙ্কিল পাপীদের কাণ্ডারি
</blockquote>-------------------------------------------------- <!-- </blockquote> শেষ -->
</body>
</html>
পাপ সম্পর্কে কাজী নজরুল ইসলাম বলেছেন
এ পাপ মুলুকে পাপ করেনি ক কে আছে পুরুষ নারী , আমরা ত ছার - পাপে পঙ্কিল পাপীদের কাণ্ডারি
<body>
বর্ণনা ঃ এটা হচ্ছে এইচটিএমএল পেইজ এর বডি সনাক্ত করার ট্যাগ | বডি ট্যাগ এর ভিতরে যা থকে তাই আমরা দেখতে পাই |উদাহরণ ঃ
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>---------------------------------------------------------- <-- <body> শুরু -- >
<!-- This Tutorials created by Md Ashikuzzaman -->
<p> Bangladesh is a beautiful country </p>
</body>----------------------------------------------------------- <!-- </body> শেষ -->
</html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>---------------------------------------------------------- <-- <body> শুরু -- >
<!-- This Tutorials created by Md Ashikuzzaman -->
<p> Bangladesh is a beautiful country </p>
</body>----------------------------------------------------------- <!-- </body> শেষ -->
</html>
Bangladesh is a beautiful country
<br/>
বর্ণনা ঃ লেখার মাঝে ব্রেক দেওয়ার জন্য এই ট্যাগ ব্যবহৃত হয় |উদাহরণ ঃ <br/> ট্যাগ বিহীন একটি প্যারাগ্রাফ
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>
<!-- This Tutorial created by Md Ashikuzzaman -->
<p>Bangladesh ,Dhaka,Mirpur,Bonani </p>
</body>
</html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>
<!-- This Tutorial created by Md Ashikuzzaman -->
<p>Bangladesh ,Dhaka,Mirpur,Bonani </p>
</body>
</html>
উপরের কোড টি ব্রাউজারে রান করলে দেখতে পাবেন ঃ
Bangladesh ,Dhaka,Mirpur,Bonani
উদাহরণ ঃ <br/> ট্যাগ সহ একটি প্যারাগ্রাফ
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>
<!-- This Tutorial created by Md Ashikuzzaman -->
<p>Bangladesh <br /> Dhaka <br />Mirpur <br />Bonani </p>
</body>
</html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>
<!-- This Tutorial created by Md Ashikuzzaman -->
<p>Bangladesh <br /> Dhaka <br />Mirpur <br />Bonani </p>
</body>
</html>
উপরের কোড টি ব্রাউজারে রান করলে দেখতে পাবেন ঃ
Bangladesh
Dhaka
Mirpur
Bonani
নোট ঃ এটি একটি single tag
<button>
বর্ণনা ঃ বাটন তৈরি করতে এই ট্যাগ ব্যবহৃত হয় | বাটন এ ক্লিক করলে কোন কিছু একটা ঘটে | বাটন কে সুন্দর করতে সিএসএস ব্যবহার করা হয় |উদাহরণ ঃ
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>
<!-- This Tutorial created by Md Ashikuzzaman -->
<button onclick="alert('আপনি বাটন সম্পর্কে বাটন চ্যাপ্টারে বিস্তারিত জানতে পারবেন ')">CLICK ME </button>
</body>
</html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>
<!-- This Tutorial created by Md Ashikuzzaman -->
<button onclick="alert('আপনি বাটন সম্পর্কে বাটন চ্যাপ্টারে বিস্তারিত জানতে পারবেন ')">CLICK ME </button>
</body>
</html>
উপরের কোড টি ব্রাউজারে রান করলে দেখতে পাবেন ঃ
<canvas>
বর্ণনা ঃ গ্রাফিক্স জাতীয় কাজে এই ট্যাগ ব্যবহৃত হয় |নোটঃ <canvas> ট্যাগের কাজ বুঝতে হলে আপনাকে জাভাস্ক্রিপ্ট শিখতে হবে |
<caption>
বর্ণনা ঃ টেবিল এ ক্যাপশন দেওয়ার জন্য এ ট্যাগ দেওয়া হয় |
<caption> Tag এর উদাহরণ ঃ
<caption> Tag এর উদাহরণ ঃ
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>This is HTML Tutorials</title>
</head>
<body>
<table> <!--<table> ট্যাগ শুরু -->
<td>Name</td>
<td>Old</td>
<td>Expart</td>
</tr>
</table> <!-- </table> ট্যাগ শেষ-->
</body>
</html>
বিস্তারিত জানতে HTML TABLE TAG DESCRIPTION পড়ুন <html lang="en-US">
<head>
<meta charset="UTF-8">
<title>This is HTML Tutorials</title>
</head>
<body>
<table> <!--<table> ট্যাগ শুরু -->
<caption>Employ List</caption>
<tr><td>Name</td>
<td>Old</td>
<td>Expart</td>
</tr>
</table> <!-- </table> ট্যাগ শেষ-->
</body>
</html>
<cite>
বর্ণনা ঃ একটি কাজের শিরোনাম দেওয়ার জন্য এ ট্যাগ ব্যবহৃত হয় |
<cite> ব্যবহারের নিয়ম ঃ
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>This is HTML Tutorials</title>
</head>
<body>
<p>This is a <cite>HTML</cite> tutorials</p>
</body>
</html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>This is HTML Tutorials</title>
</head>
<body>
<p>This is a <cite>HTML</cite> tutorials</p>
</body>
</html>
<code>
বর্ণনা ঃ কম্পিউটারের কোন বিষয় কে চিহ্নিত করার জন্য <code> ট্যাগ ব্যবহৃত হয় |
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>This is HTML Tutorials</title>
</head>
<body>
<p><code> This is computer code</code> and this is normal paragraph </p>
</body>
</html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>This is HTML Tutorials</title>
</head>
<body>
<p><code> This is computer code</code> and this is normal paragraph </p>
</body>
</html>
Saturday, May 5, 2018
How to Create GMAIL Account
এই টিউটোরিয়াল টি পড়ে আপনি যা শিখবেন ঃ- gmail account কিভাবে খুলে
 |
| Gmail |
step# 1 NEW ACCOUNT এই লিঙ্কে প্রবেশ করুন |
তখন আপনি নিচের ছবির মত একটি পেইজ পাবেন
Step #2 First name
First name এর জায়গায় আপনার নামের প্রথম অংশ লিখুন |
Step #3 Last name
Last name এর জায়গায় আপনার নামের শেষ অংশ লিখুন
Step #4 Username
Username এর জায়গায় আপনি যে নামে Gmail Account খুলতে চান তা লিখুন
Strep #5 Password
Password এর জায়গায় Password সেট করুন |
Password সেট করার সময় আপনি [ A-Z ] , [a-z ] , [0-9] এবং যে কোন symbol ব্যবহার করতে পারবেন |
মনে রাখবেন - Password টি সর্বনিম্ন ৮ সংখ্যার হতে হবে |
Step #6 Confirm password
Confirm password এর জায়গায় একটু আগে যে password সেট করেছিলেন , সেটি আবার লিখুন
Step #7 NEXT
এখন আপনি NEXT বাটনে ক্লিক করুন |
Step #8 Phone verification
আপনি ঠিকঠাক মত সব তথ্য দিলে আপনার সামনে নিচের ছবির মত একটি পেইজ আসবে | তখন আপনি Step #9 ফলো করবেন |
যেমন ঃ dhakabangladesh1971 অথবা yourname2020
Step #9 Phone number
Phone number এর জায়গায় আপনার নিজের Phone number টি লিখুন |
Step #10 NEXT
এখন আপনি NEXT বাটনে ক্লিক করুন |
Step #11 Message
গুগল থেকে আপনার মোবাইলে একটি ম্যাসেজ আসবে , সেখানে একটি কোড পাবেন ; সেটি মনে রাখুন অথবা কোথাও লিখে রাখুন
নোট ঃ G-495498 is your Google verification code.এটা আমার কোড , আপনাদের কোড ও দেখতে এ রকমই হবে | আপনি যখন কোডটি verification করাবেন তখন G- ছাড়া যা আছে তা লেখবেন |
Step #12 Verification code
যে কোড টি পেয়েছেন সেটি Enter verification code এর জায়গায় লিখুন
Step #13 Welcome to Google
সবকিছু ঠিকঠাক থাকলে আপনাকে Welcome to Google পেইজে নিয়ে যাবে , যেটি দেখতে নিচের ছবির মত |
এই পেইজে আপনার নামের প্রথম অংশ , আপনার gmail address আর ফোন নাম্বার দেখতে পাবেন | আপনার ব্যক্তিগত কিছু তথ্য ঠিকঠাক দিয়ে পেইজটি পূরণ করুন | ছবির নিছে বিস্তারিত লিখে দিলাম |
Month এর জায়গায় আপনার জন্ম সালের মাসের নাম লিখুন , Day এর জায়গায় আপনার জন্ম তারিখ লিখুন , Year এর জায়গায় আপনি যে সালে জন্ম গ্রহণ তা লিখুন , Gender এর জায়গায় আপনি Male (পুরুষ ) নাকি Female ( নারী ) তা লিখে NEXT বাটনে ক্লিক করুন |
Step #14 Privacy and Terms
আপনার সামনে Privacy and Terms নামে নিচের ছবির মত একটি পেইজ আসবে সেখানে আপনি I AGREE লেখা বাটনে ক্লিক করুন |
Step #15 My Account
সবকিছু ঠিক থাকলে আপনার সামনে My Account নামে নিচের ছবির মত একটি পেইজ আসবে | এখানে আপনার প্রোফাইল সেটআপ করতে পারেন অথবা Gmail inbox এ গিয়ে দেখে আসতে পারেন গুগল থেকে পাঠানো আপনার জীবনের প্রথম Email |
তৈরি হয়ে গেল আপনার Gmail Account
শেষকথা ঃ
আপনার password টি মনে রাখুন | এই একটি gmail account দিয়ে আপনি গুগলের সব Apps ব্যবহার করতে পারবেন | আপনি যদি এই টিউটোরিয়াল পড়ে উপকৃত হয়ে থাকেন, তাহলে Facebook আর Google+ এ শেয়ার করে অন্যকে সুযোগ করে দিন |Friday, May 4, 2018
html tags list bangla tutorials
Md Ashikuzzaman
May 04, 2018
0
html tags list ই মূলত এইচটিএমএল এর প্রধান উপাদান | Tag আর attribute এর মাধ্যমে এইচটিএমএল প্রকাশিত হয় কিন্তু Tag আর attribute এর নাম প্রকাশিত হয় না ; Tag এর মাঝে যা থাকে তাই প্রকাশিত হয় |
Bangladesh is a small but beautifull country
উদাহরনঃ
< !-- This Tutorials create by Md Ashikuzzaman -->
বর্ণনা ঃ এটা হছে HTML এর ভার্সন ঘোষণা করার ট্যাগ | একটি এইচটিএমএল পেইজে সর্ব প্রথম এই ট্যাগ ব্যবহার করতে হয় |
উদাহরনঃ
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html/strict.dtd">
উদাহরনঃ
যেভাবে <a> এর সাহায্যে লিঙ্ক দেওয়া হয় |
<a href="https://webbeginnertips.blogspot.com/2018/05/introduction-of-html.html"> Indruction of html </a>
এখানে ক্লিক করে টেস্ট করুন
যেমন ঃ WHO = World Health Organization
রেজাল্ট ঃ নিচের WHO লেখার উপর মাউস নিলে আপনি এর abbreviation দেখতে পারবেন |
উদাহরণ ঃ
নোট ঃ এই ট্যাগ ব্যবহার না করলেও এইচটিএমএল পেইজে কোন সমস্যা হয়না কিন্তু SEO তে ভালো রেজাল্ট করার জন্য এ ট্যাগটি ব্যবহার করা বাধ্যতামূলক |
উদাহরণ ঃ
উদাহরণ ঃ
<audio src="https://freesound.org/people/InspectorJ/sounds/419231/" controls></audio>
HTML TAGS LIST WITH EXAMPLE ২য় পর্ব
 |
| html tag structure |
HTML TAGS LIST পর্ব ১
নিচের কোডটি Notepad++ লিখলে ঃ
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>
<p>Bangladesh is a small but beautifull country</p>
</body>
</html>
Browser এ প্রকাশিত হবে ঃ<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>
<p>Bangladesh is a small but beautifull country</p>
</body>
</html>
Bangladesh is a small but beautifull country
<body>
<p>এখানে যা লেখবেন ব্রাউজারে তা প্রকাশিত হবে </p>
<h1>এখানে যা লেখবেন ব্রাউজারে তা প্রকাশিত হবে </h1>
</body>
<p>এখানে যা লেখবেন ব্রাউজারে তা প্রকাশিত হবে </p>
<h1>এখানে যা লেখবেন ব্রাউজারে তা প্রকাশিত হবে </h1>
</body>
html tags list with description
<!-- -->
বর্ণনা ঃ এটা হচ্ছে comment করার ট্যাগ | এর মাঝে যা কিছু লেখবেন তা ব্রাউজারে প্রকাশিত হবে না | HTML পেইজের যে কোন জায়গায় এই ট্যাগ ব্যবহার করেত পারবেন |উদাহরনঃ
< !-- This Tutorials create by Md Ashikuzzaman -->
এইচটিএমএল পেইজে যেভাবে কমেন্ট করা হয় ঃ
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>
<!-- This Tutorials created by Md Ashikuzzaman --> <p>Bangladesh is a small but beautifull country</p>
</body>
</html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>
<!-- This Tutorials created by Md Ashikuzzaman --> <p>Bangladesh is a small but beautifull country</p>
</body>
</html>
<!DOCTYPE >
উদাহরনঃ
এইচটিএমএল ৫ এর <!DOCTYPE > নিম্নরূপ ঃ
<!DOCTYPE HTML><html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>
<!-- This Tutorials created by Md Ashikuzzaman -->
<p>Bangladesh is a small but beautifull country</p>
</body>
</html>
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>
<!-- This Tutorials created by Md Ashikuzzaman -->
<p>Bangladesh is a small but beautifull country</p>
</body>
</html>
এইচটিএমএল 4.01 এর <!DOCTYPE > নিম্নরূপ ঃ
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html/strict.dtd">
<a>
বর্ণনা ঃ এটা হচ্ছে লিঙ্ক দেওয়ার ট্যাগ | লিঙ্ক এর সাহায্যে এক পেইজ থেকে আরেক পেইজে যাওয়া যায় , এক ওয়েবসাইট থেকে আরেক ওয়েবসাইটে যাওয়া যায় |উদাহরনঃ
যেভাবে <a> এর সাহায্যে লিঙ্ক দেওয়া হয় |
<a href="https://webbeginnertips.blogspot.com/2018/05/introduction-of-html.html"> Indruction of html </a>
এখানে ক্লিক করে টেস্ট করুন
<abbr>
বর্ণনা ঃ এটা হচ্ছে abbreviation দেওয়ার Tag |যেমন ঃ WHO = World Health Organization
এইচটিএমএল পেইজে যেভাবে <abbr> ট্যাগ ব্যবহৃত হয়ঃ
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>
<!-- This Tutorials created by Md Ashikuzzaman -->
<p> The <abbr title="World Health Organization">WHO</abbr> is an International Organization</p>
</body>
</html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>We Love Bangladesh</title>
</head>
<body>
<!-- This Tutorials created by Md Ashikuzzaman -->
<p> The <abbr title="World Health Organization">WHO</abbr> is an International Organization</p>
</body>
</html>
রেজাল্ট ঃ নিচের WHO লেখার উপর মাউস নিলে আপনি এর abbreviation দেখতে পারবেন |
WHO
নোট ঃ <abbr> ট্যাগ ছাড়া শুধুমাত্র title attribute ব্যবহার করে abbreviation দেওয়া যায় কিন্তু search engine সেটাকে abbreviation হিসেবে গন্য করেনা | তাই কোন word এর abbreviation দেওয়ার জন্য <abbr> ট্যাগ ব্যবহার করা বাধ্যতামূলক |
<address>
বর্ণনা ঃ এটা হচ্ছে ঠিকানা বা Address দেওয়ার Tag |উদাহরণ ঃ
<address>
Name :Ashikuzzaman <br />
country : Bangladesh
</address>
Name :Ashikuzzaman <br />
country : Bangladesh
</address>
<area>
বর্ণনা ঃ এটা হচ্ছে ইমেজ ম্যাপ এর এরিয়া চিহ্নিত করার Tag |
নোট ঃ এটি একটি single tag
<article>
বর্ণনা ঃ এটা হচ্ছে ওয়েবসাইটে আর্টিকেল বা প্রবন্ধ লেখার Tag |
নোট ঃ ব্লগ বা পত্রিকার ওয়েবসাইটে এ ট্যাগটি সর্বাধিক ব্যবহৃত হয় |
উদাহরণ ঃএইচটিএমএল পেইজে যেভাবে <article> ট্যাগ টি ব্যবহৃত হয়ঃ
<article>
<h1>Bangladesh</h1>
<p>Bangladesh is a small country but very nice</p>
</article>
<h1>Bangladesh</h1>
<p>Bangladesh is a small country but very nice</p>
</article>
নোট ঃ এই ট্যাগ ব্যবহার না করলেও এইচটিএমএল পেইজে কোন সমস্যা হয়না কিন্তু SEO তে ভালো রেজাল্ট করার জন্য এ ট্যাগটি ব্যবহার করা বাধ্যতামূলক |
<aside>
বর্ণনা ঃ এটা হচ্ছে Website এর sidebar চিহ্নিত করার ট্যাগ |উদাহরণ ঃ
এইচটিএমএল পেইজে যেভাবে <aside> ট্যাগটি ব্যবহৃত হয় ঃ
<aside>
<div>
<h1>popular post </h1>
<ul>
<li><a href="#">HTML</a></li>
<li><a href="#">CSS</a></li>
</ul>
</div>
</aside>
<div>
<h1>popular post </h1>
<ul>
<li><a href="#">HTML</a></li>
<li><a href="#">CSS</a></li>
</ul>
</div>
</aside>
নোট ঃ এই ট্যাগ ব্যবহার না করলেও এইচটিএমএল পেইজে কোন সমস্যা হয়না কিন্তু SEO তে ভালো রেজাল্ট করার জন্য এ ট্যাগটি ব্যবহার করা বাধ্যতামূলক |
<audio>
বর্ণনা ঃ এটা হচ্ছে Website এ অডিও গান বা অডিও শব্দ দেওয়ার ট্যাগ |উদাহরণ ঃ
<audio src="https://freesound.org/people/InspectorJ/sounds/419231/" controls></audio>
HTML TAGS LIST WITH EXAMPLE ২য় পর্ব
Thursday, May 3, 2018
Introduction of html
Md Ashikuzzaman
May 03, 2018
0
What is HTML ?
একটি ওয়েবসাইট বা Apps এর প্রথম ও প্রধান এবং সবচেয়ে গুরুত্ব পূর্ণ উপাদান হচ্ছে HTML | প্রাণ ব্যতিত প্রাণী যেমন মৃত ; তেমনি HTML ব্যতিত website মৃত | আরও ভালো করে বললে বলা যায় - এইচটিএমএল ছাড়া কোন প্রকারের ওয়েবসাইট তৈরি করা যায় না |
website বা Apps তৈরি করা শিখতে চাইলে প্রথমে শিখতে হবে - HTML.
এইচটিএমএল দিয়ে কি করা হয়ঃ
- একটি ওয়েবসাইট বা apps এর structure বা মূল কাঠামো গঠন করা হয় |
- Tag আর Attribute এর মাধ্যমে এইচটিএমএল প্রকাশিত হয় |
- কয়েকটি Tag ব্যতিত প্রতিটি Tag জোড়ায় জোড়ায় থাকে |
what is Tag ?
এইচটিএমএল এর প্রতিটি Element বা উপাদান কে Tag বলে |কয়েকটি Tag এর উদারনঃ
- <!DOCTYPE HTML> এই ট্যাগ দিয়ে এইচটিএমএল এর ভার্সন ঘোষণা করা করা হয় |
- <html></html> এটা হচ্ছে এইচটিএমএল এর মূল ট্যাগ , এর ভিতরে সব ট্যাগ রাখা হয় |
- <body></body>
- <h1></h1>
- <p></p>
নোটঃ Tag এর নাম শুরু হয় < ( left angle sign ) দিয়ে আর শেষ হয় > ( right angle sign ) দিয়ে |
Opening Tag :
/ স্ল্যাস চিহ্ন বিহীন Tag কে Opening Tag বলে |যেমন ঃ
<body>
Closing Tag:
/ স্ল্যাস চিহ্ন যুক্ত Tag কে Closing Tag বলে |
যেমন ঃ
</body>
Single Tag :
এইচটিএমএল এর কয়েকটি Single Tag আছে ; যাদের কোন Closing Tag নেই , Single Tag কে / স্ল্যাস চিহ্ন যুক্ত করে বা যুক্ত না করেও ব্যবহার করা যায় |
যেমনঃ
- <img>
- <br>
- <hr>
অথবা
- <img/>
- <br/>
- <hr/>
নোটঃ / স্ল্যাস চিহ্ন যুক্ত করে ব্যবহার করাই ভালো |
What is attribute ?
Attribute এর মাধ্যমে একটি এইচটিএমএল পেইজ অতিরিক্ত তথ্য প্রকাশ করে, Attribute কে ধরে css দিয়ে এইচটিএমএল পেইজ কে সুন্দর ও নান্দনিক করা হয় |কয়েকটি Attribute এর উদারন ঃ
- style
- class
- id
- loop
- size
- title
- name
- valu
যেমনঃ
<p title=" dhaka">Bangladesh</p>
লাল চিহ্নিত অংশটুকু হলো p ট্যাগ এর Opening Tag |
<p title="dhaka">Bangladesh</p>
কমলা চিহ্নিত অংশটুকু হলো p ট্যাগ এর Attribute |
History of HTML / এইচটিএমএল এর ইতিহাস
 |
| Tim Berners-Lee |
এইচটিএমএল এর আবিষ্কারক ঃ
পদার্থ বিজ্ঞানী Tim Berners-Lee ১৯৮৯ সালে এইচটিএমএল ল্যাঙ্গুয়েজ টি আবিষ্কার , তখন তিনি নাসা'তে কর্মরত ছিলেন |W3C
এইচটিএমএল কে নিয়ন্ত্রন , রূপান্তর ও পরিবর্তন করে যে সংস্থাটি সেটির নাম হলো world wide web consortium , সংক্ষেপে বলা হয় W3C | ১৯৯৬ সাল থেকে Tim Berners-Lee এর সাথে যুক্ত হয় W3C কর্তৃপক্ষ |
এইচটিএমএল এর ভার্সন সমূহ ঃ
- HTML ১৯৯১ সালে কার্যকর হয়
- HTML 2.0 ১৯৯৫ সালে কার্যকর হয়
- HTML 3.2 ১৯৯৭ সালে কার্যকর হয়
- HTML 4.01 ১৯৯৯ সালে কার্যকর হয়
- XHTML ২০০০ সালে কার্যকর হয়
- HTML5 ২০১৪ সালে কার্যকর হয়
এইচটিএমএল শিখতে কি লাগে ঃ
কম্পিউটার অথবা ল্যাপটপ , একটি টেক্সট এডিটর আর Browser লাগে |টেক্সট এডিটর হিসেবে windows এর বিল্ড ইন টেক্সট এডিটর Notepad অথবা Notepad++ ব্যবহার করা যায় |
নোট ঃ Notepad++ ব্যবহার করাই ভালো | এতে প্রচুর সুবিধা পাওয়া যায় |
Browser হিসেবে windows এর বিল্ড ইন Browser Internet Explorer , Google Chrome ,Mozilla Firefox , Safari ও Opera Mini এর মধ্যে যে কোনটি ব্যবহার করতে পারবেন |
নোট ঃ সব সময় Browser এর Latest Version ব্যবহার করবেন |
 |
| google chrome |
 |
| Mozilla Firefox |
