আসালামু আলাইকুম!! আজকে আমি হাজির হয়েছি HTML সিরিজের শেষ পর্ব নিয়ে।

আজকের পর্বে যা যা থাকবেঃ—


  1. যে বিষয়গুলো বাদ পড়ে গেছে।
  2. কিছু প্রশ্নের উত্তর।
  3. কিভাবে প্র্যাকটিস করব??
  4. ভুলে যেন না যায় তার জন্য কি করব??
  5. নেক্সট লেভেল কি হবে??
  6. কমেন্টের সাজেশন গুলোর উত্তর।
  7. উপসংহার।

যে বিষয়গুলো বাদ পড়ে গেছে।

আমি শেষ পর্বগুলোতে কিছু বিষয় বাদ পড়ে গেছে আমি সেগুলোই এখন কভার করে দেব।

HTML Semantic Element

আগের HTML4 এবং অন্যান্য ভার্সন এ

দিয়ে অনেক কাজ করা হতো। কিন্তু ওখন সেটা কমিয়ে অনেক স্মার্ট করা হয়েছে!!

Semantic বলতে ওয়েব পেজের অনেক গুলো পার্ট আছে। এখন সেগুলোই দেখাবো।

header —> এটা একদম উপরের পার্ট। এখানে থাকে সাইটের লোগো, নাম, ব্যানার থাকে। আবার কোন আর্টিকেল এর হেডিং দিতেও

ব্যবহৃত হয়!!

nav —> এটা হলো ন্যাভিগেশন বার। মানে, সাইটের ট্যাব, সার্চ বার থাকে এখানে।

aside —> এটা সাইটের বাম বা ডান পাশে থাকে। সাইটের ক্যাটেগরি, ক্যালেন্ডার, Archive ইত্যাদি এখানে থাকে। আবার কোন ব্লগ সাইটের পোস্ট হলে, পোস্টের অথর এর নাম ও এখানে দেই অল্প একটু প্রোফাইল সহ।

Section —> এখানে থাকে সাইটের মুল কথাগুলো!! মানে, হেডিং সহ অন্যান্য বিষয় গুলো। যদি ব্লগ সাইট হয় বা এরকম কোন ফোরাম সাইট তাহলে প্রথম পেজ হয় এই section

article —-> এটা সাইটের বিভিন্ন ব্লগ পোস্ট, আর্টিকেল ইত্যাদির জন্য বরাদ্দ!! কোন ব্লগ বা ফোরাম সাইট হলে এই আর্টিকেল এর জন্য আলাদা পেজ থাকে।

Footer —-> এখানে সাইটের কপিরাইট ইস্যু থাকে। লাইসেন্স বা এরকম বিষয়গুলো প্রাধান্য পায় এখানে। কন্টাক্ট বা সাইটের অথর এর নামও থাকে এখানে।

figure —-> কোন সাইটের পোস্টে এরকম থাকতেই পারে যে একটা ইমেজ এর সাথে ক্যাপশন আছে। সেক্ষেত্রে figure ব্যবহৃত হয়।

এই কাজগুলো করার জন্য উক্ত এলিমেন্ট গুলো ব্যবহার করলেই চলে। নিচের উদাহরণ দেখলেই বুঝবেন!!

Figure Element

<figure>
  <img src="pic_mountain.jpg" alt="The Pulpit Rock" width="304" height="228">
  <figcaption>Fig1. - The Pulpit Rock, Norway.</figcaption>
</figure>

Aside Element

<p>My family and I visited The Epcot center this summer.</p>

<aside>
  <h4>Epcot Center</h4>
  <p>The Epcot Center is a theme park in Disney World, Florida.</p>
</aside>

Nav Element

<nav>
  <a href="/html/">HTML</a> |
  <a href="/css/">CSS</a> |
<a href="/js/">JavaScript</a> | <a href="/jquery/">jQuery</a> </nav>

Footer Element

<footer>
  <p>Posted by: Hege Refsnes</p>
  <p>Contact information: <a href="mailto:[email protected]">
  [email protected]</a>.</p>
</footer>

Article Element

<article>
  <h1>What Does WWF Do?</h1>
  <p>WWF's mission is to stop the degradation of our planet's natural environment,
  and build a future in which humans live in harmony with nature.</p>
</article>

Header Element

<article>
  <header>
    <h1>What Does WWF Do?</h1>
    <p>WWF's mission:</p>
  </header>
  <p>WWF's mission is to stop the degradation of our planet's natural environment,
  and build a future in which humans live in harmony with nature.</p>
</article>

কিছু বাদ গেলে ইমেইল করুন!! ইনশাল্লাহ!! আপডেট করে দেব!!

কিছু প্রশ্নের উত্তরঃ–


প্রশ্ন-১ :- আমি সবগুলো পর্ব পড়েছি কিন্তু মনে হচ্ছে কিছুই পারছি না।

উত্তরঃ– আপনি হয়তো যখন পর্ব গুলো পড়েছেন তখন নিজে নিজে কোড লিখে দেখেন নি। যদি নিজে নিজে কোড লিখে দেখতেন তাহলে এমন হতো না।


প্রশ্ন-২ :- আমি কিভাবে বুঝবো যে আমি শিখতে পেরেছি??

উত্তরঃ– আপনার ইচ্ছামতো কমপক্ষে ৫ টি ওয়েব সাইট বানাবেন। সেগুলো কাউকে দেখানোর দরকার নেই। কারণ, যারা এসব বুঝবে না তারা দেখলে হাসাহাসি করবে। কারণ, শুধু HTML দিয়ে বানানো সাইট দেখতে সুন্দর হয় না।


প্রশ্ন-৩ :- আমার মনে হয় এগুলো শিখতে গিয়ে লেখাপড়ায় আমি পিছিয়ে যাচ্ছি।

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

  1. নিজ নিজ ধর্মের প্র্যার্থনা।
  2. একাডেমিক লেখাপড়া করা।
  3. নতুন কিছু শেখা।
  4. বাড়ির কাজে সাহায্য করা।
  5. প্রাকৃতিক কাজ করা।
  6. ঘুমানো।

এই কাজগুলো ছাড়া আপনি যায় করবেন না কেন সেটাই সময় নষ্ট। ফেসবুক একাউন্ট ডিলিট করে দিন। আমি আমার একাউন্ট ডিলিট করে দিয়েছি। অনেক মুল্যবান পোস্ট ছিলো আমার বিভিন্ন গ্রুপে। অনেক বড় বড় প্রোগ্রামিং গ্রুপ এর এডমিন সদস্য ছিলাম। অনেকে আমার থেকে সাহায্য চাইতো।

আমার কাছে এগুলাকে মনে হতো এক স্বর্গীয় আনন্দ। আসলে, এগুলা সব আপেক্ষিক। আপনি অন্যদের সাহায্য করতে গিয়ে নিজে ব্যাকডেটেড হয়ে গেলে কিন্তু কেউ আর দাম দেবে না। তাই, সাবধান হয়ে যান। উপরুক্ত কাজ বাদে আর কিছু করলেই সেটা হবে সময় অপচয়!! তাই, লেখাপড়ায় পিছিয়ে যাওয়ার জন্য কি দায়ী বুঝতেই পারছেন!!


 

কিভাবে প্র্যাকটিস করব??


আপনি যদি আমার এই সিরিজের সবগুলো বিষয় ভালো ভাবে শিখতে পারেন তাহলে বলব এখন শুধু প্র্যাটিস করতে হবে।। আপনার যদি একটা এন্ড্রয়েড ফোন থেকে থাকে তাহলে প্লে-স্টোর থেকে Sololearn App ডাউনলোড করে নিন। সেখান থেকে HTML কোর্স আছে সেটাতে ক্লিক করে ভেতরে ঢুকুন। এখন স্ক্রিনের উপরে ডান পাশে দেখবেন 3 dot চিহ্ন আছে।

সেটাতে ক্লিক করলেই একটা অপশন আছে “Available for offline” এটাতে ক্লিক করুন। এখন নেট ছাড়াই আপনি পুরো HTML এর কোর্স করতে পারবেন। এবং সাথে প্র্যাকটিস তো আছেই। আর পুরো কোর্স শেষে আছে সার্টিফিকেট। ধরুন HTML এর কোন একটা বিষয় নতুন আপডেট এলো আমি কিন্তু তাহলে এই টিউটোরিয়াল গুলো আপডেট করবোনা। কিন্তু, ওখানে আপডেট হবে। আরো অনেক ফিচার আছে।। কোন সমস্যা হলে মেইল করবেন আমাকে।


ভুলে যেন না যায় তার জন্য কি করব??


প্র্যাটিস করলে ভুলবেন কেন?? আর যদি ভুলেও যান তাতে কোন সমস্যা নেই। ওই Sololarn App এ গিয়ে একবার শুধু চোখ বুলিয়ে নেবেন। তাহলেই হবে!!


নেক্সট লেভেল কি হবে??


পরের লেভেলে আমরা শিখবো CSS। অলরেডি সিরিজের আউটলাইন দিয়ে দিয়েছি। আমার প্রোফাইলে গেলে পাবেন। ইনশাল্লাহ!! আজ অথবা কাল প্রথম পর্ব পেয়ে যাবেন।


কমেন্টের সাজেশন গুলোর উত্তর:–


অনেকে বলেছেন ভাই ফর্ম নিয়ে বিস্তারিত বলেন। আমি ৫ম পর্বে শুধু ফর্ম নিয়েই আলোচনা করেছি। আর কিছু নেই যেগুলো নিয়ে আলোচনা করার দরকার আছে। তবে, HTML5 এ যে নতুন কিছু এত্রিবিউট যোগ হয়েছে সেগুলো আপনি প্র্যাকটিস করতে করতে শিখে নেবেন!! এখন শেখার খুব একটা দরকার নেই!!


উপসংহার:–

কিছুই বলার নেই। আসলে, আমার খুব ভালো লাগছে যে আমি অন্তত কোন একটা বিষয়ে একদম সম্পুর্ন সিরিজ করেছি। ট্রিকবিডিতে ফুল সিরিজ আছে মাত্র কয়েকটা যেমনঃ-


  1. নিয়নবাতি। ( ট্রিকবিডির বেস্ট সিরিজ)
  2. পাইথন প্রোগ্রামিং। (ট্রিকবিডির প্রথম কোন প্রোগ্রামিং ল্যাঙ্গুয়েজ এর উপর সম্পুর্ন সিরিজ)
  3. ব্লগার শিখুন। (এটা অনেক ভালো সিরিজ। MD Biplop Hossain ভাই ইনশাল্লাহ!! এই সিরিজের আরো অনেক এডভান্স টিউটোরিয়াল দেবেন)
  4. ৭ দিনে শিখুন HTML (এটা তো দেখেছেনই)

আর কিছু আছে যেগুলো অনেক ভালো এবং অনেক দূর এগিয়েছে ইনশাল্লাহ খুব দ্রুত কমপ্লিট হবে!!


  1. Termux সিরিজ। আমার তো খুব ভালো লাগে।
  2. C:\ ভাইয়ের একটা সিরিজ ছিল হ্যাকিং নিয়ে যদিও ডিলিট করে দিয়েছেন!!

আরো থাকতে পারে তবে সেগুলো হয় কমপ্লিট না নাহয় বেশিদুর আগায় নি।।

আমি গর্ব করছি না যে আমার সিরিজ দুইটা কমপ্লিট। আমি বলছি যে খুব কম সিরিজ আছে যেগুলো কমপ্লিট। আর সেই গ্রুপের সদস্য হতে পেরে ভালো লাগছে।


আজকের মতো বিদায়!!

আসসালামু আলাইকুম!! আমি শাহরিয়ার আহমেদ শোভন!!


আমার ফেসবুক একাউন্ট নেই। দরকার হলে মেইল করবেন “00shovonahmed00[at the rate of]gmail.com”

13 thoughts on "৭ দিনে শিখুন HTML – শেষ দিন — শেষ পর্ব"

  1. Ariyan Ahmed Akash Author says:
    ভালো পোস্ট
    1. Shahriar Ahmed Shovon Author Post Creator says:
      Thanks
  2. স্বপ্ন Author says:
    কো‌ডিং লেখার মধ্যে কিছু ভুল হয়েছে, এছাড়া বাংলা বানানেও, সিসিএস কোড গুলো রান করে দেখানোর অনুরোধ রইলো, যদিও আপনি আমার অনেক ছোট বয়সে।
    আমি এগুলো শিখেছি তবে যারা নতুন তাদের আগ্রহ বাড়বে ।
    1. Shahriar Ahmed Shovon Author Post Creator says:
      কোডিং লেখায় কোথায় ভুল হয়েছে ভাই?? আর বাংলা বানান আমি অভ্র স্পেল চেকার দিয়ে দেখেছি। ভুল নেই।

      আর কোড এর আউটপুট দেখানো হয় নি কারণ, কোডের আউটপুট দিলে কেউ নিজে হাতে কোড লিখে প্র্যাকটিস করে না। এটা আমার বাস্তব অভিজ্ঞতা। তাই, আউটপুট দেখতে গিয়ে যেন নিজের হাতে কোড করে সেটাই নিশ্চিত করছি।।

      মূল্যবান মতামত এর জন্য ধন্যবাদ!!?? কোড এর কোথায় ভুল একটু স্পেসিফিক ভাবে বললে ভালো হতো!!?

    2. স্বপ্ন Author says:
      ফুটার এলিমেন্টের এ্যানকোর ট্যাগ টা দেখুন সাধারণত আমরা কোনোকিছু এ হারফ্ ইকুয়েল ডাবল কোটেশনের ভিতরে এইচটিটিপিএস দিয়ে এড্রেস দেই।
      কিভাবে প্রাকটিস করবো এই সেকশনে আপনি ভিতরে প্রাটিস লিখেছেন, আবার কমেন্টের সাজেশন গুলোর উত্তর সেকশনে এত্রিবিউট লিখেছেন,
      ভুল মানুষেরই হয়, সেখানে এ্যাপটিও কিন্তুু আমাদের ব্রেইন দিয়ে তৈরী, সো এ্যাপটিতেও ভুল থাকতে পারে।
      আর ও কিছু ভুল আছে যেগুলো না ই বললাম।
    3. Shahriar Ahmed Shovon Author Post Creator says:
      ওখানে যেহেতু mailto দেয়া হয়েছে তাই https দেয়া হয়নি। mailto দিলে ডাইরেক্ট মেইল অপশন এ যাবে ।।

      বানানগুলো এডিট করার সময় ভুল হয়েছে তাই আগে ধরা পরে নি।

      বানান ছাড়া অন্য ভুল থাকলে একটু ধরিয়ে দিবেন তাহলে অন্যদের ভালো হতো।

      অনেক ধন্যবাদ!!??

  3. Tirtho Contributor says:
    Html form part e option element niye bolar dorkar cilo
    1. Shahriar Ahmed Shovon Author Post Creator says:
      দুঃখিত। ইনশাআল্লাহ css দিয়ে ফর্ম দেখানোর সময় ঠিক করে দেব।। ধন্যবাদ!!
    1. Shahriar Ahmed Shovon Author Post Creator says:
      Thanks
  4. Monir Sarkar Pro Author says:
    এটা কি হলো ট্যাগ দিলাম বাট হলোনা !এখন হয়েছে
    1. Shahriar Ahmed Shovon Author Post Creator says:
      বুঝলাম না ভাই।
  5. Levi Author says:
    সুন্দর।

Leave a Reply