মাল্টি ডিভাইস ওয়েব ডিজাইন দুটি ভিন্ন অভিগমন তুলনা
প্রতিক্রিয়াশীল এবং অভিযোজিত ওয়েব ডিজাইন মাল্টি-ডিভাইস বন্ধুত্বপূর্ণ ওয়েবসাইটগুলি যা স্ক্রিন মাপ বিভিন্ন উপর ভাল কাজ তৈরি জন্য উভয় পদ্ধতি। প্রতিক্রিয়াশীল ওয়েব ডিজাইন Google এর দ্বারা সুপারিশ করা হয় এবং এটি দুটি পদ্ধতির জনপ্রিয়তা, মাল্টি-ডিভাইস ওয়েব ডিজাইনের জন্য এই পদ্ধতিগুলি উভয়ই তাদের শক্তি এবং তাদের দুর্বলতা রয়েছে।
প্রতিক্রিয়াশীল এবং অভিযোজিত ওয়েব নকশা মধ্যে পার্থক্য তাকান এর, বিশেষ করে এই মূল এলাকায় মনোযোগ নিবদ্ধ:
- উন্নয়ন সহজ
- নকশা উপর আপনি নিয়ন্ত্রণ স্তর
- ডিভাইস / পর্দা সমর্থন ব্যাপ্তি
- কিভাবে ভবিষ্যতের বন্ধুত্বপূর্ণ সমাধান হল
- সামগ্রিক ডাউনলোড গতি এবং সাইট পারফরম্যান্স
কিছু সংজ্ঞা
প্রতিক্রিয়াশীল এবং অভিযোজিত ওয়েব নকশা আমাদের পাশাপাশি তুলনা পেতে আগে, এই দুটি পন্থা একটি উচ্চ স্তরের সংজ্ঞা তাকান একটি মুহূর্ত নিতে যাক
প্রতিক্রিয়াশীল ওয়েবসাইটগুলির একটি তরল বিন্যাস আছে যা পরিবর্তিত এবং পর্দার আকার ব্যবহার করা হচ্ছে অভিযোজিত adapts। ব্রাউজারটি পুনরায় আকার দেওয়া হলে মিডিয়া প্রশ্নগুলি প্রতিক্রিয়াশীল সাইটগুলিকে "ফ্লাইলে" পরিবর্তন করতেও অনুমতি দেয়।
অ্যাডাপ্টিভ ডিজাইন পূর্বনির্ধারিত ব্রেকপয়েন্টের উপর ভিত্তি করে নির্ধারিত মাপ ব্যবহার করে যা স্ক্রিনের আকারের জন্য সবচেয়ে উপযুক্ত লেআউট সংস্করণ প্রদান করে যা পৃষ্ঠাটি প্রথম লোড অবস্থায় সনাক্ত করা যায়।
সেই বিস্তৃত সংজ্ঞাগুলির সাথে, আসুন ফোকাসের মূল ক্ষেত্রগুলিতে ফিরে যাই।
উন্নয়নের সহজতা
প্রতিক্রিয়াশীল এবং অভিযোজিত ওয়েব নকশা মধ্যে সবচেয়ে গুরুত্বপূর্ণ পার্থক্য যে এই সমাধান একটি ওয়েবসাইট থেকে প্রয়োগ করা হয়। যেহেতু প্রতিক্রিয়াশীল ডিজাইন একটি সম্পূর্ণ তরল বিন্যাস তৈরি করে, এটি আপনার প্রোজেক্টগুলিতে সর্বোত্তমভাবে ব্যবহৃত হয় যেখানে আপনি স্থল থেকে সাইটটি পুনরায় ডিজাইন করছেন । প্রতিক্রিয়াশীল হতে একটি বিদ্যমান ওয়েবসাইটের কোড retrofit করার চেষ্টা প্রায়ই একটি নিদারুণ ব্যাপার হয় কারণ আপনি সহজেই নিয়ন্ত্রণের স্তর না আপনি যদি যে স্ক্র্যাচ থেকে যে কোড উন্নয়নশীল ছিল এবং সেই প্রক্রিয়ার প্রথম পর্যায়ের জন্য অ্যাকাউন্টে প্রতিক্রিয়াশীল নকশা গ্রহণ করা হবে না । এর মানে হল যে আপনি যখন প্রতিক্রিয়াশীল হতে একটি সাইট রিট্রোফিট করেন, আপনি সেই বিদ্যমান কোডব্যাশের মধ্যে থাকার জন্য আপোস করতে বাধ্য হন।
যদি আপনি একটি বিদ্যমান স্থিরীকৃত ওয়েবসাইটের সাথে কাজ করেন, একটি অভিযোজিত পদ্ধতির মানে হল যে আপনি স্থির করা যেতে পারে যে সাইটটিকে অক্ষতভাবে ডিজাইন করা হয়েছে এবং প্রয়োজন অনুযায়ী অতিরিক্ত অভিযোজিত ব্রেকপয়েন্ট যোগ করা হয়েছে। কিছু ক্ষেত্রে, যদি একটি প্রকল্প এর বাজেট ছোট হয়, এবং যদি এটি শুধুমাত্র একটি ছোট পরিমাণের উন্নয়ন কাজের মিটমাট করে থাকে তবে আপনি কেবল ছোট পর্দার / মোবাইল-কেন্দ্রিক আকারগুলির জন্য নতুন অভিযোজিত ব্রেকপয়েন্ট যুক্ত করতে পারেন। এর মানে হল যে আপনি বড় স্ক্রিনগুলিকে একই লেআউট ব্যবহার করতে অনুমতি দেবেন - সম্ভবত একটি 960 ব্রেকপয়েন্টের সংস্করণ যা সম্ভবত এই সাইটটির জন্য মূলত ডিজাইন করা হয়েছিল।
একটি অভিযোজিত পদ্ধতির ঊর্ধ্বে উঠে আপনি একটি বিদ্যমান সাইট এর কোড ভাল লিভারেজ করতে পারেন, কিন্তু downsides এক যে আপনি সমর্থন প্রতিটি ব্রেকপয়েন্ট জন্য বিভিন্ন লেআউট টেমপ্লেট তৈরি করা হয়। এই দীর্ঘমেয়াদী এই সমাধান বিকাশ এবং বজায় রাখার জন্য প্রয়োজন কাজের লোড উপর প্রভাব আছে যা।
ডিজাইন কন্ট্রোল
প্রতিক্রিয়াশীল ওয়েবসাইটের শক্তিগুলির মধ্যে একটি হল যে তাদের তরলতাটি তাদের একটি অ্যাডাপ্টিভ পদ্ধতিতে নির্ধারিত প্রাক-সেট ব্রেকপয়েন্টের বিপরীত হিসাবে সমস্ত স্ক্রিনের মাপের অনুকূলে এবং সমর্থন করে। বাস্তবতা, তবে, প্রতিক্রিয়াশীল সাইট নির্দিষ্ট কি পর্দা মাপ (সাধারণত মাপ যে বাজারে উপলব্ধ জনপ্রিয় ডিভাইসের সাথে মিলিত) এ মহান চেহারা হতে পারে, কিন্তু চাক্ষুষ নকশা প্রায়ই যারা জনপ্রিয় রেজুলেশন মধ্যে বিরতি।
উদাহরণস্বরূপ, একটি সাইট 1400 পিক্সেল, 960 পিক্সেলের মাঝের পর্দার আকার এবং 480 পিক্সেলের ছোট স্ক্রিনের লেআউটের মধ্যে একটি পৃষ্ঠাটি চমত্কারভাবে দেখতে পারে, তবে এই মাপগুলির মধ্যবর্তী রাজ্যের বিষয়ে কি? ডিজাইনার হিসাবে, আপনার এই মাপের আকার এবং এই আকারের ভিজুয়াল চেহারাটির উপর কোন নিয়ন্ত্রণ নেই, এটি আদর্শের চেয়ে প্রায়ই কম।
একটি অভিযোজিত ওয়েবসাইটের সাথে, আপনার ব্যবহৃত বিভিন্ন লেআউটগুলির উপর আপনার আরো বেশি নিয়ন্ত্রণ রয়েছে কারণ এটি আপনার প্রতিষ্ঠিত ব্রেকপয়েন্টগুলির উপর ভিত্তি করে নির্ধারিত আকার রয়েছে। যারা অদ্ভুত মধ্যস্থ রাজ্যগুলির কোনও সমস্যা হয় না, কারণ আপনি প্রতিটি "তাক" (অর্থাত প্রতিটি ব্রেকপয়েন্টের প্রদর্শন) প্রতিটি দিকে দৃষ্টিপাত করেছেন যা দর্শকদের কাছে বিতরণ করা হবে।
ডিজাইন কন্ট্রোল এই স্তরের হিসাবে আকর্ষণীয় হতে পারে, আপনি এটি একটি দাম এ অবগত হতে হবে। হ্যাঁ, আপনি প্রতিটি ব্রেকপয়েন্টের চেহারা উপর সম্পূর্ণ নিয়ন্ত্রণ আছে, কিন্তু যে আপনি ঐ অনন্য লেআউট প্রতিটি জন্য ডিজাইন প্রয়োজন নকশা সময় বিনিয়োগ করা আবশ্যক মানে। আরো বিভাজিকা আপনি ডিজাইন করার জন্য চয়ন করুন, আরো সময় আপনি যে প্রক্রিয়া ব্যয় করতে হবে।
সমর্থন প্রসারিত
উভয় প্রতিক্রিয়াশীল এবং অভিযোজিত ওয়েব নকশা, বিশেষ করে আধুনিক ব্রাউজারে, খুব শক্তসমর্থ সমর্থন ভোগ করে।
অ্যাডাপ্টিভ ওয়েবসাইটগুলির জন্য স্ক্রিন সাইজ সনাক্তকরণের জন্য সার্ভার সাইড কম্পোনেন্ট বা জাভাস্ক্রিপ্টের প্রয়োজন হয়। স্পষ্টতই, যদি একটি অভিযোজিত সাইটটি জাভাস্ক্রিপ্টের প্রয়োজন হয় তবে এর মানে হল যে একটি ব্রাউজারকে এটি সঠিকভাবে কাজ করার জন্য এটি সক্ষম করতে হবে। আপনার ব্রাউজারে বেশিরভাগ লোকের জাভাস্ক্রিপ্ট থাকবে তবে আপনার কাছে এটি একটি প্রধান উদ্বেগ হতে পারে না, তবে যেকোনো সময় কোন সাইটে কোনও নির্ভরযোগ্য নির্ভরতা থাকবে, এটি উল্লেখ করা উচিত।
প্রতিক্রিয়াশীল ওয়েবসাইট এবং তাদের সব আধুনিক ব্রাউজারে ভাল কাজ করবে যে মিডিয়া ক্যোয়ারী। কেবলমাত্র আপনার সমস্যাগুলি ইন্টারনেট এক্সপ্লোরারের সবচেয়ে পুরনো সংস্করণগুলির সাথে সংস্করণ 8 এবং নীচের দিক থেকে মিডিয়া অনুসন্ধানগুলি সমর্থন করে না। এই চারপাশে কাজ করার জন্য , একটি জাভাস্ক্রিপ্ট polyfill প্রায়ই ব্যবহার করা হয় , যার মানে অন্তত IE এর প্রাচীন সংস্করণ জন্য এখানে, এখানে জাভাস্ক্রিপ্ট একটি নির্ভরতা আছে। আবার, এটি আপনার জন্য কোনও উদ্বেগের বিষয় হতে পারে না, বিশেষ করে যদি আপনার সাইট বিশ্লেষণ দেখায় যে আপনি পুরোনো ব্রাউজার সংস্করণ ব্যবহার করে অনেক দর্শক পান না।
ভবিষ্যত বন্ধুত্ব
প্রতিক্রিয়াশীল ওয়েবসাইটগুলির তরল প্রকৃতি ভবিষ্যতের বন্ধুত্বের ক্ষেত্রে এটি অভিযোজিত সাইটগুলির উপরে একটি সুবিধা প্রদান করে। এটি কারণ ঐ প্রতিক্রিয়াশীল সাইট শুধুমাত্র একটি ব্রেকপয়েন্টের পূর্বে স্থাপিত সেট মিটমাট করা নির্মিত হয় না। তারা সব স্ক্রিনের মাপসই প্রতিস্থাপন করে , যা আসলে বাজারে নাও হতে পারে। এর মানে হল যে প্রতিক্রিয়াশীল সাইটগুলিকে "স্থির করা" হবে না যদি একটি নতুন স্ক্রিন রেজল্যুশন হঠাৎ জনপ্রিয় হয়ে যায়।
ডিভাইসের আড়াআড়িতে অবিশ্বাস্য বৈচিত্র্যের দিকে তাকিয়ে (২015 সালের হিসাবে, বাজারে ২4,000 স্বতন্ত্র অ্যানড্রয়েড ডিভাইস ছিল), এমন একটি সাইট থাকার ফলে এই বিস্তৃত স্ক্রিনের সমন্বয়ে সেরাটি ভবিষ্যতের বন্ধুত্বের জন্য নিবিড়ভাবে গুরুত্বপূর্ণ। এই কারণে যে ভূদৃশ্য ভবিষ্যতে কোন কম বৈচিত্র্য পেতে অসম্ভাব্য, যার মানে নির্দিষ্ট পর্দা বা মাপ জন্য ডিজাইনিং অসম্ভব হতে যাচ্ছে, আমরা ইতিমধ্যে যে বাস্তবতা পৌঁছে না হয়, তাহলে
এই তুলনা পার্থক্য অন্য দিকে, একটি সাইট অভিযোজিত এবং এটি বাজারে গুরুত্বপূর্ণ হতে পারে যে নতুন রেজুলেশন মিটমাট না হলে, তারপর আপনি তৈরি করেছেন যে সাইট সম্মুখের যে ব্রেকপয়েন্ট যোগ করতে বাধ্য হতে পারে। এই প্রকল্পে ডিজাইন ও ডেভেলপমেন্টের সময় যোগ করে এবং এর মানে হল যে ঐ অভিযোজনীয় সাইটগুলিকে অবশ্যই নিশ্চিত করতে নিরীক্ষণ করা উচিত যে কোন নতুন ব্রেকপয়েন্টগুলি বাজারে চালু করা হয়নি যা সাইটটিতে যোগ করা আবশ্যক। আবার, ডিভাইসের বৈচিত্র্য হচ্ছে এটি হচ্ছে, নতুন মাপের জন্য ক্রমাগত পরীক্ষা করা এবং নতুন ব্রেকপয়েন্টের সাথে তাদের মিটমাট করা একটি চলমান চ্যালেঞ্জ যা একটি সাইট এবং আপনার জন্য যে রক্ষণাবেক্ষণের খরচ সমর্থন করতে হবে তার উপর প্রভাব ফেলবে। কোম্পানির বা সংস্থা যার জন্য সাইটের জন্য।
কর্মক্ষমতা
প্রতিক্রিয়াশীল ওয়েব ডিজাইনের দীর্ঘ অভিযোগ (অনেক ক্ষেত্রেই অসাংবিধানিকভাবে) ডাউনলোড স্পিড / কর্মক্ষমতা দৃষ্টিকোণ থেকে একটি দরিদ্র সমাধান হওয়া পর্যন্ত। এটি মূলত এই কারণে যে এই পদ্ধতির প্রারম্ভিক দিনগুলিতে, অনেক ওয়েব ডিজাইনার কেবল একটি সাইট এর বিদ্যমান CSS এ ছোট পর্দা মিডিয়া জিজ্ঞাসা tacked। এইসব বড় পর্দার জন্য সকল ডিভাইসে বিতরণ করা ছবি এবং সংস্থানগুলি বাধ্যতামূলক করা হয়েছে, এমনকি যদি এই ছোট পর্দা তাদের চূড়ান্ত বিন্যাসে তাদের ব্যবহার না করেও। প্রতিক্রিয়াশীল ডিজাইন একটি দীর্ঘ পথ থেকে আসে যে দিন এবং বাস্তবতা হল যে মানের প্রতিক্রিয়াশীল সাইটগুলি আজকে পারফরম্যান্স সমস্যাগুলি উপভোগ করে না।
ধীরে ধীরে ডাউনলোড গতি এবং ফোলা ওয়েবসাইট একটি প্রতিক্রিয়াশীল ওয়েবসাইট সমস্যা নয় - এটি একটি সমস্যা যা সকল ওয়েবসাইটে পাওয়া যেতে পারে। চিত্রগুলি অত্যন্ত ভারী, সোশাল মিডিয়া, অত্যধিক স্ক্রিপ্টগুলি থেকে ফিড এবং আরও একটি সাইট নিচে ওজন করে, কিন্তু উভয় প্রতিক্রিয়াশীল এবং অভিযোজিত ওয়েবসাইটগুলি দ্রুত লোডিং হতে পারে। অবশ্যই , এগুলি এমনভাবে তৈরি করা যায় যা কার্য সম্পাদনকে অগ্রাধিকার দেয় না, বরং এটি সমাধানের একটি বৈশিষ্ট্য নয়, বরং এমন একটি প্রতিচ্ছবি যেটি সাইটটির উন্নয়নে জড়িত ছিল।
বিন্যাস বিন্যাস
অভিযোজিত ওয়েব ডিজাইনের সবচেয়ে আকর্ষনীয় দিকগুলির মধ্যে একটি হল আপনি কেবলমাত্র সেট ব্রেকপয়েন্টের জন্য সাইটটির ডিজাইনে নিয়ন্ত্রণ করেন না, তবে সেই সাইট সংস্করণের জন্য বিতরণ করা সম্পদও। উদাহরণস্বরূপ, এর মানে হল যে রেটিনা ইমেজগুলি কেবলমাত্র রেটিনা ডিভাইসগুলিতেই পাঠানো যেতে পারে, তবে অ-রেটিনা স্ক্রিনগুলি ফাইলের আকারের ছোট ছোট আকারের ছবি পেতে পারে। অন্যান্য সাইট সম্পদ (জাভাস্ক্রিপ্ট ফাইল, সিএসএস শৈলী ইত্যাদি) কেবলমাত্র তখনই বিতরণ করা যায় যখন প্রয়োজন হয় এবং ব্যবহার করা হবে।
অভিযোজিত ওয়েব ডিজাইনের এই ব্যবহারটি সহজ সমীকরণের তুলনায় অনেকদূর এগিয়ে যায় "যদি আপনি একটি ওয়েবসাইট পুনর্বিন্যাস করছেন, তবে অভিযোজিত ব্যবহার করা সহজ পদ্ধতি হতে পারে।" সম্পূর্ণ ডিজাইন সহ সমস্ত সাইটগুলি, আরও উপযোগী উপায়ে একটি স্মার্ট পদ্ধতি থেকে উপকৃত হতে পারে।
এই দৃষ্টিকোণটি "প্রতিক্রিয়াবিহীন বদ্বীপের অভিযোজিত" বিতর্কের সুস্পষ্ট প্রকৃতি দেখায়। যদিও এটি সত্য যে একটি অভিযোজিত পদ্ধতিটি সাইট রিট্রফিটগুলির জন্য প্রতিক্রিয়ায় তুলনায় আরো ভালো উপযোগী হতে পারে, এটি সম্পূর্ণ পুনরায় ডিজাইনের জন্য একটি দুর্দান্ত সমাধান হতে পারে। একইভাবে, কিছু ক্ষেত্রে একটি প্রতিক্রিয়াশীল দৃষ্টিভঙ্গি একটি বিদ্যমান সাইটের কোড-বেসে যোগ করা যেতে পারে, সেই সাইটটি সম্পূর্ণ প্রতিক্রিয়াশীল পদ্ধতির সমস্ত সুবিধা প্রদান করে।
কোন পদ্ধতি ভাল?
প্রতিক্রিয়াশীল বনাম প্রতিকূল ওয়েব ডিজাইনের ক্ষেত্রে এটি কোন স্পষ্ট "বিজয়ী" নয়, যদিও প্রতিক্রিয়াশীল অবশ্যই অবশ্যই আরো জনপ্রিয় পদ্ধতি। প্রকৃতপক্ষে, "ভাল" পদ্ধতি নির্দিষ্ট প্রকল্পের প্রয়োজনীয়তার উপর নির্ভর করে। উপরন্তু, এই একটি "হয় / অথবা" পরিস্থিতি হতে হবে না অনেক ওয়েব পেশাদাররা এমন সাইট তৈরি করছে যা প্রতিক্রিয়াশীল ডিজাইনের শক্তিশালীতা (ভাল ডিজাইন কন্ট্রোল, সাইট সম্পদগুলির স্মার্ট লোডিং) সহ প্রতিক্রিয়াশীল ওয়েব ডিজাইন (তরল প্রস্থ, ভবিষ্যৎ সমর্থন) এর সেরা একত্রিত করে।
সাধারনত RESS (সার্ভার সাইড কম্পোনেন্টস সহ রিজার্ভ ওয়েব ডিজাইন) নামে পরিচিত, এই পদ্ধতিটি দেখায় যে প্রকৃতপক্ষে কোনও "এক সাইজ সমস্ত সমাধান ফিট করে না।" প্রতিক্রিয়াশীল ওয়েব ডিজাইন এবং অভিযোজিত উভয়ই তাদের শক্তি এবং তাদের চ্যালেঞ্জগুলি রয়েছে, তাই আপনাকে কোনটি তা নির্ধারণ করতে হবে আপনার নির্দিষ্ট প্রকল্পের জন্য সর্বোত্তম কাজ করবে, অথবা যদি একটি হাইব্রিড সমাধান আসলে আপনার সেরাটি উপযুক্ত করে।