initial commit

2 files changed, 209 insertions, 0 deletions

diff --git a/files/bn/html/html5/index.html b/files/bn/html/html5/index.html
new file mode 100644
index 0000000000..bc45480642
--- /dev/null
+++ b/files/bn/html/html5/index.html
@@ -0,0 +1,180 @@
+---
+title: HTML5
+slug: HTML/HTML5
+tags:
+  - Guide
+  - HTML
+  - HTML5
+  - NeedsReview
+  - Overview
+  - Web
+  - Web Development
+translation_of: Web/Guide/HTML/HTML5
+---
+<p><span class="seoSummary"><a href="/bn-BD/docs/HTML" title="HTML">HTML</a> বলতে যা বুঝায় </span><span class="seoSummary"><strong>HTML5</strong>  তার সর্বাধুনিক বিবর্তন</span><span class="seoSummary">। </span>বিষয়টি দুইটি ভিন্ন ধারনা কে প্রতিনিধিত্ব করে :</p>
+
+<div class="note">
+<ul>
+ <li>
+  <p><span class="seoSummary">এটি HTML এর নতুন সংস্করণ, এবং এতে আরো নতুন elements, attributes এবং behaviors যুক্ত হয়েছে,</span></p>
+ </li>
+ <li><span class="seoSummary">এটি বৃহৎ প্রযুক্তি ভান্ডার যা আরো শক্তিশালী এবং নানাবিধ ওয়েব সাইট এবং এপ্লিকেশন তৈরি করার সক্ষমতা দেয়।</span> এই ভান্ডারকে মাঝে মাঝে <em>HTML5 and friends</em> নামে ডাকা হয় এবং প্রায় ছোট করে করে শুধু <em>HTML5</em> বলে।</li>
+</ul>
+</div>
+
+<p>সকল উন্মুক্ত ওয়েব ডেভলপারদের ব্যবহার উপযোগী করা সাজানো হয়েছে। এই পৃষ্ঠায় অসংখ্যা HTML5 প্রযুক্তির তথ্য সমৃদ্ধ পৃষ্ঠার লিংক দেওয়া আছে। কার্যকরিতার উপর ভিত্তি করে এগুলোকে বিভিন্ন দলে বিভক্ত করা হয়েছে।</p>
+
+<ul>
+ <li><em>সিমানটিকস</em>: আপনার বিষয়বস্তু সম্পর্কে আপনাকে আরো যথাযথ ভাবে বর্ণনা করার সুযোগ দিবে।</li>
+ <li><em>কানেক্টিভিটি</em>: সার্ভারের সাথে যোগাযোগ করতে আপনাকে নতুন নতুন পথ দেখাবে।</li>
+ <li><em>অফলাইন এবং স্টোরেজ</em>: ক্লায়েন্ট সাইডে স্থানীয়ভাবে ওয়েবপেইজের তথ্য সংরক্ষণ করার সক্ষমতা দিবে এবং অফলাইনে তা ব্যবহার করতে আরো কার্যকরী করবে।</li>
+ <li><em>মাল্টিমিডিয়া</em>: উন্মুক্ত ওয়েবে ভিডিও এবং অডিও কে প্রথম শ্রেনীতে রাখা হয়েছে।</li>
+ <li><em>দ্বিমাত্রিক/ত্রিমাত্রিক গ্রাফিক্স এবং ইফেক্ট</em>: উপস্থাপনার জন্য আরো অনেক বিকল্প দিবে।</li>
+ <li><em>কার্যকারিতা এবং ইন্ট্রিগ্রেশন</em>: আরো গতির উন্নতি হবে এবং কম্পিউটার হার্ডওয়্যারের আরো ভালো ব্যবহার হবে</li>
+ <li><em>যন্ত্রের ব্যবহার</em>: আরো ইনপুট এবং আউটপুট যন্ত্রের ব্যবহারের সুযোগ দিবে।</li>
+ <li>সাজসজ্জা: চমৎকার চমৎকার থিম তৈরি করার সুযোগ দিবে।</li>
+</ul>
+
+<div class="cleared row topicpage-table">
+<div class="section">
+<h2 id="সিম্যানটিকস" style="margin: 0 0 .25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: none;"><img alt="" src="/files/3827/HTML5_Semantics_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;"><em>সিম্যানটিকস</em></h2>
+
+<dl>
+ <dt><a href="/bn-BD/docs/Sections_and_Outlines_of_an_HTML5_document" title="Sections and Outlines of an HTML5 document">HTML5 এর সেকশন এবং আউটলাইন</a></dt>
+ <dd>HTML5 এর নতুন আউটলাই এবং সেকশন উপাদানের এক ঝলক: {{HTMLElement("section")}}, {{HTMLElement("article")}}, {{HTMLElement("nav")}}, {{HTMLElement("header")}}, {{HTMLElement("footer")}}, {{HTMLElement("aside")}} এবং {{HTMLElement("hgroup")}}.</dd>
+ <dt><a href="/bn-BD/docs/Using_HTML5_audio_and_video" title="Using_audio_and_video_in_Firefox">HTML5 অডিও এবং ভিডিও'র ব্যবহার</a></dt>
+ <dd>{{HTMLElement("audio")}} এবং {{HTMLElement("video")}} উপাদান এম্বেড থাকা এবং নতুন মাল্টিমিডিয়ার ব্যবহার নিশ্চিত করা।</dd>
+ <dt><a href="/bn-BD/docs/HTML/Forms_in_HTML" title="Forms in HTML5">HTML5 এর ফর্ম</a></dt>
+ <dd>এক নজরে HTML5 এ ওয়েব ফর্মের উন্নয়নগুলো দেখে নেই: কন্সট্রেইন্ট ভ্যালিডেশন এপিআই, কিছু নতুন এট্রিবিউট, {{HTMLElement("input")}} এট্রিবিউটের জন্য নতুন নতুন ভ্যালু {{htmlattrxref("type", "input")}} এবং {{HTMLElement("output")}} নামক নতুন এলিমেনট।</dd>
+ <dt>নতুন সিমানটিকস এলিমেন্ট</dt>
+ <dd>সেকশন, মিডিয়া এবং ফর্ম এলিমেন্টের পাশাপারশি আরো নতুন নতুন এলিমেন্ট এসেছে, যেমন</dd>
+ <dd>{{HTMLElement("mark")}}, {{HTMLElement("figure")}}, {{HTMLElement("figcaption")}}, {{HTMLElement("data")}}, {{HTMLElement("time")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}}, অথবা{{HTMLElement("meter")}}, যা <a href="/bn-BD/docs/HTML/HTML5/HTML5_element_list" title="HTML/HTML5/HTML5_element_list">HTML5 এলিমেন্টের পরিমান বৃদ্ধি করে দিচ্ছে।</a></dd>
+ <dt>{{HTMLElement("iframe")}} এর আরো উন্নয়ন</dt>
+ <dd>‌{{htmlattrxref("sandbox", "iframe")}}, {{htmlattrxref("seamless", "iframe")}}, and {{htmlattrxref("srcdoc", "iframe")}} এট্রিবিউটের ব্যবহার করে, ডেভলপারগন নিরাপত্তার মান কে আরো যথাযথ করতে পারছেন এবং  {{HTMLElement("iframe")}} এর চাহিদা মতন রেন্ডারিং করতে পারছেন।</dd>
+ <dt><a href="/bn-BD/docs/MathML" title="MathML">MathML</a></dt>
+ <dd>গাণিতিক ফর্মুলার সরাসরি ব্যবহার নিশ্চিত করেছে।</dd>
+ <dt><a href="/bn-BD/docs/HTML/HTML5/Introduction_to_HTML5" title="HTML/HTML5/Introduction_to_HTML5">HTML5 এর পরিচিতি</a></dt>
+ <dd>আপনি HTML5 এর মাধ্যমে কোন ওয়েব ডিজাইন করলে অথবা কোন ওয়েব এপ্লিকেশন তৈরি করতে চাইলে কিভাবে শুরু করবেন তা এই নিবন্ধে বলা আছে।</dd>
+ <dt><a href="/bn-BD/docs/HTML/HTML5/HTML5_Parser" title="HTML/HTML5/HTML5 parser">HTML5-সমর্থিত পার্সার</a></dt>
+ <dd>এটি একটি পার্সার, যা HTML ডকুমেন্টের বাইটকে ডকুমেন্ট অবজেক্ট মডেলে (DOM) রূপান্তর করে। এটাকে এখন বর্ধিত করা হয়েছে এবং  এখন আরো ভালভাবে সকল ক্ষেত্রে কাজ করার উপযুক্ত করা হয়েছে। এমন কি ভুল মার্কআপ পাওয়ার পরও যাতে ঠিকঠাক কাজ করতে পারে, তেমন ক্ষমতা দেয়া হয়েছে । এতে করে HTML5 সমর্থিত ব্রাউজার গুলোর মদ্ধে আন্তঃ পরিচালন ক্ষমতা ও অনুমানের দক্ষতা বৃদ্ধি পেয়েছে।</dd>
+</dl>
+
+<h2 id="কানেক্টিভিটি" style="margin: 0 0 .25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: none;"><img alt="" src="/files/3839/HTML5_Connectivity_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;"><em>কানেক্টিভিটি</em></h2>
+
+<dl>
+ <dt><a href="/bn-BD/docs/WebSockets" title="WebSockets">ওয়েব সকেট</a></dt>
+ <dd>ওয়েব পেজ এবং সার্ভারের মধ্যে, HTML নয় এমন তথ্য আদান-প্রদানের জন্য, একটি স্থায়ী সংযোগ তৈরি করার সুবিধা দেয়।</dd>
+ <dt><a href="/bn-BD/docs/Server-sent_events/Using_server-sent_events" title="Server-sent_events/Using_server-sent_events">সার্ভার-প্রেরিত ইভেন্ট‌</a></dt>
+ <dd>আগে সার্ভার গুলো শুধু গ্রাহকের অনুরোধের ভিত্তিতে তথ্য পাঠাতে পারত। কিন্তু এই নতুন সংযোজনটি বারবার অনুরোধের ঝামেলা ছাড়াই সরাসরি গ্রাহকের কাছে ইভেন্ট প্রেরণের অনুমতি দেয়।</dd>
+ <dt><a href="/bn-BD/docs/WebRTC" title="WebRTC">WebRTC</a></dt>
+ <dd>RTC মানে Real Time Communication বা তাৎক্ষণিক যোগাযোগ। এটি ব্রাউজারের মাদ্ধমে অন্যদের সাথে চ্যাট বা ভিডিও কনফারেন্সিং এর সুবিধা দেয়। আর এই প্রযুক্তি ব্যবহারের ফলে কোন প্রকার আলাদা সফটওয়্যার বা প্লাগিনেরও প্রয়োজন হয়না।</dd>
+</dl>
+
+<h2 id="অফলাইন_এবং_স্টোরেজ" style="margin: 0 0 .25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: none;"><img alt="" src="/files/3833/HTML5_Offline_Storage_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;"><em>অফলাইন এবং স্টোরেজ</em></h2>
+
+<dl>
+ <dt><a href="/bn-BD/docs/HTML/Using_the_application_cache" title="Offline_resources_in_Firefox">অফলাইন রিসোর্স: এপ্লিকেশন ক্যাশ</a></dt>
+ <dd>ফায়ারফক্স সম্পূর্ণ ভাবে HTML5 অফলাইন রিসোর্স সমর্থন করে। বাকি সবারও একই ধরনের অফলাইন রিসোর্স সমর্থন আছে।</dd>
+ <dt><a href="/bn-BD/docs/Online_and_offline_events" title="Online_and_offline_events">অনলাইন এবং অফলাইন ইভেন্ট</a></dt>
+ <dd>ফায়ারফক্স ৩ WHATWG অনলাইন এবং অফলাইন ইভেন্ট সমর্থন করে, যা একটি এপ্লিকেশন এবং এক্সটেনশন কে সচল ইন্টারনেট সংযোগ আছে কিনা তা পরীক্ষা করার সুযোগ দেয়, সাথে সাথে সংযোগ কি উঠা নামা করছে কিনা তাও পরীক্ষা করে।</dd>
+ <dt><a href="/bn-BD/docs/DOM/Storage" title="DOM/Storage">WHATWG ক্লায়েন্ট সাইড সেসন এবং স্থায়ী স্টোরেজ (এককথায় DOM স্টোরেজ)</a></dt>
+ <dd>ক্লায়েন্ট সাইড সেসন এবং স্থায়ী স্টোরেজ ওয়েব এপ্লিকেশন কে ক্লায়েন্ট সাইডে তথ্য সংরক্ষণে সুবিধা দেয়।</dd>
+ <dt><a href="/bn-BD/docs/IndexedDB" title="IndexedDB">IndexedDB</a></dt>
+ <dd>ইহা একটি ওয়েব মান যা একটি উল্লেখযোগ্য পরিমান সাজানো তথ্য ব্রাজারে সংরক্ষণকে বুঝায় এবং ইন্ডেক্স ব্যবহার করে উচ্চ ক্ষমতায় তথ্য অনুসন্ধানের সুবিধা দেয়।</dd>
+ <dt><a href="/bn-BD/docs/Using_files_from_web_applications" title="Using_files_from_web_applications">ওয়েব এপ্লিকেশন থেকে ফাইলের ব্যবহার</a></dt>
+ <dd>নতুন HTML5 ফাইল এপিআই গিকোতে যুক্ত হয়েছে, যা ব্যবহারকারী দ্বারা নির্বাচিত স্থানীয় ফাইল ব্যবহার করাকে সম্ভব করেছে। এরমধ্যে রয়েছে <span style="font-family: monospace;">{{HTMLElement("input")}} ও <a href="/bn-BD/docs/HTML/Element/Input#attr-multiple" title="HTML/Element/input#attr-multiple"><strong>multiple</strong></a> অ্যাট্রিবিউট ব্যবহার করে একাধিক <a href="/bn-BD/docs/HTML/Element/Input#attr-type" title="HTML/Element/input#attr-type"><strong>ধরণের</strong></a> <span style="font-family: courier new;">file</span> নির্বাচন সমর্থন।</span> এরমধ্যে <a href="/bn-BD/docs/DOM/FileReader" title="DOM/FileReader"><code>FileReader</code></a>ও আছে।</dd>
+</dl>
+
+<h2 id="মাল্টিমিডিয়া" style="margin: 0 0 .25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: none;"><img alt="" src="/files/3835/HTML5_Multimedia_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">মাল্টিমিডিয়া</h2>
+
+<dl>
+ <dt><a href="/bn-BD/docs/Using_HTML5_audio_and_video" title="Using_audio_and_video_in_Firefox">HTML5 অডিও ও ভিডিও ব্যবহার করা</a></dt>
+ <dd>{{HTMLElement("audio")}} এবং {{HTMLElement("video")}} এর সাহায্যে মাল্টিমিডিয়া কন্টেন্ট ওয়েবপেজে যুক্ত করার এবং ম্যানিপুলেট করার সুবিধা দেয়।</dd>
+ <dt><a href="/bn-BD/docs/WebRTC" title="WebRTC">WebRTC</a></dt>
+ <dd>RTC অর্থ রিয়েল টাইম কমিউনিকেশন, যা ব্রাউজারেই অতিরিক্ত প্লাগ-ইনের সাহায্য ছাড়া অন্যান্য মানুষের সাথে যোগাযোগ করা এবং সরাসরি ভিডিও-কনফারেন্সিং নিয়ন্ত্রণ করা সম্ভব করে।</dd>
+ <dt><a href="/bn-BD/docs/DOM/Using_the_Camera_API" title="DOM/Using_the_Camera_API">ক্যামেরা API ব্যবহার করা</a></dt>
+ <dd>কম্পিউটারের ক্যামেরা থেকে ছবি ব্যবহার, পরিবর্তন এবং সংরক্ষণের সুবিধা প্রদান করে।</dd>
+ <dt>ট্র্যাক এবং WebVTT</dt>
+ <dd>{{HTMLElement("track")}} সাবটাইটেল এবং চ্যাপ্টারের সুবিধা প্রদান করে। <a href="/bn-BD/docs/HTML/WebVTT" title="HTML/WebVTT">WebVTT</a> একটি টেক্সট ট্র্যাক ফরম্যাট।</dd>
+</dl>
+
+<h2 id="ত্রিমাত্রিক_গ্রাফিক্স_এবং_ইফেক্ট" style="margin: 0 0 .25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: none;"><img alt="" src="/files/3841/HTML5_3D_Effects_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;">ত্রিমাত্রিক গ্রাফিক্স এবং ইফেক্ট</h2>
+
+<dl>
+ <dt><a href="/bn-BD/docs/Canvas_tutorial" title="Canvas tutorial">ক্যানভাস টিউটোরিয়াল</a></dt>
+ <dd>নতুন HTML <code>{{HTMLElement("canvas")}}</code> এলিমেন্ট এবং গ্রাফিক্স ও অন্যান্য অবজেক্ট আঁকা সম্পর্কে জানুন</dd>
+ <dt><a href="/bn-BD/docs/Drawing_text_using_a_canvas" title="Drawing_text_using_a_canvas"><code>&lt;canvas&gt;</code> এলিমেন্টের জন্য HTML টেক্সট API</a></dt>
+ <dd>{{HTMLElement("canvas")}} এখন HTML5 টেক্সট API সমর্থন করে।</dd>
+ <dt><a href="/bn-BD/docs/WebGL" title="WebGL">WebGL</a></dt>
+ <dd>WebGL (ওয়েব জি, এল) OpenGL ES 2.0 এর কাছাকাছি একটি API এর সাহায্যে ওয়েবে {{HTMLElement("canvas")}} এলিমেন্টে ত্রিমাত্রিক গ্রাফিক্স নিয়ে আসে। </dd>
+ <dt><a href="/bn-BD/docs/SVG" title="SVG">SVG</a></dt>
+ <dd>সরাসরি HTML এ যুক্ত করার উপযোগী ভেক্টর ইমেজের জন্য XML-ভিত্তিক ফাইল ফরম্যাট।</dd>
+ <dt> </dt>
+</dl>
+</div>
+
+<div class="section">
+<h2 id="কার্যকারিতা_এবং_ইন্ট্রিগ্রেশন" style="margin: 0 0 .25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: none;"><img alt="" src="/files/3831/HTML5_Performance_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;"><em>কার্যকারিতা এবং ইন্ট্রিগ্রেশন</em></h2>
+
+<dl>
+ <dt><a href="/bn-BD/docs/DOM/Using_web_workers" title="Using web workers">Web Workers (ওয়েব ওয়ার্কার)</a></dt>
+ <dd>জাভাস্ক্রিপ্টকে ব্যাকগ্রাউন্ড থ্রেডের প্রতিনিধিত্ব ও মূল্যায়ন করার সুবিধা প্রদান করে। এরফলে ইন্টার‍্যাক্টিভ ইভেন্টগুলো ধীর গতির হয়না।</dd>
+ <dt><code><a href="/bn-BD/docs/DOM/XMLHttpRequest" title="XMLHttpRequest">XMLHttpRequest</a></code> লেভেল 2</dt>
+ <dd>সময় এবং ব্যবহারকারীর কার্যক্রমের উপর নির্ভর করে বিক্ষিপ্তভাবে একটি পাতার কিছু অংশ নিয়ে আসে। আর এই প্রক্রিয়ায় আনার ফলে কন্টেন্ট গুলো ডায়নামিক হওয়ার সুযোগ পায়। এটাই <a href="/bn-BD/docs/AJAX" title="AJAX">Ajax</a> এর পেছনের প্রযুক্তি।</dd>
+ <dt>JIT-কম্পাইল করা জাভাস্ক্রিপ্ট ইঞ্জিন</dt>
+ <dd>নতুন প্রজন্মের জাভাস্ক্রিপ্ট ইঞ্জিন পূর্বের চেয়ে অনেক শক্তিশালী যার ফলে অধিক পারফরম্যান্স নিশ্চিত করে।</dd>
+ <dt><a href="https://developer.mozilla.org/bn-BD/docs/DOM/Manipulating_the_browser_history" title="DOM/Manipulating_the_browser_history">হিস্টোরি API</a></dt>
+ <dd>এটি ব্রাউজারের হিস্টোরি ম্যানিপুলেট করার সুযোগ দেয়, যেসকল ওয়েবপেজ ইন্টারএ্যাক্টিভভাবে তথ্য লোড করে, তাদের জন্য এটি বিশেষভাবে উপযোগী।</dd>
+ <dt><a href="/bn-BD/docs/HTML/Content_Editable" title="HTML/Content Editable">contentEditable attribute: আপনার ওয়েবসাইটকে উইকিতে রুপান্তর করুন!</a></dt>
+ <dd>HTML5 contentEditable এ্যাট্রিবিউটটি স্ট্যান্ডার্ডের অন্তর্ভুক করেছে। এই নতুন ফিচারটি সম্পর্কে জানুন।</dd>
+ <dt><a href="/bn-BD/docs/DragDrop/Drag_and_Drop" title="DragDrop/Drag_and_Drop">ড্র্যাগ-এন্ড-ড্রপ</a></dt>
+ <dd>The HTML5 drag and drop API allows support for dragging and dropping items within and between web sites. This also provides a simpler API for use by extensions and Mozilla-based applications.</dd>
+ <dt><a href="/bn-BD/docs/Focus_management_in_HTML" title="Focus_management_in_HTML">HTML এ ফোকাস ব্যবস্থাপনা</a></dt>
+ <dd>নতুন HTML5 <code>activeElement</code> এবং <code>hasFocus</code> এট্রিবিউটগুলো এখন সমর্থিত!</dd>
+ <dt><a href="/bn-BD/docs/Web-based_protocol_handlers" title="Web-based_protocol_handlers">ওয়েব-ভিত্তিক প্রোটোকল হ্যান্ডেলার</a></dt>
+ <dd>আপনে এখন প্রটোকল হ্যান্ডেলার হিসেবে ওয়েব এ্যাপ্লিকেশন রেজিস্টার করতে পারবেন <code>navigator.registerProtocolHandler()</code> মেথডের সাহায্যে।</dd>
+ <dt><a href="/bn-BD/docs/DOM/window.requestAnimationFrame" title="DOM/window.requestAnimationFrame"><code>requestAnimationFrame</code></a></dt>
+ <dd>সর্বোত্তম পারফরম্যান্সের জন্য এ্যানিমেশন নিয়ন্ত্রণের সুবিধা প্রদান করে।</dd>
+ <dt><a href="/bn-BD/docs/DOM/Using_full-screen_mode" title="DOM/Using_full-screen_mode">ফুলস্ক্রিন API</a></dt>
+ <dd>ব্রাউজারের ইন্টারফেস প্রদর্শন ব্যতিত আপনার ওয়েব পেজ বা এ্যাপ্লিকেশনকেই সম্পূর্ণ স্ক্রিনে প্রদর্শন নিয়ন্ত্রণ করে।</dd>
+ <dt><a href="/bn-BD/docs/API/Pointer_Lock_API" title="API/Pointer_Lock_API">পয়েন্টার লক API</a></dt>
+ <dd>সবসময় কোন কন্টেন্ট এর পয়েন্টার লক করে রাখে, তাই গেমস অথবা একই ধরনের কোন এপ্লিকেশনের ক্ষেত্রে পয়েন্টার উইন্ডো সীমায় পৌছে গেলেও তা ফোকাস হারায় না।</dd>
+ <dt><a href="/bn-BD/docs/Online_and_offline_events" title="Online_and_offline_events">অনলাইন এবং অফলাইন ইভেন্ট</a></dt>
+ <dd>অফলাইনে চলবে এমন একটি ভালো মানের এপ্লিকেশন তৈরী করতে হলে, আপনাকে জানতে হবে আপনার এপ্লিকেশন কখন অফলাইনে আছে। আপনার এপ্লিকেশন কখন অনলাইনে আসতে পারে তাও আপনাকে জাতে হবে।</dd>
+</dl>
+
+<h2 id="যন্ত্রের_ব্যবহার" style="margin: 0 0 .25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: none;"><img alt="" src="/files/3837/HTML5_Device_Access_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;"><em>যন্ত্রের ব্যবহার</em></h2>
+
+<dl>
+ <dt><a href="/bn-BD/docs/DOM/Using_the_Camera_API" title="DOM/Using_the_Camera_API">ক্যামেরা API এর ব্যবহার</a></dt>
+ <dd>কম্পিউটারের ক্যামেরা থেকে ছবি ব্যবহার এবং সংরক্ষণ করে।</dd>
+ <dt><a href="/bn-BD/docs/DOM/Touch_events" title="DOM/Touch_events">টাচ ইভেন্ট</a></dt>
+ <dd>টাচ স্ক্রিন চাপলে ব্যবহারকারী কর্তৃক তৈরী করা ইভেন্ট অনুযায়ি কাজ করবে।</dd>
+ <dt><a href="/bn-BD/docs/Using_geolocation" title="Using geolocation">জিওলোকেশনের ব্যবহার</a></dt>
+ <dd>জিওলোকেশন ব্যবহার করে ব্রাউজার কে ব্যবহারকারীর বর্তমান অবস্থান নির্দিষ্ট করতে দেয়।</dd>
+ <dt><a href="/bn-BD/docs/Detecting_device_orientation" title="Detecting_device_orientation">ডিভাইসের স্থিতি সনাক্ত করা</a></dt>
+ <dd>এটা ডিভাইসের স্থিতি অর্থাৎ ডিভাইসটি উল্লম্ব ভাবে আছে, নাকি আনুভূমিক ভাবে আছে (আরও সহজ করে বলতে গেলে ডিভাইসটি সোজা করে ধরা হয়েছে না কাত করে ধরা হয়েছে) তা সনাক্ত করে ব্রাউজারকে মাপ পরিবর্তনে সহায়তা করে। এটা ইনপুট ডিভাইস হিসেবেও ব্যবহার করা যায়। যেমনঃ অবস্থান বা নড়াচড়াকে গেমের নিয়ন্ত্রণ হিসেবে ব্যবহার করা বা পেজের লেআউটে পরিবর্তন ইত্যাদি।</dd>
+ <dt><a href="/bn-BD/docs/API/Pointer_Lock_API" title="API/Pointer_Lock_API">পয়েন্টার লক API</a></dt>
+ <dd>কন্টেন্টের সাথে পয়েন্টারকে লক করে রাখতে দেয়, যাতে করে পয়েন্টার পর্দার শেষ প্রান্তে পৌছালেও গেম এবং সদৃশ অ্যাপ গুলো আকর্ষণ না হারায়।</dd>
+</dl>
+
+<h2 id="সাজসজ্জা" style="margin: 0 0 .25em; font: 200 24px/1 'Bebas Neue','League Gothic',Haettenschweiler,'Arial Narrow',sans-serif; letter-spacing: 1px; text-transform: uppercase; border: none;"><img alt="" src="/files/3829/HTML5_Styling_512.png" style="height: 64px; padding-right: 0.5em; vertical-align: middle; width: 64px;"><em>সাজসজ্জা</em></h2>
+
+<p><a href="/bn-BD/docs/CSS" title="CSS">সিএসএস</a>কে আরও জটিল নিয়মে এলিমেন্ট গুলোকে স্টাইল করার জন্য বর্ধিত করা হয়েছে। যদিও এটা এখন মনোলিথিক বৈশিষ্ট্যের মধ্যে নেই এবং আলাদা মডিউল গুলোও ৩য় স্তরে নেই, তারপরও এটাকে প্রায়ই <a href="/bn-BD/docs/CSS/CSS3" title="CSS/CSS3">সিএসএস৩</a> বলা হয়। এর মডিউল গুলোর মধ্যে কিছু ১ম স্তরে আছে, আবার কিছু ৪র্থ স্তরে আছে।</p>
+
+<dl>
+ <dt>নতুন ব্যাকগ্রাউন্ড স্টাইলিং বৈশিষ্ট্য সমূহ</dt>
+ <dd>এখন {{cssxref("box-shadow")}} ব্যবহার করে একটি বক্সের নিচে ছায়া এবং <a href="/bn-BD/docs/CSS/Multiple_backgrounds" title="CSS/Multiple_backgrounds">একাধিক ব্যাকগ্রাউন্ড</a> প্রয়োগ করা যাবে।</dd>
+ <dt>আরও রুচিসম্মত বর্ডার সমূহ</dt>
+ <dd>এখন {{cssxref("border-image")}} ব্যবহার করে শুধু বর্ডার স্টাইলই করা যাবে না, এর সাথে সংশ্লিষ্ট অন্যান্য লং-হ্যান্ড প্রপার্টিও ব্যবহার করা যাবে। কিন্তু গোলাকার বর্ডার শুধু {{cssxref("border-radius")}} ব্যবহার করেই প্রয়োগ করা যাবে।</dd>
+ <dt>স্টাইল অ্যানিমেট করা</dt>
+ <dd><a href="/bn-BD/docs/CSS/Using_CSS_transitions" title="CSS/Using_CSS_transitions">সিএসএস ট্রানজিশন</a> ব্যবহার করে দুইটি ভিন্ন অবস্থার মধ্যে অ্যানিমেট করা যাবে অথবা <a href="/bn-BD/docs/CSS/Using_CSS_animations" title="CSS/Using_CSS_animations">সিএসএস অ্যানিমেশন</a> ব্যবহার করে কোন ইভেন্ট ট্রিগার না করেই বিভিন্ন অংশ অ্যানিমেট করা যাবে। আর এসব অ্যানিমেশনের সময়, ধরন, গতি-প্রকৃতি সবই আপনি নিয়ন্ত্রণ করতে পারবেন।</dd>
+ <dt>টাইপোগ্রাফি উন্নয়ন</dt>
+ <dd>ভালো টাইপোগ্রাফি ব্যবহার করার জন্য ডিজাইনারদের এখন আরও বেশি নিয়ন্ত্রণ দেয়া হয়েছে। তারা এখন {{cssxref("text-overflow")}} এবং <a href="/bn-BD/docs/CSS/hyphens" title="CSS/hyphens">হাইফেনেশন</a> নিয়ন্ত্রণ করতে পারেন। <a href="/bn-BD/docs/CSS/text-shadow" title="CSS/text-shadow">ছায়া</a> যুক্ত করতে পারেন অথবা অনেক সূক্ষ্মভাবে <a href="/bn-BD/docs/CSS/text-decoration" title="SVG/Attribute/text-decoration">অলঙ্করণ</a> করতে পারেন। নিজের ইচ্ছামত ফন্ট ডাউনলোড করে প্রয়োগ করা যাবে। এজন্য ধন্যবাদ দিতে হয় {{cssxref("@font-face")}} নিয়মটিকে।</dd>
+ <dt>নতুন প্রেজেন্টেশন লেআউট সমূহ</dt>
+ <dd>ডিজাইনের নমনীয়তা বৃদ্ধি করার জন্য নতুন দুইটি লেআউট যুক্ত করা হয়েছেঃ একটি হচ্ছে <a href="/bn-BD/docs/CSS/Using_CSS_multi-column_layouts" title="CSS/Using_CSS_multi-column_layouts">CSS multi-column layout</a>, এবং অপরটি <a href="/bn-BD/docs/CSS/Flexbox" title="CSS/Flexbox">CSS flexible box layout</a>।</dd>
+</dl>
+</div>
+</div>
+
+<p> </p>
diff --git a/files/bn/html/html5/introduction_to_html5/index.html b/files/bn/html/html5/introduction_to_html5/index.html
new file mode 100644
index 0000000000..bb65db9a7f
--- /dev/null
+++ b/files/bn/html/html5/introduction_to_html5/index.html
@@ -0,0 +1,29 @@
+---
+title: HTML5 এ হাতেখড়ি
+slug: HTML/HTML5/Introduction_to_HTML5
+tags:
+  - Guide
+  - HTML
+  - HTML5
+  - NeedsContent
+  - Web
+  - গাইড
+translation_of: Web/Guide/HTML/HTML5/Introduction_to_HTML5
+---
+<p><span id="result_box" lang="bn"><span class="hps">HTML এর</span> <span class="hps">পঞ্চম</span> <span class="hps">ও </span><span class="hps">সর্বশেষ</span> <span class="hps">সংস্করণ <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/" title="http://www.whatwg.org/specs/web-apps/current-work/">HTML5</a></span></span>। <span id="result_box" lang="bn"><span class="hps">এর</span> নতুন কিছু ফিচার রয়েছে যেমন শুধু <span class="hps">রিচ</span> <span class="hps">মিডিয়া</span>ই <span class="hps">সমর্থন</span> <span class="hps">করা, ওয়েব </span></span><span id="result_box" lang="bn"><span class="hps">এপ্লিকেশন তৈরি করা এখন আরও সহজ। এসব ওয়েব এপ্লিকেশন ব্যবহারকীর সাথে ইন্টার-এক্ট করতে পারে, ব্যবহারকারীর কম্পিউটারের ডেটা নিয়ে কাজ করতে পারে, সার্ভারের সাথে যোগাযোগ </span></span>করতে পারে আগের থেকে অনেক কার্যকরভাবে।</p>
+<p><span id="result_box" lang="bn"><span class="hps">HTML5</span> <span class="hps">এখনও</span> ডেভেলপ<span class="hps"> হচ্ছে</span><span>, সে কারণে</span> এখনো এর নির্দেশিকায় টুকটাক পরিবর্তন চলছে<span>।</span></span> <span id="result_box" lang="bn"><span class="hps">এখনো</span> <span class="hps">সব</span> <span class="hps">ব্রাউজারে সব ফিচার চলে না</span><span class="hps">।</span></span> যাইহোক, <em>গেকো</em> এবং তার এক্সটেনশন, ফায়ারফক্স খুব ভালভাবেই HTML5 সমর্থন করে, এবং এর আরও ফিচার সমর্থনের কাজ চলছে। <span id="result_box" lang="bn"><span class="hps">গেকো</span> <span class="hps">১.৮.১</span> <span id="result_box" lang="bn"><span class="hps">সংস্করণ</span></span> <span class="hps">থেকে HTML5 এর</span> ফিচার <span class="hps">সমর্থন করা</span> <span class="hps">শুরু করেছে। </span></span>গেকো বর্তমানে HTML5 এর কি কি ফিচার সমর্থন করে তা <a href="/bn/HTML/HTML5" title="en/HTML/HTML5">HTML5 এর মুল</a><a href="/bn-BD/HTML/HTML5"> পেজে </a> জানতে পারেন। অন্যান্য ব্রাউজারে HTML5 সাপোর্ট করে কি না, তা বিস্তারিত জানতে <a class="external" href="http://caniuse.com/#cats=HTML5" title="http://caniuse.com/#cats=HTML5">CanIUse</a> ওয়েবসাইটে যেতে পারেন।</p>
+<h2 id="যেভাবে_বলবেন_আপনার_ডকুমেন্টে_HTML5_মার্ক-আপ_আছে">যেভাবে বলবেন আপনার ডকুমেন্টে HTML5 মার্ক-আপ আছে</h2>
+<p>HTML5 এর জন্য ডকটাইপ খুবই সাধারন। আপনার HTML কন্টেন্ট যে HTML5 ব্যাবহার করছে তা বলার জন্য ডকুমেন্টের শুরুতে নিচের কোড লিখুনঃ</p>
+<pre class="brush:html;">&lt;!DOCTYPE html&gt;
+</pre>
+<p>যেসব ব্রাউজার এখনো HTML5 সমর্থন করে না, তারাও এই কোড দেখলে স্ট্যান্ডার্ড মোডে চলে যাবে, যার অর্থ হল তারা HTML এর আগের সমর্থিত কোডগুলো ঠিকমতই দেখাবে এবং শুধুমাত্র যেসব HTML5 এলিমেন্ট তারা সমর্থন করে না সেগুলোই দেখাবে না।</p>
+<p>নতুন এই ডকটাইপ আগের ডক্টাইপগুলো থেকে অনেক ছোট, যে কারণে এটা সহজেই মনে রাখা যায়। তাছাড়া ছোট হওয়ার জন্য কম বাইট ডাউনলোড হয় ব্যবহারকারীর মেশিনে।</p>
+<h2 id="&lt;meta_charset>_লিখে_ক্যারেক্টার-সেট_ডিক্লেয়ার_করুন"><code>&lt;meta charset&gt; লিখে ক্যারেক্টার-সেট ডিক্লেয়ার করুন</code></h2>
+<p>সাধারণতঃ পেইজের শুরুতেই এটি কোন ক্যারেক্টার-সেট ব্যবহার করছে তা বলে দিতে হয়। HTML এর আগের সংস্করণে জটিল {{HTMLElement("meta")}} ট্যাগ দিয়ে এটি করা লাগত, কিন্তু এখন যা খুবই সহজঃ</p>
+<pre class="brush:html;">&lt;meta charset="UTF-8"&gt;</pre>
+<p>{{HTMLElement("head") }} এর পরেই উপরের কোড লিখুন, যেহেতু কিছু ব্রাউজার HTML ডকুমেন্ট পার্স করা নতুন করে শুরু করে, যদি আপনার ডিক্লেয়ার করা ক্যারেক্টার-সেট ব্রাউজার যেটা ধরে নিয়েছিল সেটার থেকে আলাদা হয়। এছাড়া, আপনি যদি UTF-8 ব্যবহার না করেন তাহলে আপনাকে UTF-8 ব্যবহার করতে নির্দেশনা দেওয়া হচ্ছে, কারণ এটি অনেক স্ক্রিপ্টেই ক্যারেক্টার ব্যবহার করা অনেক সহজ করে দেয়।</p>
+<p>খেয়াল করুনঃ HTML5 নির্দেশনা দিয়েছে যে বৈধ ক্যারেক্টার-সেট অবশ্যই ASCII সমর্থিত হতে হবে আর কমপক্ষে ৮ বিট ব্যবহার করে এমন হতে হবে। নিরাপত্তা বাড়াতে আর কিছু এটাক (আক্রমণ!) ঠেকানোর জন্যই এই ব্যবস্থা।</p>
+<h2 id="নতুন_HTML5_পার্সার">নতুন HTML5 পার্সার</h2>
+<p>HTML5 পার্সিং নিয়মকানুন, (যা কিনা HTML কোডের অর্থ বের করে) HTML5 এ নিখুঁতভাবে বলা হয়েছে। HTML5 আসার আগে শুধুমাত্র বৈধ মার্ক-আপ কী সেটাই বলা থাকত, যেকারণে যখনই মার্ক-আপে কোন ভুল পাওয়া যেত (প্রায় সব ওয়েবসাইটেই কিছু না কিছু ভুল থাকে) একেক ব্রাউজার একেকভাবে আচরণ করত। কিন্তু এখন HTML5 এ যেহেতু মার্ক-আপে ভুল থাকলে কি করতে হবে সেটাও বলা হয়েছে, সব HTML5-সমর্থিত ব্রাউজার ভুল কোড পেলেও একইরকম আচরণ করবে।</p>
+<p>এর ফলে ওয়েব ডেভেলপারদের এখন সুখের সময়। যদিও সব আধুনিক ব্রাউজার-ই HTML5-সমর্থিত, কিছু পুরনো ব্রাউজার পাওয়া যায় যারা কিনা HTML5 পার্সিং নিয়ম মেনে চলে না। এইসব HTML5-অসমর্থিত ব্রাউজার এখনো মানুষজন ব্যবহার করে। ডেভেলপারদের কে ভুল না করে, মার্ক-আপ লিখতে উৎসাহিত করা হয়, কারণ ভুলবিহীন কোড সহজেই বুঝা যায় আর পরেও কোড করতে সুবিধা হয়। আর বড় কথা হল, কোডে ভুল থাকলে পুরনো একেক ব্রাউজারে একেক আচরণ দেখা যাবে - কারণ পুরনো ব্রাউজারগুলো HTML5 পার্সিং নিয়ম মেনে চলে না।</p>
+<p>টেনশন করার কোন দরকার-ই নেই, আপনার ওয়েবসাইটের কোন কিছু পরিবর্তন করা লাগবে না - ওয়েব ব্রাউজারের ডেভেলপার-রাই এসব নিয়ে মাথা ঘামাচ্ছে!</p>