পুরনো ব্রাউজার সাপোর্ট কেন জরুরি: একটি আধুনিক গাইড

পুরনো ব্রাউজার সাপোর্ট করা

আপনাকে আজকাল পুরনো ব্রাউজার সাপোর্ট করার চিন্তায় বেশি চিন্তা করতে হয় না। Internet Explorer 8 মরার পর থেকে সেগুলো 괜찮ে আছে।

তবে প্রশ্নটি রয়েছে: Internet Explorer 9 এবং অন্যান্য ব্রাউজার সাপোর্ট করার জন্য আপনি কীভাবে যাবেন? প্রথমে, আপনি কি ইন্টারনেট এক্সপ্লোরার ৯ সাপোর্ট করার কথা ভাববেন? আমরা কিছু বিষয় দেখব যা আপনি বিবেচনা করতে চান।

ব্রাউজার নয়, ফিচার চিন্তা করুন

মান লিন্টে শুধু দুটি ফিচার এবং দুটি ব্রাউজার আছে।

1. ব্রাউজার A ফিচার A সাপোর্ট করে কিন্তু ফিচার B নয়।
2. ব্রাউজার B ফিচার B সাপোর্ট করে কিন্তু ফিচার A নয়।

কোন ব্রাউজার কোন ফিচার সাপোর্ট করে সেটি ডিটেক্ট করে সেখান থেকে কাজ করা সম্ভব।

// This is JavaScript
if (Browser A) { // Code for A }
if (Browser B) { // code for B }

তবে যদি আরও ব্রাউজার থাকে? যদি ব্রাউজার C, D, এবং E থাকে? ব্রাউজার চিন্তা করলে আপনার দরকারি ফিচার সাপোর্ট করা কঠিন হয়ে যায়।

একটি ভালো উপায় আছে: আপনি চেক করুন একটি ফিচার এক্সিস্ট করে কিনা। যদি এক্সিস্ট করে, ব্যবহার করুন। যদি না, ফলব্যাক কোড দিন।

নিচের কোড ব্লক ব্রাউজার A থেকে ব্রাউজার Z পর্যন্ত কাজ করে।

// This is JavaScript
if (feature A) { // Code if browser contains feature A } else { // Code if browser doesn't contain feature A }

এখন আপনাকে ব্রাউজারের চিন্তা করতে হয় না।

একটি ফিচার ব্যবহার করার সিদ্ধান্ত নেওয়া

অনেক লোক একটি ফিচার ব্যবহার করবে কিনা সেটি নির্ভর করে কত ব্রাউজার সেটি সাপোর্ট করে। কিন্তু, যেমন আমি উপরে যুক্তি দিয়েছি, ব্রাউজার মattering করে না।

যেটি মattering করে সেটি হলো: আপনি কি সেই ফিচারের জন্য ফলব্যাক কোড সহজে লিখতে পারেন? যদি আপনি ফলব্যাক সহজে লিখতে পারেন, তাহলে ফিচারটি ব্যবহার করুন। যদি আপনি ফলব্যাক সহজে না লিখতে পারেন, তবে ফিচারটি ব্যবহার করবেন না।

কোন ব্রাউজার সাপোর্ট করবেন সেটি ঠিক করা

আপনাকে এখনও একটি কাট-অফ দরকার।

আপনি কোন ব্রাউজার সাপোর্ট করবেন? কোন ব্রাউজার সাপোর্ট করবেন না? আপনি যদি ব্রাউজার সাপোর্ট করতে না চান, তবে তার জন্য ফলব্যাক কোড লিখতে কোনো অর্থ নেই।

আমার সেরা জবাব: দেখুন কে আপনার সাইট ব্যবহার করছে। তারা কোন ব্রাউজার ব্যবহার করে? তার অনুযায়ী করুন।

হ্যাঁ, আউটলায়ার থাকতে পারে কে Internet Explorer 6-এ আপনার ওয়েবসাইট ভিজিট করার চেষ্টা করবে। কিন্তু আপনার কাছে টাইম এবং এনার্জি আছে কি এমন একটি ব্রাউজারের জন্য এক্সট্রা কোড লিখতে যা hampir কেউ ব্যবহার করে না?

আপনার এনার্জি কি অন্যত্র বিতরন করা ভালো হবে?

সাপোর্টের লেভেল

আমি আরгу করি চারটি লেভেলের সাপোর্ট রয়েছে:

1. সব কিছু সব ব্রাউজারে একই দেখতে এবং কাজ করতে হবে
2. সাইট একই দেখতে হবে, কিন্তু ফাংশনালিটি ব্রাউজার জুড়ে ভিন্ন হতে পারে
3. ফাংশনালিটি একই থাকতে হবে, কিন্তু লুক ব্রাউজার জুড়ে ভিন্ন হতে পারে
4. লুক এবং ফাংশনালিটি দুটোই ব্রাউজার জুড়ে ভিন্ন হতে পারে

আপনি পুরনো ব্রাউজারদের কী লেভেলের সাপোর্ট দিচ্ছেন? কেন?

উপসংহার

এটি চিন্তা করুন:

1. আপনি কেন সেই পুরনো ব্রাউজার সাপোর্ট করার চেষ্টা করছেন?
2. আপনি কী লেভেলের সাপোর্ট দিচ্ছেন?
3. এটি কি আপনার alok করা রিসোর্সের ভালোবাবা?

পুরনো ব্রাউজার সাপোর্ট — CSS

CSS ফিচারের জন্য ফলব্যাক দ করার দুটি উপায় রয়েছে:

1. প্রপার্টি ফলব্যাক
2. ফিচার কোয়েরি

প্রপার্টি ফলব্যাক

যদি একটি ব্রাউজার একটি প্রপার্টি বা এর করেসপন্ডিং ভ্যালু রিকগনাইজ না করে, তবে ব্রাউজার প্রপার্টিটি পুরোপুরি উপেক্ষা করবে।

যখন এটি ঘটে, ব্রাউজার ব্যবহার করে—অথবা ফলব্যাক করে—এটি পাওয়া পূর্ববর্তী ভ্যালু।

এটি ফলব্যাক দ করার সবচেYe সহজ উপায়।

এখানে একটি উদাহরণ:

.layout {
  display: block;
  display: grid;
}

এই উদাহরণে, ব্রাউজার যারা CSS Grid সাপোর্ট করে তারা display: grid ব্যবহার করবে। যেই ব্রাউজার CSS Grid সাপোর্ট করে না সেটি display: block-এ ফলব্যাক করবে।

ডিফল্ট ভ্যালু বাদ দিন

যদি আপনি যে এলিমেন্টটি ব্যবহার করছেন সেটি ডিফল্টলি display: block-এ থাকে, তবে আপনি display: block ডিক্লেরেশন বাদ দিতে পারেন। এর মানে আপনি CSS Grid সাপোর্ট করতে পারেন শুধু এক লাইন কোড দিয়ে:

.layout {
  display: grid;
}

যে ব্রাউজাররা CSS Grid সাপোর্ট করে সেগুলো অন্যান্য CSS প্রপার্টি যেমন grid-template-columns পড়তে পারবে। যারা সাপোর্ট করে না সেগুলো পারবে না।

এর মানে আপনি অডিশনাল CSS Grid প্রপার্টি লিখতে পারেন ফলব্যাক ভ্যালু নিয়ে চিন্তা না করে।

.layout {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-gap: 1em;
}

ফিচার কোয়েরি, বা @supports, আপনাকে বলে দেয় একটি CSS প্রপার্টি বা এর করেসপন্ডিং ভ্যালু ব্রাউজার দ্বারা সাপোর্টেড কিনা।

আপনি CSS ফিচার কোয়েরিকে জাভাস্ক্রিপ্টের if/else স্টেটমেন্টের মত চিন্তা করতে পারেন। সেগুলো এভাবে দেখায়:

@supports (property: value) { /* Code when property or value is supported*/ }
@supports not (property: value) { /* Code when property or value is not supported */ }

@supports হেল্পফুল যদি আপনি চান ব্রাউজাররা CSS শুধু তখন পড়ে যখন সে একটি স্পেসিফিক প্রপার্টি সাপোর্ট করে।

উপরের CSS Grid উদাহরণের জন্য, আপনি এভাবে করতে পারেন:

@supports (display: grid) {
  .layout {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-gap: 1em;
    padding-left: 1em;
    padding-right: 1em;
  }
}

এই উদাহরণে, padding-left এবং padding-right শুধু সেই ব্রাউজাররা পড়বে যারা @supports এবং CSS Grid দুটোই সাপোর্ট করে।

Jen Simmons-র @supports-এ কাজের একটি ভালো উদাহরণ রয়েছে। তিনি ফিচার কোয়েরি ব্যবহার করেন ডিটেক্ট করতে ব্রাউজার কি -webkit-initial-letter মত প্রপার্টি সাপোর্ট করে।

@supports (initial-letter: 4) or (-webkit-initial-letter: 4) {
  p::first-letter {
    -webkit-initial-letter: 4;
    initial-letter: 4;
    color: #FE742F;
    font-weight: bold;
    margin-right: 0.5em;
  }
}

Image

Jen-এর উদাহরণ আমাদের একটি প্রশ্নের কাছে আনলো: কি সাইটগুলো সব ব্রাউজারে একই দেখাতে হবে? আমরা পরে এটাকে দেখব। কিন্তু প্রথমে, ফিচার কোয়েরি সম্পর্কে আরো।

ফিচার কোয়েরির সাপোর্ট

ফিচার কোয়েরি চমৎকার সাপোর্ট পেয়েছে। সকল বর্তমান প্রধান ব্রাউজার ফিচার কোয়েরি সাপোর্ট করে।

Image

কি হবে যদি একটি ফিচার সাপোর্টেড হয়, কিন্তু ফিচার কোয়েরি নয়?

এইটা হয়eto ট্রিকি পার্ট ছিল। Jen Simmons এবং অন্যান্য এক্সপার্ট আমাদের সতর্ক করেছেন এই সম্ভাবনার ওপর। এটিকে কীভাবে হ্যান্ডল করবেন সেটি এই নিবন্ধে পড়ুন।

আমার মত: আমি IE 11 আর সাপোর্ট করি না, তাই আমি উপরে মেনশন করা উপায়ে ফিচার কোয়েরি ব্যবহার করি।

প্রপার্টি ফলব্যাক এবং ফিচার কোয়েরি একসাথে ব্যবহার করা

নিচের কোডটি তাকান। ব্রাউজাররা কী প্যাডিং ভ্যালু অ্যাপ্লাই করবে?

@supports (display: grid) {
  .layout {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-gap: 1em;
    padding-left: 1em;
    padding-right: 1em;
  }
}

.layout {
  padding-left: 2em;
  padding-right: 2em;
}

উত্তর: সব ব্রাউজার 2em লেফ্ট এবং রাইট প্যাডিং অ্যাপ্লাই করবে।

কেন? কারণ padding-left: 2em এবং padding-right: 2em CSS ফাইলে পরে ডিক্লেয়ার করা হয়েছে। পরে ডিক্লেয়ার করা প্রপার্টি আগের প্রপার্টি ওভাররাইড করে।

আপনি যদি চান padding-left: 2em এবং padding-right: 2em শুধু সেই ব্রাউজারগুলোর জন্য অ্যাপ্লাই হোক যারা না সাপোর্ট করে CSS Grid, তবে আপনি প্রপার্টি অর্ডার 스ওয়াপ করতে পারেন।

.layout {
  padding-left: 2em;
  padding-right: 2em;
}

@supports (display: grid) {
  .layout {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-gap: 1em;
    padding-left: 1em;
    padding-right: 1em;
  }
}

নোট: CSS-এ ফলব্যাক কোড প্রথমে ডিক্লেয়ার করা সবসময় ভালো প্র্যাক্টিস তার ক্যাসকেডিং স্বভাবের কারণে।

এটাও মানে, আপনি যদি @supports এবং @supports not দুটোই ব্যবহার করেন, তবে আপনাকে @supports not প্রথমে ডিক্লেয়ার করা উচিত। এটি আপনার কোড কনসিস্টেন্ট রাখে।

/* Always write "@supports not" first if you use it */
@supports not (display: grid) {
  .layout {
    padding-left: 2em;
    padding-right: 2em;
  }
}

@supports (display: grid) {
  .layout {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-gap: 1em;
    padding-left: 1em;
    padding-right: 1em;
  }
}

এখন কথা বলি সাইটগুলো কি সব ব্রাউজারে একই দেখাতে হবে।

কি সাইটগুলো সব ব্রাউজারে একই দেখাতে হবে?

কিছু লোক মনে করে সাইটগুলো সব ব্রাউজারে একই দেখাতে হবে। তারা মনে করে ব্র্যান্ডিং গুরুত্বপূর্ণ, এবং সাইটগুলো কনসিস্টেন্ট দেখাতে হবে ব্র্যান্ড সংরক্ষণ করতে।

অন্যান্য লোকরা বলে না। তারা প্রোগ্রেসিভ এনহান্সমেন্টের স্পিরিট মেনে চলে। তারা बेटার ব্রাউজার वालো ইউজারদের বেশি লাভ দিতে পারে।

দুই দৃষ্টিভঙ্গিতেই সঠিক, কিন্তু তারা ভিন্ন কোণ থেকে আসে।

সবচেYe গুরুত্বপূর্ণ দৃষ্টিভঙ্গি আসে ইউজারদের কাছ থেকে। আপনার সাইট কি ইউজারদের সেটি দিতে পারছে যা সে জন্য এসেছে?

যদি হ্যাঁ, তবে আপনাকে কনসিস্টেন্সির ওপর অত্যধিক স্ট্রিক্ট হতে হবে না। आगे বয়ে बेटার ব্রাউজার والي ইউজারদের আরও ভালো অভিজ্ঞতা দিন!

উপসংহার

CSS ফিচারের জন্য সাপোর্ট দিতে আপনি ব্যবহার করতে পারেন:

1. প্রপার্টি ফলব্যাক
2. ফিচার কোয়েরি

আপনি যখন CSS লিখেন, নিশ্চিত করুন আপনি ফলব্যাক কোড প্রথমে ডিক্লেয়ার করেছেন ব্রাউজারর জন্য যাদের बेटার সাপোর্ট রয়েছে তার অন্য সেট কোডের আগে।

পুরনো ব্রাউজার সাপোর্ট — জাভাস্ক্রিপ্ট

পুরনো ব্রাউজারর জন্য জাভাস্ক্রিপ্ট সাপোর্ট দিয়ে দেয়া সহজ। অধিকাংশ সময় আপনাকে শুধু একটি পলিফিল ব্যবহার করতে হয়।

তবে আরও কিছু কája আপনি করতে পারেন।

পলিফিল (Polyfill) কী?

একটি পলিফিল হলো একটি কোড টুকরো যা ব্রাউজারকে বলে কীভাবে একটি জাভাস্ক্রিপ্ট ফিচার ইমপ্লিমেন্ট করতে হয়। একবার আপনি একটি পলিফিল অ্যাড করলে, আপনাকে সাপোর্ট নিয়ে চিন্তা করতে হবে না। সেটি কাজ করবে।

এখানে পলিফিল কীভাবে কাজ করে:

1. চেক করে ফিচারটি সাপোর্টেড কিনা
2. যদি না হয়, তবে ফিচার সাপোর্ট করার জন্য কোড অ্যাড করে

এখানে একটি পলিফিল কাজ করার উদাহরণ। এটি চেক করে ব্রাউজার কি Array.prototype.find সাপোর্ট করে। যদি ব্রাউজার Array.prototype.find সাপোর্ট না করে, তবে ব্রাউজারকে বলে সেটি কীভাবে সাপোর্ট করবে।

এই কোডটি MDN-এ পাওয়া যাবে।

if (!Array.prototype.find) {
  Object.defineProperty(Array.prototype, 'find', {
    value: function(predicate) {
      // 1. Let O be ? ToObject(this value).
      if (this == null) {
        throw new TypeError('"this" is null or not defined');
      }
      var o = Object(this);
      // 2. Let len be ? ToLength(? Get(O, "length")).
      var len = o.length >>> 0;
      // 3. If IsCallable(predicate) is false, throw a TypeError exception.
      if (typeof predicate !== 'function') {
        throw new TypeError('predicate must be a function');
      }
      // 4. If thisArg was supplied, let T be thisArg; else let T be undefined.
      var thisArg = arguments[1];
      // 5. Let k be 0.
      var k = 0;
      // 6. Repeat, while k < len
      while (k < len) {
        // a. Let Pk be ! ToString(k).
        // b. Let kValue be ? Get(O, Pk).
        // c. Let testResult be ToBoolean(? Call(predicate, T, « kValue, k, O »)).
        // d. If testResult is true, return kValue.
        var kValue = o[k];
        if (predicate.call(thisArg, kValue, k, o)) {
          return kValue;
        }
        // e. Increase k by 1.
        k++;
      }
      // 7. Return undefined.
      return undefined;
    },
    configurable: true,
    writable: true
  });
}

নোট: একটি পলিফিল একটি শিম (shim) এর সাবসেট। একটি শিম হলো একটি লাইব্রেরি যা একটি নতুন API পুরনো এনভায়রনমেন্টে আনে।

পলিফিল ব্যবহার করা

পলিফিল ব্যবহার করার দুটি উপায় রয়েছে:

1. ম্যানুয়ালি পলিফিল করা, উপরের উদাহরণের মত
2. একসাথে অনেক পলিফিল অ্যাড করা একটি লাইব্রেরির মাধ্যমে

ম্যানুয়ালি পলিফিল করা

প্রথমে, আপনাকে আপনার দরকারি পলিফিল সার্চ করতে হবে। আপনি গুগল করলে পাওয়া যাবে। স্মার্ট ডেভেলপাররা почти সব কিছুর জন্য পলিফিল তৈরি করেছেন যা আপনাকে কখনো দরকার পড়বে।

একবার আপনি পলিফিল পেলে, উপরের প্রসেস ব্যবহার করে পুরনো ব্রাউজারর সাপোর্ট প্রদান করুন।

একসাথে অনেক পলিফিল অ্যাড করা

কিছু লাইব্রেরি অনেক পলিফিল ধারণ করে। ES6-shim একটি astfel লাইব্রেরির উদাহরণ। এটি পুরনো ব্রাউজাররে সব ES6 ফিচার সাপোর্ট প্রদান করে।

কাটিং-এজ জাভাস্ক্রিপ্ট ফিচার ব্যবহার করা

আপনি যদি কাটিং-এজ জাভাস্ক্রিপ্ট ফিচার ব্যবহার করতে চান, তবে আপনার বিল্ড প্রসেসে Babel অ্যাড করার কথা চিন্তা করুন।

Babel হলো একটি টুল যা জাভাস্ক্রিপ্ট কম্পাইল করে। এই কম্পাইল প্রসেসের সময়, এটি পারে:

1. যেকোনো শিম/পলিফিল আপনার দরকার সেটি অ্যাড করে
2. প্রিপ্রসেসর কম্পাইল করে জাভাস্ক্রিপ্ট-এ

দूसरे পয়েন্টে আরও: Babel আপনার বিল্ড প্রসেসে অফলাইন কাজ করে। এটি আপনি যেসব ফাইল পাস করবেন সেগুলো পড়তে পারে, এবং তারপর সেগুলো ব্রাউজার পড়তে পারে এমন জাভাস্ক্রিপ্ট-এ কনভার্ট করে দেয়।

এর মানে আপনি কাটিং-এজ ফিচার যেমন Flow, TypeScript, এবং অন্যান্য কুল টেকনোলজি যা আপনি শুনেছেন সেগুলো ব্যবহার করতে পারেন। সেগুলো সব ব্রাউজারে কাজ করবে, যতক্ষণ না আপনি সেগুলো Babel-এ পাস করেন!

যদি পলিফিল যথেষ্ট না হয়?

যদি পলিফিল ফিচার সাপোর্ট করার জন্য যথেষ্ট না হয়, তবে আপনি প্রশ্ন কান্টেইনারটি reconsider করতে চাইতে পারেন যে আপনি প্রশ্নে ব্রাউজারটার জন্য কতটুকু সাপোর্ট দিচ্ছেন।

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

হয়তো আপনি এমনভাবে কোড করতে পারেন যেটি ফিচারটি ব্যবহার করে না।

অনেক মেইবে, কিন্তু আপনি ড্রিফ্ট পেয়ে গেছেন।

কীভাবে জানব ব্রাউজার ফিচারটি সাপোর্ট করে কিনা?

প্রথমে, আমি caniuse.com চেক করি। আপনি যে জাভাস্ক্রিপ্ট ফিচার চান তার নাম লিখুন, এবং আপনি ব্রাউজার সাপোর্ট লেভেল দেখতে পাবেন।

এখানে Abort Controller-এর সাথে একটি উদাহরণ:

Image

আমি যদি caniuse.com-এ কোনো ইনফরমেশন না পাই, তবে আমি MDN চেক করি। আপনি অধিকাংশ আর্টিকেলের বতলে ব্রাউজার সাপোর্ট পাবেন।

Abort Controller-এর সাথে আবার উদাহরণ:

Image

জাভাস্ক্রিপ্টের কস্ট সতর্কতা

আপনি যখন পলিফিল ব্যবহার করেন, আপনি আরও জাভাস্ক্রিপ্ট কোড যোগ করছেন।

আরো জাভাস্ক্রিপ্ট যোগ করার সমস্যাটা হলো, যাবতীয়, আরও জাভাস্ক্রিপ্ট থাকে। আরো জাভাস্ক্রিপ্ট থাকলে আরো সমস্যা আসে:

1. পুরনো ব্রাউজার সাধারণত পুরনো কম্পিউটারে থাকে। তাদের পর্যাপ্ত প্রসেসিং পাওয়ার নাও থাকতে পারে।
2. জাভাস্ক্রিপ্ট বান্ডেল সাইট লোড ডিলে করে। আরও জানতে "The cost of JavaScript" by Addy Osmani পড়ুন।

উপসংহার

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

কখনও কখনও, ফিচারটি সম্পূর্ণ বাদ দিয়ে দেওয়া ভালো হতে পারে।

কেন পুরনো ব্রাউজার সাপোর্ট করবেন?

আপনি কেন পুরনো ব্রাউজার চিন্তা করবেন?

কে পুরনো ব্রাউজার ব্যবহার করে? সম্ভবত, পুরনো কম্পিউটার والے ইউজাররা?

যদি তারা পুরনো কম্পিউটার ব্যবহার করে, হয়তো তাদের কাছে নতুন কিনতে টাকা নেই।

যদি তাদের কাছে নতুন কম্পিউটার কিনতে টাকা নেই, তবে তারা আপনার কাছ থেকে কিছু কিনবে না।

যদি তারা আপনার কাছ থেকে কিছু কিনে না, তবে আপনি কেন তাদের ব্রাউজার সাপোর্ট করার চিন্তা করবেন?

একজন ব্যবসায়ীর কাছে, এটি একটি সম্পূর্ণリーズনেবল চিন্তাধারা। কিন্তু কেন আমরা ডেভেলপাররা এখনও পুরনো ব্রাউজার সাপোর্ট করার ওপর জোর দিই?

এটিকে ভাঙে ফেলি

মূল চিন্তাধারার ওপর সে 식으로 ধারণার অনেক লেয়ার রয়েছে।

"কে পুরনো ব্রাউজার ব্যবহার করে? সম্ভবত, পুরনো কম্পিউটার والے ইউজাররা? যদি তারা পুরনো কম্পিউটার ব্যবহার করে, হয়তো তারা নতুন কিনতে টাকা পার না।"

সত্য হলো লোকেরা পুরনো ব্রাউজার ব্যবহার করে কারণ তারা পুরনো কম্পিউটার ব্যবহার করে, কিন্তু আমরা অনুমান করতে পারি না যে লোকেরা নতুন কম্পিউটার অфор্ড করতে পারেন না।

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

অনুমান করবেন না।

যদি তাদের কাছে নতুন কম্পিউটার কিনতে টাকা নেই, তবে তারা আপনার কাছ থেকে কিছু কিনবে না। যদি তারা আপনার কাছ থেকে কিছু কিনে না, তবে আপনি কেন তাদের ব্রাউজার সাপোর্ট করার চিন্তা করবেন?

আমাদের অন্য এলাকাতে জুম আউট করতে হবে এই পয়েন্টে কথা বলতে।

হুইলচেয়ার অ্যাক্সেসিবিলিটি

আপনি যদি সিঙ্গাপুরে যান, আপনি লক্ষ্য করবেন প্রায় প্রতিটি সিঁড়ির পাশে একটি র‍্যাম্প বা লিফ্ট রয়েছে।

কেন? কেন সরকার এবং প্রাইভেট কর্পোরেশন লিফ্ট এবং র‍্যাম্পে টাকা খরচ করে? কেন বানানো হয় যখন সিঁড়ি পাওঁছাতে পারেন লোকের নিচ থেকে উপরে?

হয়ে থাকে যে কিছু লোক সিঁড়ি ব্যবহার করতে পারে না। তারা পা দিয়ে হাঁটতে পারে না। তারা হুইলচেয়ারে বসে, এবং সিঁড়ির ওপর হুইলচেয়ার দিয়ে যেতে পারে না। লিফ্ট এবং র‍্যাম্প এদের সার্ভ করে।

এবং যেতে থাকে যে আরও অনেক লোক লিফ্ট এবং র‍্যাম্প থেকে লাভ পায়।

1. যাদের হাঁটু দুর্বল।
2. যাদের সাথে সাইকেল বা স্কুটার রয়েছে।
3. বেবা প্যারেন্ট যারা বেবা ট্রলি ধাক্কা দিচ্ছে।

আপনি যদি কখনো চাকা যেকোনো জিনিস ধাক্কা দিয়েছেন, আপনি চিন্তা ছাড়া র‍্যাম্প বা লিফ্ট ব্যবহার করবেন। আপনিও লাভ পান।

তবে সমস্যাটা হলো: কেউ এক টাকাও আয় করে না র‍্যাম্প বা লিফ্ট অপারেট করলে? তাই কেন বানানো?

কারণ এটি ওয়র্থ ইট।

এবং ওয়র্থ সবসময় টাকা মানে না।

গ্লোবাল ওয়ার্মিং বিবেচনা করুন

আপনি পৃথিবীতে বাস করেন। গ্লোবাল ওয়ার্মিং সম্পর্কে আপনি কী অনুভব করেন?

কিছু লোক কেয়ার করে না। জঙ্গল জলে যাওয়া ওকে। কোম্পানি নদী দূষণ করে এবং টন টন কার্বন ডাইঅক্সাইড হাওয়ায় ছাড়ায় ওকে। এটা তাদের প্রভাবিত করে না।

তবে有一群 মানুষ আছে যারা কেয়ার করে। তারা আমরা যে গ্রহে বাস করি সেটি ভালোবাসে। তারা তাদের বাচ্চাদের জন্য একটি ভালো জায়গা চায় বাস করার জন্য। অনেক কারণ আছে কেয়ার করার। এবং তারা সম্ভবত যতটুকু সম্ভব রিসোর্স বাঁচাতে চায়।

আপনি কোথায় দাঁড়িয়ে আছেন?

আপনি কি এমন একটি কোম্পানিকে টাকা দেবেন যা পৃথিবী ধ্বংস করছে অপারেট করার সময়?

হয়তো আপনি দেবেন। হয়তো দেবেন না। হয়তো আপনি কেয়ার করেন না। তিন অপশনই বৈধ।

এবং একবার আবার, আপনি দেখছেন, এটা সবসময় টাকায় নির্ণয় হয় না।

ওয়েব সবার জন্য

ওয়েবের পিছনে স্বপ্ন হলো একটি কমন ইনফরমেশন স্পেস যেখানে আমরা তথ্য শেয়ার করে কমিউনিকেট করি।

— Tim Berners-Lee

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

পছন্দ আপনার।

আপনি কেয়ার করবেন না যদি আপনি চান না।

আমি যেসব ভালো ফ্রন্টএন্ড ডেভেলপার কেনেেছি? তারা কেয়ার করে। তারা ইনক্লूसিভ হতে চায়। এটিই আমাদের ফ্রন্টএন্ড ডেভেলপার বানায়।

আমরা কেয়ার করি।

তবে কখনও কখনও আমাদের কনস্ট্রেইন্ট এবং লিমিটও থাকে। এবং আমরা সেগুলোর সাথে কাজ করি।

এই আর্টিকেল মূলত আমার ব্লগে পোস্ট করা হয়েছিল।
আরও আর্টিকেল পেতে আমার নিউজলেটার সাইন আপ করুন যাতে আপনি একটি ভালো ফ্রন্ট-এন্ড ডেভেলপার হতে পারেন।

ফ্রি কোড ক্যাম্পের ওপেন সোর্স কারিকুলাম ৪০,০০০+ মানুষকে ডেভেলপার হিসেবে চাকরি পেতে সাহায্য করেছে। শুরু করুন।