হাইপারটেক্স্ট ওয়েব পেজগুলো (HTML ডকুমেন্ট) কীভাবে একে অপরের সাথে লিংক করা থাকে তা বোঝায়। তাই, একটি ওয়েব পেজে উপলব্ধ লিংককে হাইপারটেক্সট বলা হয়। নাম অনুযায়ী, HTML একটি Markup Language যার মানে আপনি HTML ব্যবহার করে শুধু একটি টেক্সট ডকুমেন্টকে ট্যাগ দিয়ে "mark-up" করেন যাতে ওয়েব ব্রাউজার সেটি কীভাবে স্ট্রাকচার করে ডিসপ্লে করবে সেটি বুঝতে পারে। এটি হলো Hypertext Markup Language, এবং এটি ওয়েব পেজ লিখতে সবচেয়ে ব্যাপকভাবে ব্যবহৃত ভাষা।
HTML5 HTML স্ট্যান্ডার্ডের পরের বড় রিভিশন যা HTML 4.01, XHTML 1.0, এবং XHTML 1.1 কে সুপারসিড করে। HTML5 ওয়ার্ল্ড ওয়াইড ওয়েবে কন্টেন্ট স্ট্রাকচারিং এবং প্রেজেন্টেশনের জন্য একটি স্ট্যান্ডার্ড। নতুন স্ট্যান্ডার্ডে ভিডিও প্লেব্যাক এবং ড্র্যাগ-অ্যান্ড-ড্রপের মতো ফিচার অন্তর্ভুক্ত যা পূর্বে থার্ড-পার্টি ব্রাউজার প্লাগ-ইন যেমন Adobe Flash, Microsoft Silverlight, এবং Google Gears-এ নির্ভরশীল ছিল।
HTML Doctype
যখনই আপনি একটি HTML ডকুমেন্ট তৈরি করেন, doctype হলো ডকুমেন্টে রাখা প্রথম জিনিস। এটি ওয়েব ব্রাউজারকে বোঝায় এই পেজটি HTML-এর কোন ভার্সনে লেখা হয়েছে। এটি কেস-সেনসিটিভ নয়।
HTML5 doctype:
<!DOCTYPE html>
HTML Character Encoding
HTML-এ charset অ্যাট্রিবিউট <meta>-এর সাথে ব্যবহার হয় ক্যারেক্টার এনকোডিং নির্দিষ্ট করতে।
সিনট্যাক্স নিচের মত:
<meta charset="char_set">
উপরে, char_set হলো ক্যারেক্টার সেট যা HTML ডকুমেন্টের ক্যারেক্টার এনকোডিং নির্দিষ্ট করে।
এখন ক্যারেক্টার এনকোডিং নির্দিষ্ট করার একটি উদাহরণ দেখি:
উদাহরণ
<!DOCTYPE html> <html> <head> <meta charset = "UTF-8"> </head> <body> <h2>Example</h2> <p>We have added demo text:<p> <textarea rows = "4" cols = "50"> Here, we are mentioned the demo content. This is just to display an example of charset in an HTML document. </textarea><br> <button type = "button">Previous</button> <button type = "button">Next</button> </body> </html>
আউটপুট
HTML Headings
যেকোনো ডকুমেন্ট হেডিংয়ে শুরু হয়। আপনি আপনার হেডিংগুলোর জন্য ভিন্ন আকার ব্যবহার করতে পারেন। HTML-এ ছয় লেভেল হেডিং আছে, যা <h1>, <h2>, <h3>, <h4>, <h5>, এবং <h6> এলিমেন্টগুলো ব্যবহার করে। যেকোনো হেডিং ডিসপ্লে করার সময়, ব্রাউজার তার আগে এবং পরে একটি লাইন যোগ করে।
HTML Elements
একটি HTML এলিমেন্ট একটি স্টার্টিং ট্যাগ দ্বারা ডিফাইন হয়। যদি এলিমেন্টে অন্যান্য কন্টেন্ট থাকে, তবে এটি একটি ক্লোজিং ট্যাগ দিয়ে শেষ হয়, যেখানে এলিমেন্টের নামের আগে একটি ফরওয়ার্ড স্ল্যাশ থাকে।
HTML Attributes
একটি অ্যাট্রিবিউট একটি HTML এলিমেন্টের বৈশিষ্ট্য সংজ্ঞায়িত করতে ব্যবহৃত হয় এবং এলিমেন্টের ওপেনিং ট্যাগের ভিতরে রাখা হয়। সব অ্যাট্রিবিউট দুটি অংশ থেকে তৈরি: একটি name এবং একটি value। উদাহরণস্বরূপ:
<canvas id=”newCanvas” width=”400” height=”300”>
অন্যান্য উদাহরণ شامل:
<img alt = ”alternate text”>
HTML5 স্ট্যান্ডার্ড অনুযায়ী অ্যাট্রিবিউটের চারপাশে কোটেশন মার্ক দেওয়া বাধ্যতামূলক নয়, তবে এটি সবসময় ভালো অভ্যাস।
HTML Formatting
ফরম্যাটিং মানে আমরা কীভাবে একটি ওয়েব পেজে টেক্সট ফরম্যাট করতে পারি HTML-এ। এতে-bold text, italic text, strike text, highlight a text, ইত্যাদি থাকে। একটি উদাহরণ দেখি:
উদাহরণ
<!DOCTYPE html> <html> <body> <h2>Tags for formatting text in HTML</h2> <strong>Strong text</strong><br> <b>Bold text</b><br> <em>Emphasized text</em><br> <i>Italic Text</i><br> <mark>Highlighted text</mark> </body> </html>
আউটপুট
HTML Comments
HTML কমেন্টগুলো <!-- ... --> ট্যাগের মাঝপথে রাখা হয়। তাই, <!-- ... --> ট্যাগের মধ্যে রাখা যেকোনো কন্টেন্ট কমেন্ট হিসেবে বিবেচিত হবে এবং ব্রাউজার দ্বারা সম্পূর্ণরূপে উপেক্ষা করা হবে।
