এইচটিএমএল অনুচ্ছেদ. HTML Paragraphs

Paste the translated text here
এইচটিএমএল অনুচ্ছেদ
________________________________________
এইচটিএমএল তথ্য গুলো অনুচ্ছেদ আকারে দেয়া হয়
________________________________________
এইচটিএমএল অনুচ্ছেদ
এইচটিএমএল <p> উপাদান গুলকে অনুচ্ছেদ বলে ।
উদাহরন
<p> এটা একটা অনুচ্ছেদ </p>
<p> এটা আরেকটা অনুচ্ছেদ </p>
ব্রাউজার সয়ংক্রিয় ভাবে শূন্য যাইগা যোগ করে দিবে অনুচ্ছেদ এর আগে ও পরেএইচটিএমএল দেখুন
আপনি নিশ্চিত হতে পারবেন না কিভাবে এইচটিএমএল অনুচ্ছেদ দেখান হবে ।
ছোট অথবা বড় পর্দা এবং আকার পরিবর্তন করা উইন্ডোজ গুলো আলাদা আলাদা দেখাবে ।
এইচটিএমএল দিয়ে আপনি বাইরের জিনিস পরিবর্তন করতে পারবেন না, অথবা অতিরিক্ত ফাকা যাইগা অথবা বেশি সারি রেখে এইচটিএমএল সুত্র এর মাধ্যমে ।
আপনার ব্রাউজার টি পেজ দেখানোর সময় অতিরিক্ত ফাকা জাইগা অথবা সারি মুছে ফেলবে ।
যেকোনো ফাকা জাইগা অথবা ফাকা সারি একটা ফাকা জাইগা হিসেবে ধরা হবে ।
উদাহরন
<p>
এই অনুচ্ছেদটাতে অনেক ফাকা জাইগা আছে কিন্তু ব্রাউজার সেটা গণ্য করবে না

</p>

<p>
এই অনুচ্ছেদটাতে অনেক ফাকা জাইগা আছে কিন্তু ব্রাউজার সেটা গণ্য করবে না

________________________________________
কখনোই শেষ এ ট্যাগ যুক্ত করতে ভুলবেন না ।
অধিকাংশ ব্রাউজারই এইচটিএমএল সঠিকভাবে দেখাবে যদিও আপনি শেষে ট্যাগ যুক্ত করতে ভুলে গিয়ে থাকেন ।
উদাহরন
<p> এটি একটি উদাহরন
<p> এটা আরেকটা উদাহরনTry it Yourself »
উদাহরন গুলো মোটামুটি সবগুল ব্রাউজার এই কাজ করবে কিন্তু এর উপর নির্ভরশীল হওয়া যাবে না ।
শেষে ট্যাগ যুক্ত করতে ভুলে গেলে অনাকাঙ্ক্ষিত ভুল ফলাফল দেখাবে ।
এইচটিএমএল এর উন্নত ভার্সন গুলো যেমন একসএইচটিএমএল আপনাকে শেষে ট্যাগ যুক্ত না করা গ্রহন করবে না ।

এইচটিএমএল লাইন ভাঙা
এইচটিএমএল <br> গুলকে লাইন ভাঙা বলে ।
<br> ব্যাবহার করুন যদি আপনি লাইন ভাঙতে চান নতুন অনুচ্ছেদ শুরু না করেই ।
উদাহরন
<p>This is<br>a para<br>graph with line breaks</p>
নিজে চেষ্টা করুণ
<br> এই উপাদানটি এইচটিএমএল শূন্য উপাদান । এখানে কোন ট্যাগ নেই ।
________________________________________

কবিতার সমস্যা
উদাহরন
<p> এই কবিতাটি এক সারিতে দেখাবে </p>

<p>

বনি সাগরে শুয়ে থাকে
বনি নদিতে শুয়ে থাকে
বনি সাগরে শুয়ে থাকে
ওহ বনিকে আমার কাছে এনে দাও

</p>

নিজে চেষ্টা করুন
________________________________________
এইচটিএমএল <pre> উপাত্ত
এইচটিএমএল <pre> উপাত্ত গুলো আগে থেকে ঠিক করা লেখা বোঝায় যেখানে সঠিক ফাকা যাইগা ও সারি আছে ।
যে কোন কিছু দেখাতে হলে , সঠিক ফাকা যাইগা ও লাইন ভাঙ্গার আপনাকে লেখাটিকে মুড়ে ফেলতে হবে <pre> ।
উদাহরন
<p> এটা কবিতার মত দেখাবে </p>

<pre>

বনি সাগরে শুয়ে থাকে
বনি নদিতে শুয়ে থাকে
বনি সাগরে শুয়ে থাকে
ওহ বনিকে আমার কাছে এনে দাও

</pre> নিজে চেষ্টা করুন
________________________________________
আপনার অভিজ্ঞতা থেকে যাচাই করুন
অভিজ্ঞতা ১ অভিজ্ঞতা ২ অভিজ্ঞতা ৩
________________________________________
এইচটিএমএল ট্যাগ এর সুত্র
W3Schools’ ট্যাগ সুত্র এইচটিএমএল নিয়ে অতিরিক্ত তথ্য আরোপ করে

ট্যাগ বর্ণনা
<p>
অনুচ্ছেদ কে বোঝায়
<br>
একটি লাইন ভাঙা বোঝায়
<pre>
আগে থেকে করা লেখা বোঝায়

এইচটিএমএল এর ভিত্তি এর উদাহরন

Paste the translated text here
এইচটিএমএল এর ভিত্তি এর উদাহরন
ভয় পাবার কারন নেই যদি এই উদাহরন গুলো আপনি না শিখে থাকেন । আপনি পরবর্তী অধ্যায় এ শিখতে পারবেন ।
________________________________________
এইচটিএমএল উপাত্ত
সকল এইচটিএমএল দলিল একটি ঘোষণা দিয়ে শুরু হবে <!DOCTYPE html>.
এইচটিএমএল দলিল নিজে নিজেই এটা দিয়ে শুরু হয় <html> এবং শেষ হয় </html>.
এইচটিএমএল এর দৃশ্যমান অংশ গুলো <body> and </body> এর মধ্যে হয় ।
উদাহরন
<!DOCTYPE html>
<html>
<body><h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>
</html>

Try it Yourself »

________________________________________
এইচটিএমএল শিরনাম
এইচটিএমএল শিরোনাম <h1> থেকে <h6> পর্যন্ত যুক্ত করে সংজ্ঞায়িত করা হয় ।
উদাহরন
<h1>This is a heading</h1>
<h2>This is a heading</h2>
<h3>This is a heading</h3>

Try it Yourself »

________________________________________
এইচটিএমএল অনুচ্ছেদ
HTML অনুচ্ছেদ এভাবে দেখান হয় <p> ।
উদাহরন
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

Try it Yourself »

________________________________________
এইচটিএমএল লিংক
এইচটিএমএল লিংক গুলো এভাবে দেখান হয় <a>
উদাহরন
<a href=”http://bangla.salearningschool.com”>This is a link</a>

Try it Yourself »
লিংক ঠিকানা টি এভাবে আরোপ করা হয় href ।
এইচটিএমএল এর তথ্যগুলো অতিরিক্ত তথ্য দেবার জন্য ব্যাবহার করা হয় ।
________________________________________
এইচটিএমএল ছবি
এইচটিএমএল ছবি গুলো এভাবে যুক্ত করে দেখান হয় <img>
উৎস ফাইল গুলো (src), বিকল্প লেখা (alt), এবং আকার (লম্বা এবং আড়াআড়ি) এভাবে আরোপ করা হয়
উদাহরন
<img src=”w3schools.jpg” alt=”W3Schools.com” width=”104″ height=”142″>

পিএইচপি 5 পরিচিতি । PHP5

পিএইচপি 5 পরিচিতি ।

 পিএইচপি কি ?

• পিএইচপি একটি ব্যাপক ব্যবহৃত , ওপেন সোর্স স্ক্রিপ্টিং ভাষা।
• পিএইচপি একটি আদ্যক্ষর ” পিএইচপি: হাইপারটেক্সট প্রসেসর।
• পিএইচপি বিনামূল্যে ডাউনলোড যোগ্য।

পিএইচপি একটি বিস্ময়কর এবং জনপ্রিয় ভাষা !

এটি ওয়েব (ওয়ার্ডপ্রেস ) উপর সবচেয়ে বড় ব্লগিং সিস্টেম এর মূল হতে যথেষ্ট শক্তিশালী হয়।
এটি বৃহত্তম সামাজিক নেটওয়ার্ক ( ফেসবুক) চালানোর জন্য যথেষ্ট গভীর।

 পিএইচপি ফাইল কি ?

• পিএইচপি ফাইল এ টেক্সট, এইচটিএমএল, সিএসএস, জাভাস্ক্রিপ্ট, এবং পিএইচপি কোড থাকতে পারে।
• পিএইচপি ফাইল এ এক্সটেনশন ” পিএইচপি ” আছে।

 পিএইচপির আগে আপনার নিম্নলিখিত মৌলিক জ্ঞান থাকা উচিত:

• এইচটিএমএল
• সিএসএস
• জাভাস্ক্রিপ্ট

 পিএইচপি কি করতে পারে ?

• পিএইচপি ডাইনামিক কন্টেন্ট পাতা তৈরি করতে পারে।
• পিএইচপি, পড়া, খোলা, নির্মাণ, লিখুন, মুছে ফেলা এবং সার্ভার ফাইল বন্ধ করতে পারে।
• পিএইচপি ফর্ম তথ্য সংগ্রহ করতে পারে।
• পিএইচপি তথ্য পাঠাতে এবং কুকি গ্রহণ করতে পারে।
• পিএইচপি ডাটাবেসের মধ্যে তথ্য, যোগ মুছে দিন এবং পরিবর্তন করতে পারেন
• পিএইচপি ব্যবহারকারীর এক্সেস নিয়ন্ত্রণ করতে ব্যবহার করা যেতে পারে।
• পিএইচপি তথ্য এনক্রিপ্ট করতে পারে।
• পিএইচপি এর আউটপুট এইচটিএমএল এ সীমাবদ্ধ নয়. আপনি আউটপুট ইমেজ, পিডিএফ ফাইল এবং এমনকি ফ্ল্যাশ সিনেমা করতে পারেন।

 পিএইচপি কেন ?

• পিএইচপি বিভিন্ন প্ল্যাটফর্মের (উইন্ডোজ, লিনাক্স , ইউনিক্স , ম্যাক ওএস , ইত্যাদি) উপর সঞ্চালিত হয়
• পিএইচপি আজ প্রায় সব সার্ভার ব্যবহৃত সঙ্গে সামঞ্জস্যপূর্ণ। (এ্যাপাচি , আইআইএস ইত্যাদি)
• পিএইচপি পিএইচপি বিনামূল্যে ডাউনলোড যোগ্য এবং এটি ডাউনলোড করুন : www.php.net হতে।

এইচটিএমএল কি? HTML Document Example

Paste the translated text here
প্রথম পেইজঃ
এইচটিএমএল কি?
উওর: এইচটিএমএল ডকুমেন্ট (ওয়েব পেজ) বর্ণনা জন্য একটি মার্কআপ ভাষা.
এইচটিএমএল ল্যাঙ্গুয়েজ অনেক গুলো টেক্সট এর মার্কআপ করা।
কিছু মার্কআপ ট্যাগ এর সমন্বয়ে এইচটিএমএল ট্যাগ গুলো গঠিত।
এইচটিএমএল ডকুমেন্ট এইচটিএমএল ট্যাগ দ্বারা বর্ননা করা হয়।
প্রতিটি এইচটিএমএল ট্যাগ বিভিন্ন ডকুমেন্টের বিষয়বস্তু বর্ণনা করে থাকে।
যেমনঃ
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head><body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>

</html>
এখানে লক্ষ করলে দেখা যে, প্রথমে <html> দিয়ে শুরু হয়েছে এবং শেষে </html> দিয়ে ডকুমেন্ট শেষ করা হয়েছে। এরকম প্রতিটি ট্যাগের শুরু এবং শেষ করতে হবে। এখানে এক একটি ট্যাগের এক এক ধরনের কাজ। যেমনঃ ওয়েবপেজে টাইটেল দিতে <title>Page Title</title> এই ট্যাগটি ব্যবহার করা হয়। <body>………</body> এই ট্যাগটির মাঝে সব রকম ট্যাগ ব্যবহার করা হয়। এই ট্যাগটির নাম বডি ট্যাগ।
যেমনঃ
<title>Page Title</title>
উপরের এটি একটি এইচটিএমএল ট্যাগ। যা দ্বারা আপনার এইচটিএমএল ডকুমেন্ট এর টাইটেল নির্দেশ করে। এটিকে টাইটেল ট্যাগ বলে। এমন অনেক এইচটিএমএল ট্যাগ রয়েছে।
যেমনঃ
<head>
<title>Page Title</title>
</head>
এখানে দুটি ট্যাগ ব্যবহার করা হয়েছে। একটি হেড ট্যাগ অন্যটি টাইটেল ট্যাগ।
<h1>My First Heading</h1>
h1, h2, h3, h4, h5, h6 এমন ছয়টি ট্যাগ আছে। যেগুলো দিয়ে লেখাকে বড় করা হয়ে থাকে। সবচেয়ে বড় h1 ট্যাগ। এবং সবচেয়ে ছোট h6 ট্যাগ।
<p>My first paragraph.</p>
এখানে যে ট্যাগটি ব্যবহার করা হয়েছে তাকে বলা হয় পি ট্যাগ। এর কাজ হল আপনার লেখাকে প্যারা করে সাজানো।
এখানে একটি কথা অবশ্যই মনে রাখতে হবে যে, প্রতিটি ট্যাগের শুরু এবং শেষ করতে হবে। এছাড়াও অন্য একটি ট্যাগ আছে যাকে ওপেন ট্যাগ বলে।
যেমনঃ <link />, <img />, <hr /> ইত্যাদি। এগুলোকে ওপেন ট্যাগ বলে।
দ্বিতীয় পেইজঃ
আপনি যে কোন টেক্স এডিটর ব্যবহার করতে পারেন। এক্ষেত্রে বিভিন্ন এডিটর ব্যবহার করা হয়ে থাকে। যেমনঃ Adobe Dreamweaver, Microsoft Expression Web, CoffeeCup HTML Editor ইত্যাদি। এসব সফটওয়ার গুলো খুব ভাল মানের কাজের জন্য ব্যবহার করা হয়ে থাকে।
যাইহোক আমরা খুব সহজে আমার পিসি থেকে Notepad (PC) এটি ওপেন করে নিব।
আমরা বিশ্বাস করি একটি সহজ টেক্সট এডিটর ব্যবহার করে এইচটিএমএল শিখা একটি ভালো উপায়।
নোটপ্যাড দিয়ে আপনার প্রথম ওয়েব পেজ তৈরি করার জন্য নীচের চারটি ধাপ অনুসরণ করুন.
ধাপ-১: আপানার নোটপ্যাডটি ওপেন করুন। স্টার্ট ক্লিক করুন>তার পর অল প্রোগ্রাম সিলেক্ট করুন>তারপর এক্সেসরিজ সিলেক্ট করুন>তারপর নোটপ্যাড সিলেক্ট করুন।
ধাপ-২: কিছু এইচটিএমএল ট্যাগ লিখুন। যেমনঃ <!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>
</html>
ধাপ-৩: ফাইলটি আপনার কম্পিউটারের একটি নির্দিষ্ট ফোল্ডারে সেইভ করুন। ক্লিক ফাইল>তারপর সেইভএস এ ক্লিক করুন। এখানে অবশ্যই ফাইল নেইম “file_name.html” এক্সটেনশন ব্যবহার করতে হবে। অন্যথায় কিন্তু আপনার ব্রাউজার ফাইলটি রিট করতে পারবে না।
ধাপ-৪: এবার আপনার ফাইলটি ওপেন করুন যে কোন একটি ব্রাউজারে। তখন আপনি দেখতে পাবেন যা যা লিখেছেন সব ব্রাউজারে দেখা যাবে।

CSS পরিচিতি : CSS Overview

আগে থেকেই আপনার যা জানা উচিত
CSS শেখা শুরু করার আগে আপনার HTML/XHTML সম্পর্কে সাধারণ ধারণা থাকা উচিত।
CSS কি
* CSS বলতে বুঝায় ক্যাসকেডিং স্টাইল শিটস (Cascading Style Sheets)
* এই স্টাইল নির্ধারণ করে HTML উপাদানগুলো কেমনভাবে প্রদর্শিত হবে
* HTML 4.0 ভার্সনের সঙ্গে স্টাইল যোগ করা হয়েছিল একটি সমস্যা সমাধানের উপায় হিসেবে
* স্টাইল শিট বাড়তি পরিশ্রমের হাত থেকে রক্ষা করে
* CSS ফাইলের মধ্যে গোটা স্টাইলশিট সংরক্ষণ করা থাকে

স্টাইল একটি বড় সমস্যা সমাধান করেছিল
ডকুমেন্ট ফরম্যাটিং বা সজ্জার কাজে HTML এর সাথে কখনো ট্যাগ ব্যবহার করার পরিকল্পনা ছিল না। HTML কেবল ডকুমেন্টের বিষয়বস্তুকে নির্দেশ করার জন্য ব্যবহারের কথা ছিল। যেমন:

এটি একটি শিরোনাম

এটি একটি প্যারাগ্র্যাফ

HTML 3.2 ভার্সনের সাথে যখন বিভিন্ন রকম ট্যাগ যেমন কিংবা color উপাদানগুলো ব্যবহার শুরু হলো, তখন ওয়েব ডেভলপারদের জন্য তা একপ্রকার দু:স্বপ্নে পরিণত হলো। বড় বড় ওয়েবসাইটের প্রতিটি পৃষ্ঠায় font এবং color উপাদানগুলো ব্যবহার করা অনেক কষ্টদায়ক ও সময়সাপেক্ষ হয়ে উঠল।
আর এই সমস্যা সমাধানের লক্ষ্যে ওয়ার্ল্ড ওয়াইড ওয়েব কনসোর্টিয়াম (W3C) প্রণয়ন করে CSS.
HTML 4.0 ভার্সন থেকেই সকল HTML ডকুমেন্ট থেকে পৃথক ফরম্যাটিং বাদ দেয়া সম্ভব হল। পরিবর্তে একটি আলাদা CSS ফাইলে ফরম্যাটিং নির্দেশনা সংরক্ষণের ব্যবস্থা করা হলো।
——————————————————————————–

CSS বাক্যরীতি (Syntax)

একটি CSS সেট একটি সিলেক্টর (selector) এবং একটি ডিক্লেয়ারেশন (declaration) ব্লক দ্বারা গঠিত:

CSS সিলেক্টর
সিলেক্টর নির্দেশ করে দেয় আপনি HTML উপাদানগুলোকে কিভাবে সাজাবেন।
ডিক্লেয়ারেশন ব্লকে এক কিংবা একাধিক ডিক্লেয়ারেশন সেমিকোলন দ্বারা পৃথক করা হয়। প্রতিটি ডিক্লেয়ারেশনে একটি প্রোপার্টির (property) নাম এবং তার মান (value) কোলন (:) দ্বারা আলাদা করা থাকে।

CSS উদাহরণ
একটি CSS ডিক্লেয়ারেশন সবসময় সেমিকোলনের মাধ্যমে শেষ হয়। ডিক্লেয়ারেশন গ্রুপটি দ্বিতীয় বন্ধনী “{}” দ্বারা ঘেরা থাকে। যেমন:
p {color:red;text-align:center;}

তবে CSS কোডকে সহজে পঠন ও উপলব্ধির জন্য ডিক্লেয়ারেশনগুলো আলাদা লাইনে দেয়া যেতে পারে:
যেমন

p {
color: red;
text-align: center;
}

 

এসকিউয়েল (SQL) কি? What is SQL?

এসকিউএল অ্যাক্সেস এবং উপাত্ত সাধিত জন্য একটি আদর্শ ভাষা।
 এসকিউএল কি করতে পারে?
• এসকিউএল একটি ডাটাবেস বিরুদ্ধে অনুসন্ধান নির্বাহ করতে পারে।
• এসকিউএল একটি ডাটাবেস থেকে তথ্য উদ্ধার করতে পারে।
• এসকিউএল একটি ডাটাবেসের মধ্যে রেকর্ড সন্নিবেশ করতে পারে।
• এসকিউএল একটি ডাটাবেসের মধ্যে রেকর্ড আপডেট করতে পারে।
• এসকিউএল একটি ডাটাবেস থেকে রেকর্ড মুছে দিতে পারে।
• এসকিউএল নতুন ডাটাবেস তৈরি করতে পারে।
• এসকিউএল একটি ডাটাবেসের মধ্যে নতুন টেবিল তৈরি করতে পারে।
• এসকিউএল একটি ডাটাবেসের মধ্যে সংরক্ষিত পদ্ধতি তৈরি করতে পারে।
• এসকিউএল একটি ডাটাবেসের মধ্যে মতামত তৈরি করতে পারে।
এসকিউএল একটি ANSI (আমেরিকান ন্যাশনাল স্ট্যান্ডার্ড ইনস্টিটিউট ) মান যদিও, এসকিউএল এর বিভিন্ন ভাষা সংস্করণ আছে।
ওয়েব সাইটের মধ্যে এসকিউএল এর ব্যবহার :
একটি ডাটাবেস থেকে তথ্য দেখায় যে একটি ওয়েব সাইট তৈরি করার জন্য,
• আপনাকে করতে হবে একটি RDBMS ডাটাবেস প্রোগ্রাম। (অর্থাৎ মাইক্রোসফট এক্সেস , এসকিউএল সার্ভার , মাইএসকিউএল)
• পিএইচপি বা এএসপি মত একটি সার্ভার সাইড স্ক্রিপ্টিং ভাষা ব্যবহার করার জন্য।
• HTML / CSS এর ব্যবহার করার জন্য।
RDBMS কি?
RDBMS এসকিউএল জন্য ভিত্তি এবং যেমন মাইক্রোসফট SQL সার্ভার, আইবিএম DB2 , ওরাকল , মাইএসকিউএল, মাইক্রোসফট অ্যাক্সেস হিসাবে সব আধুনিক ডাটাবেস সিস্টেমের জন্য।
RDBMS তথ্য সারণী বলা ডাটাবেস অবজেক্ট মধ্যে সংরক্ষিত হয়.

 

HTML এর সম্পাদনা : IDE for HTML

HTML এর সম্পাদনা

নোটপ্যাড বা TextEdit ব্যবহার করে HTML লিখা
নিচে উল্লেখিত একটি পেশাদারী HTML এডিটর ব্যবহার করে HTML সম্পাদনা করা যেতে পারে:
* অ্যাডোবি Dreamweaver
* মাইক্রোসফট এক্সপ্রেশন ওয়েব
* CoffeeCup এইচটিএমএল এডিটর
তবে, এইচটিএমএল শেখার জন্য আমরা নোটপ্যাড (পিসি) বা TextEdit (ম্যাক) মত একটি টেক্সট এডিটর সুপারিশ করব।

একটি সহজ টেক্সট এডিটর ব্যবহার করে এইচটিএমএল শিখার একটি ভালো উপায় বলে আমরা বিশ্বাস করি।

নোটপ্যাড দিয়ে আপনার প্রথম ওয়েব পেজ তৈরি করার জন্য নীচের 4 ধাপ অনুসরণ করুন:

ধাপ 1: নোটপ্যাড ওপেন করুন
উইন্ডোজ 7 বা তার আগের নোটপ্যাড খোলা :
স্টার্ট মেনুতে ক্লিক করুন (পর্দা নিচে বামে) অল প্রগ্রামসে ক্লিক করুন. এ্যাক্সেসরিসে ক্লিক করুন. নোটপ্যাডে ক্লিক করুন.
Windows 8 বা পরে নোটপ্যাড খোলা:
স্টার্ট স্ক্রিন খুলুন (আপনার পর্দায় বামে নীচে উইন্ডো প্রতীক). নোটপ্যাড টাইপ করুন.

ধাপ 2: কিছু এইচটিএমএল লিখুন
নোটপ্যাড মধ্যে কিছু এইচটিএমএল লিখুন বা কপি করুন.
উদাহরণ:
< ! DOCTYPE html>

আমার প্রথম শীর্ষক

আমার প্রথম অনুচ্ছেদ.

নোটপ্যাড ধাপ 3: এইচটিএমএল সংরক্ষণ করুন
আপনার কম্পিউটারে ফাইল সংরক্ষণ করুন.
ফাইল নির্বাচন করুন >নোটপ্যাড মেনু হিসাবে সংরক্ষণ করুন .
আপনি ফাইল এক্সটেনশন হিসাবে .HTM বা .এইচটিএমএল ব্যবহার করতে পারেন. কোন পার্থক্য নাই, এটি আপনার উপরে।
ধাপ 4: আপনার ব্রাউজারে এইচটিএমএল পেজ দেখুন।
আপনার সংরক্ষিত HTML ফাইল ডাবল ক্লিক করুন, এবং এর ফলে নিচের মত দেখতে হবে।
ব্রাউজারে দেখুন

 

জেনে নিন HTML 5 (এইচটিএমএল ৫) এর খুঁটিনাটি : Some details on HTML5

জেনে নিন HTML 5 (এইচটিএমএল ৫) এর খুঁটিনাটি

আজ আমি HTML 5 (এইচটিএমএল ৫)- এর খুঁটিনাটি নিয়ে আলোচনা করব । যারা HTML (এইচটিএমএল)- সম্পর্কে অথবা HTML 5 (এইচটিএমএল ৫)- সম্পর্কে জানেন না বা কিছু জানেন; আশা করি তারা এ সম্পর্কে মোটামোটি ধারণা নিতে পারবেন অর্থাৎ তাদের জন্য টিউনটি কিছুটা হলেও উপকারে আসতে পারে

HTML (এইচটিএমএল) কি ?
নতুনদের মনে প্রশ্ন জাগতে পারে যে, HTML (এইচটিএমএল) আবার কি ? যা অনেকের মুখে শুনা যায় ! তাদের উদ্দেশে আমি বলছি; HTML (এইচটিএমএল) হল এক প্রকার Markup Language (মার্কআপ ল্যাঙ্গুয়েজ), অর্থাৎ এটির মাধ্যমে কোন একটি ওয়েব পেইজের Markup (মার্কআপ) তথা মূল কাঠামো গঠন করা হয় । যার পূর্ণ নাম হচ্ছে Hyper Text Markup Language (হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ) ।

তাছাড়া HTML (এইচটিএমএল) কত গুলো ট্যাগের সমন্বয়ে গঠিত, যা কোন ওয়েব পেইজের Markup (মার্কআপ) তথা কাঠামো গঠন করে, আর এই Markup (মার্কআপ) ট্যাগ এর কাজ হল কোন ওয়েব পেইজের বিভিন্ন ইলিমেন্ট কিভাবে প্রদর্শিত হবে তা নির্দেশ করা । একটি ওয়েব পেইজের ইলিমেন্ট যথাক্রমেঃ টেক্সট, ইমেজ, অডিও, ভিডিও ইত্যাদি ।

HTML (এইচটিএমএল) আমাদের কেন প্রয়োজন ?
একটি ওয়েব পেইজ বা কোন একটি ওয়েব সাইট তৈরি করতে HTML (এইচটিএমএল)- এর গুরুত্ব অপরিসীম । কেননা; যেহেতু HTML (এইচটিএমএল) কোন একটি ওয়েব পেইজের Markup (মার্কআপ) অর্থাৎ মূল কাঠামো গঠন করে, সেহেতু কোন ওয়েব পেইজ ডিজাইন করতে অথবা ওয়েবসাইট তৈরি করতে HTML (এইচটিএমএল) এর বিকল্প কিছু নেই ।

HTML (এইচটিএমএল) এর ইতিহাস
বহুল ব্যবহারিত আজকের এই HTML (এইচটিএমএল) আমাদের নিকট আপনা-আপনি চলে আসে নাই এটির পেছনেও রয়েছে এক বিশাল ইতিহাস, HTML (এইচটিএমএল) এর সৃষ্টি কর্তা হলেন- ইউরোপীয় বিজ্ঞানী স্যার টিম বার্নাস লী ।

তিনি ১৯৮০ সালে CERN এ একজন বিশেষজ্ঞ থাকাকালীন CERN গবেষকদের মাঝে তথ্য শেয়ারের জন্য ENQUIRE Prototyped নামে একটি System এর প্রস্তাব দেন ।

তারপর, ১৯৮৯ সালে স্যার টিম বার্নাস লী ইন্টারনেট ভিত্তিক একটি Hyper Text (হাইপার টেক্সট) সিস্টেম প্রস্তাবে একটি মেমো লিখেন । এবং ১৯৯০ সালে স্যার টিম বার্নাস লী ব্রাউজারের ও সার্ভারের সফটওয়্যারের HTML (এইচটিএমএল) উল্লেখ্য করেন । তারপর এই বছরেই স্যার টিম বার্নাস লী ও CERN এর তথ্য ইঞ্জিনিয়ার Robert Cailliau যৌথ ভাবে CERN কে এ প্রকল্পের জন্য অর্থায়নের অনুরোধ করেন কিন্তু প্রকল্পটি আনুষ্ঠানিক ভাবে CERN দ্বারা গৃহীত হয়নি । তবে HTML (এইচটিএমএল) পরিচিতি লাভ করে একই সালে NCSA কর্তৃক ডেভেলপকৃত মোজাইক ব্রাউজারের মাধ্যমে ।

তাছাড়া স্যার টিম বার্নাস লী অলাভজন জনসেবামূলক প্রতিষ্ঠান ওয়ার্ল্ড ওয়াইড ওয়েব এর তত্ত্বাবধায়ক ওয়ার্ল্ড ওয়াইড ওয়েব কনসোটিয়াম (W3C) এর ডিরেক্টর । ওয়ার্ল্ড ওয়াইড ওয়েব কনসোটিয়াম কর্তৃক ডেভেলপকৃত HTML 3.2 প্রকাশিত হয় ১৯৯৭ সালের জানয়ারিতে ও একই সনের শেষের দিকে প্রকাশ হয় HTML 4.2 এবং HTML (এইচটিএমএল) এর সর্বশেষ সংস্করণ তথা HTML 5 প্রকাশিত হয় ২০১০ সালে ।

HTML 5 (এইচটিএমএল ৫) কি ?
HTML 5 (এইচটিএমএল ৫) হচ্ছে HTML (এইচটিএমএল) এর সর্বশেষ সংস্করণ । যা ২০১০ সালে প্রকাশিত হয় এবং এখন পর্যন্ত পরবর্তী কোন সংস্করণ আসে নি ।

HTML 5 (এইচটিএমএল ৫) এ নতুন কিছু বৈশিষ্ট্যঃ
০১. মিডিয়া প্লেব্যাকের জন্য

০৩. স্থানীয় সংগ্রহস্থলের জন্য সমর্থন ।

০৪. নতুন ফর্ম নিয়ন্ত্রণ, যেমন ক্যালেন্ডার, তারিখ, সময়, ই-মেইল, অনুসন্ধান, ইউআরএল ইত্যাদি ।

০৫. নতুন নির্দিষ্ট বিষয়বস্তুর উপাদান, যেমনঃ

,

,

HTML 5 (এইচটিএমএল ৫) এর কিছু নিয়মঃ
০১. উন্নত ত্রুটি পরিচালনার ব্যবস্থা থাকতে হবে ।

০২. নতুন বৈশিষ্ট গুলো এইচটিএমএল, সিএসএস, DOM এবং জাভাস্ক্রিপ্টের উপর ভিত্তি করে তৈরি করা।

০৩. একাধিক স্ক্রিপ্টিং প্রতিস্থাপন করার সুবিধা যুক্ত করা ।

০৪. আলাদা প্লাগিনের ব্যবহার কমাতে হবে (যেমন: ফ্ল্যাশ) ।

০৫. HTML 5 (এইচটিএমএল ৫) এর স্বাধীন ডিভাইস হতে হবে ।

০৬. উন্নয়ন প্রক্রিয়ায় জনগণের কাছে দৃশ্যমান হবে ।

HTML 5 (এইচটিএমএল ৫) এর জন্য ব্রাউজার সাপোর্টঃ
HTML 5 (এইচটিএমএল ৫) এখনও অফিসিয়ালি প্রকাশিত হয় নি, তাছাড়া কোন ব্রাউজারে HTML 5 (এইচটিএমএল ৫) এর পূর্ণ সমর্থন আসে নাই । তবে প্রতিনিয়ত ব্রাউজারগুলোতে নতুন নতুন উপাদান যুক্ত করা হচ্ছে ।

 

PHP এর ব্যাসিক ধারনা । Basic Concepts on PHP Programming Language

PHP এর ব্যাসিক ধারনা । PHP এর ব্যাসিক ধারনা ।

আজ আপনাকে ওয়েবডিজাইনের অনেক গুরুত্বপুর্ণ ভাষা PHP নিয়ে আলোচনা করবো ।

PHP কি?

PHP কি বলার আগে বলে নেই PHP শিখতে গেলে আপনাকে আগে কি কি জানতে হবে ।

১। HTML
২। CSS
৩। JavaScript

এই তিনটি ভাষা না জানলে কিন্তু আপনি PHP এর কিছুই বুঝবেন না । তাই আগে ভালো করে HTML, CSS, JavaScript শিখুন ।

আসেন তাইলে PHP এর ধারণাটা নিয়েই ফেলি । PHP এর ফুল অর্থ Hypertext Preprocessor । এটা সারা বিশ্বের অনেক প্রচলিত একটা ওপেন সোর্স কোডিং ল্যাঙ্গুয়েজ । এটা লেখার পর কোনো ওয়েব সার্ভারে রাখা হয় যাতে আমরা অই সার্ভারে গেলে PHP দ্বারা লেখা কোনো ভাষার ফলাফল হিসেবে সাইটটা দেখতে পারি । PHP ডাউনলোড এবং ব্যবহার সম্পূর্ণ ফ্রী । তাই এটা শিখতে আপনার কোনো টাকা খরচ হবে না । আর এটা এতটায় পপুলার যে ফেসবুকের মত জনপ্রিয় সাইটও PHP দ্বারা তৈরী করা হয়েছে ।

PHP ফাইল কি?
PHP তো শিখলাম । এবার আসুন শিখি PHP ফাইল কি ।
PHP ফাইল হল text, HTML, CSS, JavaScript, and PHP code দ্বারা লিখিত ফাইল । PHP ফাইল কোনো সার্ভারে আপলোড করে রাখা হয় যাতে আমরা ঐ সার্ভারে গেলে তাদের ওয়েবসাইট দেখতে পাই । PHP দ্বারা তৈরী করা সাইটে গেলে তাদের সাইটের লিংকের শেষে অটোমেটিক .php লেখা দেখতে পাই ।

PHP দ্বারা আমরা কি কি করতে পারি?
১। এর দ্বারা আমরা দায়নামিক পেজ বানাতে পারি ।
২। এর দ্বারা কোনো সার্ভারে রাখা ফাইল খোলা, পড়া, লেখা, মুছা ছাড়াও বন্ধ করতে পারি ।
৩। এটা তথ্যও সংগ্রহ করে থাকে ।
৪। এটা কুকিস সংগ্রহ করতে এবং পাঠাতে পারে ।
৫। এটা ব্যবহারকারীদের নিয়ন্ত্রণও করতে পারে ।
৬। এটার প্রধান কাজ হল ডাটা ইনক্রিপ্ট করা ।

কেনো আমরা PHP ব্যবহার করবো?

এত কিছুর পরও কি বলা লাগবে PHP কেনো ব্যবহার করবো? তবুও আরো কিছু কারণ আছে সেগুলো জেনে নেই ।
১। এটা সব প্লাটফর্মেই চলে । (Windows, Linux, Unix, Mac OS X, etc.)
২। এটা এখনকার সব সার্ভারেই কম্পিটাবল । (Apache, IIS, etc.)
৩। এটা অসংখ্য ডাটাবেজ নিয়ন্ত্রণ করতে পারে । (ক্যান, ফেসবুককে দেখে বোঝেন নাহ)
৪। এটা ব্যবহার এবং ডাউনলোড ফ্রী ।
৫। এটা খুব সহজে শেখা যায় এবং সার্ভারে আপলোড করা যায় ।

তাইলে এত কিছুর পরেও বলেন ক্যান PHP শিখব না?
দাঁড়ান, তাদের অফিসিয়াল সাইট এর লিংকই তো দেয়নি । জানতে ভিজিট করুনঃ www.php.net

HTML দ্বারা কিভাবে ডকুমেন্টসকে প্যারাগ্রাফ আকারে লেখা যায় । HTML and Paragraph

HTML দ্বারা কিভাবে ডকুমেন্টসকে প্যারাগ্রাফ আকারে লেখা যায় । লেখকঃ মোস্তাফিজুর ফিরোজ ।

আজ আমি আপনাদের সামনে আলোচনা করবো HTML দ্বারা কিভাবে ডকুমেন্টসকে প্যারাগ্রাফ আকারে লেখা যায় ।

HTML প্যারাগ্রাফঃ
HLML <p> দ্বারা সাধারণত কোনো প্যারাগ্রাফ নির্দেশ করা হয় ।

উদাহরণ হিসেবে আমরা দেখাতে পারিঃ
<p>এটা একটা প্যারাগ্রাফ</p>
<p>এটা আরেকটা প্যারাগ্রাফ</p>

এভাবে লিখে চেষ্টা করুন ।

HTML ডিসপ্লেঃ
আমরা সাধারণত বুঝতে পারিনা HTML কিভাবে দেখাচ্ছে ।
বড় অথবা ছোট স্ক্রীন এবং মানানসই স্ক্রীনে ডিফারেন্ট ফলাফল দেখায় ।
HTML এ আপনি অতিরিক্ত ফাঁকা অথবা অতিরিক্ত লাইন যোগ করে আপনি আউটপুট পরিবর্তন করতে পারবেন না ।
কারণ, ব্রাউজার অতিরিক্ত ফাঁকা অথবা অতিরিক্ত লাইন বাদ দিয়ে আপনাকে ফলাফল দেখিয়ে থাকে । অতিরিক্ত ফাঁকা অথবা অতিরিক্ত লাইন কে ব্রাউজার একটি মাত্র স্পেস হিসেবে দেখায় ।

উদাহরণ হিসেবে আমরা দেখাতে পারি নিম্নরূপেঃ

Example
<p>
This paragraph
contains a lot of lines
in the source code,
but the browser
ignores it.
</p>

<p>
This paragraph
contains a lot of spaces
in the source code,
but the browser
ignores it.
</p>

উপরের দুইটি উদাহরণ লিখে দেখবেন ফলাফল একই দেখাবে । তাই স্পেস অথবা লাইন বেশি দিয়েও লাভ নেই ।
আর হ্যা, এখানে </p> হলো HTML এর শেষ ট্যাগ । এটা দিতে একদম ভুলে গেলে চলবে না কিন্তু ।

HTML লাইন ব্রেক এর ব্যবহারঃ
<br> দিয়ে একটা লাইন ব্রেক বুঝানো হয় ।
উদাহরণ হিসেবে বলতে পারিঃ
<p>This is<br>a para<br>graph with line breaks</p>

এভাবে আপনি HTML লাইন ব্রেক দিতে পারলেন । কিন্তু কবিতা লেখার সময় আপনাকে কিন্তু এভাবে লিখলে হবে না । তখন আপনাকে <pre> ট্যাগ ব্যবহার করতে হবে ।
উদাহরণ হিসেবে দেখাতে পারিঃ

<p>This will display as a poem:</p>

<pre>

My Bonnie lies over the ocean.

My Bonnie lies over the sea.

My Bonnie lies over the ocean.

Oh, bring back my Bonnie to me.

</pre>

একটা কবিতা লিখে এভাবে HTML এর ভাষায় লিখেই দেখেন না ।

এভাবে আপনি HTML লিখে প্রাকটিস করতে থাকুন। আর আপনি এটা নোটপ্যাড প্লাস দিয়ে লিখে .html ফরমেটে সেভ করে আপনার ব্রাউজার দিয়ে ওপেন করে দেখতে পারেন কেমন হল । আর না বুঝলে আমি তো আছিই ।