এইচটিএমএল সিএসএস বুটস্ট্রাপ জাভাস্ক্রিপ্ট জেকুয়েরি
লগইন
×

এইচটিএমএল টিউটোরিয়াল

এইচটিএমএল হোম পেজ এইচটিএমএল পরিচিতি এবং গঠন এইচটিএমএল কোড এটিটর এইচটিএমএলের মৌলিক ধারণা এইচটিএমএল এলিমেন্ট এইচটিএমএল emty এলিমেন্ট এইচটিএমএল এট্রিবিউট এইচটিএমএল class এট্রিবিউট এইচটিএমএল style এট্রিবিউট এইচটিএমএল কমেন্ট এইচটিএমএল হেডিং এইচটিএমএল প্যারাগ্রাফ এইচটিএমএল টেক্সট ফরম্যাট এইচটিএমএল টেক্সট কোটেশন এইচটিএমএল কম্পিউটারকোড এইচটিএমএল টেবিল এইচটিএমএল লিস্ট এইচটিএমএল কালার এইচটিএমএল সিএসএস এইচটিএমএল লিংক এইচটিএমএল ইমেজ এইচটিএমএল ব্লক-ইনলাইন এলিমেন্ট এইচটিএমএল হেড এইচটিএমএল লেআউট এইচটিএমএল আইফ্রেম এইচটিএমএল জাভাস্ক্রিপ্ট এইচটিএমএল রেস্পন্সিভ এইচটিএমএল এনটিটি এইচটিএমএল অক্ষরসেট এইচটিএমএল সিম্বল এইচটিএমএল URL এনকোড এইচটিএমএল-XHTML px - em কনভার্শন

এইচটিএমএল ফর্ম

এইচটিএমএল ফর্ম এইচটিএমএল ফর্ম এলিমেন্ট এইচটিএমএল ইনপুট টাইপ এইচটিএমএল(৫) ইনপুট টাইপ এইচটিএমএল ইনপুট এট্রিবিউট

এইচটিএমএল৫

এইচটিএমএল৫ পরিচিতি ব্রাউজার সাপোর্ট এইচটিএমএল৫ এলিমেন্ট এইচটিএমএল৫ সিম্যান্টিক এলিমেন্ট এইচটিএমএল৫ মাইগ্রেশন এইচটিএমএল৫ স্টাইল গাইড

এইচটিএমএল মিডিয়া

মিডিয়া-Media ভিডিও-Video অডিও-Audio প্লাগ-ইন-PlugIn ইউটিউব-Youtube

এইচটিএমএল এপিআই

জিওলোকেশন-Geolocation ড্রাগ/ড্রপ-Drag/Drop লোকাল স্টোরেজ-LocalStorage অ্যাপ ক্যাশ-AppCache ওয়েব ওয়ার্কার-WebWorker এসএসই-SSE

এইচটিএমএল রেফারেন্স

রেফারেন্স- reference

 

এইচটিএমএল এপ্লিকেশন ক্যাশ-HTML Application Cache


এপ্লিকেশন ক্যাশ ওয়েব স্ট্যান্ডার্ড থেকে বাদ দেওয়া হয়েছে। যদিও কিছু ব্রাউজারে এখনো সাপোর্ট করে, এটি ব্যবহার থেকে বিরত থাকুন।

এর পরিবর্তে Service Workers ব্যবহার করুন।


এইচটিএমএল(৫) ক্যাশ মানে হচ্ছে একটি ওয়েব এপ্লিকেশনকে ক্যাশ করা এবং ইন্টারনেট কানেকশন ছাড়াই একে এক্সেস করা।

এপ্লিকেশন ক্যাশের তিনটি সুবিধাঃ

  1. অফলাইন ব্রাউজিং - ইউজার অফলাইনে থাকলেও এপ্লিকেশনটি ব্যবহার করতে পারবে
  2. গতি - ক্যাশড ডেটা দ্রুত লোড হয়
  3. সার্ভার লোড কমিয়ে আনে - ব্রাউজার শুধুমাত্র আপডেটেড/চেঞ্জড ডেটা ডাউনলোড করবে

ব্রাউজার সাপোর্ট

বর্তমান সময়ের অধিকাংশ ব্রাউজারেই জিওলোকেশন সাপোর্ট করে। ক্রোম ৪.০, ইন্টারনেট এক্সপ্লোরার ১০.০, ফায়ারফক্স ৩.৫, সাফারি ৪.০ এবং অপেরা ১১.৫ ভার্সন থেকে এপ্লিকেশন ক্যাশ সাপোর্ট করে।


এইচটিএমএল ক্যাশ ম্যানিফেস্ট

নিচের উদাহরণটিতে ক্যাশ ম্যানিফেস্টসহ একটি এইচটিএমএল ডকুমেন্ট দেখানো হলোঃ

উদাহরণ

<!DOCTYPE html>
<html manifest="demo.appcache">
<head>
   <title>এইচটিএমএল ক্যাশ ম্যানিফেস্ট</title>
</head>
<body>

<script src="test_time.js"></script>

<p id="timePara"><button onclick="getDateTime()"> সময় এবং তারিখ দেখুন </button></p>

<p><img src="../../images/satt.jpg" width="100" height="80"></p>

<p> <a href="tryhtml5_html_manifest.html" target="_blank">পেজটি</a> খোলার চেষ্টা করুন,তারপর offline এ যান,এবং পেজটি রিলোড করুন। স্ক্রিপ্ট এবং ইমেজ তখনো কাজ করবে।</p>

</body>
</html>

ফলাফল




ক্যাশ ম্যানিফেস্ট বেসিক

এপ্লিকেশন ক্যাশ চালু করার জন্য আপনাকে manifest এট্রিবিউটটি ডকুমেন্টের <html> ট্যাগে ব্যবহার করতে হবেঃ

<html manifest="demo.appcache">


আমরা যেসকল পেজকে ক্যাশ করতে চাই সেসকল পেজে manifest এট্রিবিউটটি ব্যবহার করবো। .appcache হচ্ছে মেনিফেস্ট ফাইলের এক্সটেশন। মেনিফেস্ট ফাইলের মিডিয়া টাইপ হচ্ছে "text/cache-manifest"


মেনিফেস্ট ফাইল

মেনিফেস্ট ফাইল সাধারণ একটি টেক্সট ফাইল, যার মধ্যে ব্রাউজারের ক্যাশ করার নির্দেশিকা দেওয়া থাকে।

মেনিফেস্ট ফাইলের তিনটি সেকশন আছেঃ

CACHE MANIFEST

প্রথমে CACHE MANIFEST লাইনটি অবশ্যই লিখতে হবেঃ

CACHE MANIFEST
/main.css
/satt.gif
/main.js

উপরের মেনিফেস্ট ফাইলে তিনটি ফাইল আছেঃ একটি সিএসএস ফাইল, একটি GIF ইমেজ এবং একটি জাভাস্ক্রিপ্ট ফাইল। মেনিফেস্ট ফাইলটি লোড হলে ব্রাউজার ওয়েবসাইট থেকে তিনটি ফাইল ডাউনলোড করে নিবে। পরবর্তীতে ইন্টারনেট কানেকশন ছাড়াও এই ফাইলগুলোকে এক্সেস করা যাবে।

NETWORK

নিচের NETWORK সেকশন বুঝায় "login.php" ফাইলকে কখনই ক্যাশ করা যাবে না। তার মানে এই ফাইলটি ইন্টারনেট কানেকশন ছাড়া এক্সেস করা যাবে নাঃ

NETWORK:
login.php

একটি এস্টেরিক সাইন দ্বারা অন্যান্য সকল ফাইলের জন্য ইন্টারনেট কানেকশন লাগবে বুঝাতে ব্যবহার হয়ঃ

NETWORK:
*

FALLBACK

নিচের FALLBACK সেকশন দিয়ে বুঝায় যদি ইন্টারনেট কানেকশন না থাকে তবে "offline.html" সকল পেজের ফলব্যাক পেজ হিসেবে কাজ করবেঃ

FALLBACK:
/offline.html

ক্যাশ আপডেট

নিচের যেকোন একটি ঘটনা না ঘটলে ক্যাশ করা ফাইলটি আপডেট হয় নাঃ

একটি সম্পূর্ণ ক্যাশ মেনিফেস্ট ফাইল

CACHE MANIFEST
# 2017-02-21 v1.0.0
/theme.css
/logo.gif
/main.js

NETWORK:
login.php

FALLBACK:
/offline.html