এলিমেন্টরে ট্যাব বনাম অ্যাকর্ডিয়ন: কোনটি কখন ব্যবহার করবেন

কী টেকঅ্যাওয়ে

• ট্যাবগুলি মুষ্টিমেয় সমান্তরাল বিভাগের জন্য যা একজন দর্শক বেছে নেয়। একটি অ্যাকর্ডিয়ন এমন একটি তালিকার জন্য যেখানে বেশিরভাগ আইটেম এড়িয়ে যায়।
• ট্যাবগুলি প্রায় চার বা পাঁচটি শিরোনাম ক্যাপ আউট করে কারণ স্ট্রিপটি প্রস্থ ফুরিয়ে যায়। একটি অ্যাকর্ডিয়ন অভিযোগ ছাড়াই বিশটি লাগে।
• একটি অ্যাকর্ডিয়নে একসাথে বেশ কয়েকটি প্যানেল খোলা থাকতে পারে এবং স্ক্রিনে তাদের তুলনা করতে পারে। ট্যাব ঠিক একটি দেখায়।
• অ্যাকর্ডিয়নগুলি সরু পর্দার জন্য নির্মিত হয়েছিল। এলিমেন্টরের ট্যাবগুলি আপনার সেট করা একটি ব্রেকপয়েন্টের নীচে একটি অ্যাকর্ডিয়নে স্যুইচ করে ফোনগুলি পরিচালনা করে, যা সেখানে কোন প্যাটার্নটি জয়ী হয় তার একটি ইঙ্গিত৷।
• Google থেকে সামগ্রী লুকায় না। উভয় উইজেট এইচটিএমএল পৃষ্ঠায় প্রতিটি প্যানেল রাখে এবং সিএসএস দিয়ে বন্ধগুলি লুকিয়ে রাখে।

উভয় প্যাটার্ন একই কাজ করে: একটি দীর্ঘ পৃষ্ঠা ভেঙে ফেলুন যাতে একজন দর্শক যে অংশটির জন্য এসেছেন তা পড়েন। পার্থক্য হল ধসে পড়া আইটেম একে অপরের কি।

ট্যাবগুলি বলে "এর মধ্যে একটি বেছে নিন"৷ একটি অ্যাকর্ডিয়ন বলছে "এখানে একটি তালিকা আছে, আপনার যা প্রয়োজন তা খুলুন"৷ এটিকে পিছনের দিকে নিয়ে যান এবং পৃষ্ঠাটি দর্শকের সাথে লড়াই করে, যা এটিকে দুই মিনিটের চিন্তার মূল্য দেয়।

প্রকৃত পার্থক্য

যে সারিটি বেশিরভাগ সিদ্ধান্তকে চালিত করে তা হল আইটেম গণনা। একটি ট্যাব স্ট্রিপ অনুভূমিক স্থান দ্বারা সীমাবদ্ধ, এবং একটি অ্যাকর্ডিয়ন শুধুমাত্র ধৈর্য দ্বারা সীমাবদ্ধ।

যখন ট্যাব সঠিক হয়

ট্যাবগুলি ফিট হয় যখন বিভাগগুলি সহকর্মী হয় এবং দর্শক তাদের মধ্যে একটি পড়বে৷ তিনটি সংকেত:

• তিন থেকে পাঁচটি বিভাগ, একটি ফালা মাপসই করার জন্য যথেষ্ট কম।
• সমান্তরাল বিষয়বস্তু, যেমন বর্ণনা, স্পেসিফিকেশন, পর্যালোচনা এবং একটি পণ্য পৃষ্ঠায় শিপিং: একই ধরনের জিনিস, ভিন্ন স্লাইস।
• প্রতিটি দর্শক তাদের একটি চায়। কেউ চারটি পড়ে না, সবাই একটি পড়ে।

ট্যাবগুলি পৃষ্ঠাটিকে একটি অনুমানযোগ্য উচ্চতাও রাখে, যা গুরুত্বপূর্ণ যখন কিছু সরাসরি নীচে বসে এবং আপনি এটি স্ক্রিনের নীচে ঝাঁপিয়ে পড়তে চান না।

যখন একটি অ্যাকর্ডিয়ন সঠিক হয়

একটি অ্যাকর্ডিয়ন ফিট করে যখন আইটেমগুলি পছন্দের সেটের পরিবর্তে একটি তালিকা হয়:

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

প্রায়শই জিজ্ঞাসিত প্রশ্নগুলি হল সবচেয়ে পরিষ্কার কেস, এই কারণেই আপনি যে বেশিরভাগ প্রায়শই জিজ্ঞাসিত প্রশ্নগুলি পূরণ করেন তা হল অ্যাকর্ডিয়ান৷ মূল্য নীতি, সমস্যা সমাধানের পদক্ষেপ এবং ডকুমেন্টেশন বিভাগ একই ভাবে আচরণ করে।

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

ফোন কি সিদ্ধান্ত নেয়

একটি অ্যাকর্ডিয়ন ইতিমধ্যেই পূর্ণ-প্রস্থ সারিগুলির একটি উল্লম্ব স্ট্যাক, তাই একটি 390px স্ক্রীন এটি সম্পর্কে কিছুই পরিবর্তন করে না। ট্যাবগুলি এমন প্যাটার্ন যা মানিয়ে নিতে হবে।

এলিমেন্টরের ট্যাব উইজেট আপনার বেছে নেওয়া একটি ব্রেকপয়েন্টের নীচে একটি উল্লম্ব অ্যাকর্ডিয়ন লেআউটে স্যুইচ করে, ডিফল্ট হিসাবে মোবাইল সহ। অ্যাডন ট্যাবগুলি তালিকার নীচের প্যানেল সহ একটি পূর্ণ-প্রস্থ কলামে তাদের শিরোনাম স্ট্যাক করে।

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

এসইও প্রশ্ন

সঙ্কুচিত বিষয়বস্তু সূচীকৃত হয়। উভয় উইজেট এইচটিএমএল পৃষ্ঠায় প্রতিটি প্যানেল রাখে এবং নিষ্ক্রিয়গুলিকে CSS দিয়ে লুকিয়ে রাখে, তাই Google এর ক্রলার এটি সব পড়ে। আপনি উৎস দেখে এবং একটি বন্ধ প্যানেল থেকে পাঠ্য অনুসন্ধান করে আপনার নিজের পৃষ্ঠায় এটি নিশ্চিত করতে পারেন।

দুটি জিনিস সত্যিকার অর্থে যত্ন নেওয়ার মতো:

• পৃষ্ঠাটি কী তা লুকাবেন না। আপনি কী বিক্রি করেন তা জানতে যদি একজন দর্শককে ক্লিক করতে হয়, তাহলে সেই বিষয়বস্তুটি ট্যাব থ্রি-এর অন্তর্গত নয়, ক্রলার যা পড়তে পারে।
• FAQ স্ট্রাকচার্ড ডেটা উইজেট থেকে না হয়ে আপনার এসইও প্লাগইন থেকে আসে। Rank Math এবং Yoast তাদের নিজস্ব ব্লক বা স্কিমা ক্ষেত্র থেকে FAQPage মার্কআপ তৈরি করে, তাই অ্যাকর্ডিয়ন হল উপস্থাপনা এবং স্কিমা আলাদাভাবে সেট করা হয়।

যেখানে টগল ফিট করে

টগল এই তুলনাতে আসে কারণ এলিমেন্টরের একটি টগল উইজেট ছিল এবং কারণ "টগল" মানে দুটি ভিন্ন জিনিস।

এলিমেন্টরের পুরানো টগল উইজেটটি অন্য নামে একটি অ্যাকর্ডিয়ন ছিল: প্রসারণযোগ্য সারিগুলির একটি স্ট্যাক। এটি সংস্করণ 3.15 থেকে অবমূল্যায়িত হয়েছে, এবং একটি সম্পাদনা করা এখন একটি নোটিশ দেখায় যা আপনাকে পরিবর্তে অ্যাকর্ডিয়ন উইজেটে টেনে আনতে বলে৷ তাই একটি বর্তমান ইনস্টলে, ট্যাব বনাম অ্যাকর্ডিয়ন প্রশ্ন ইতিমধ্যেই এটি শোষণ করেছে।

অন্য অর্থ হল একটি দ্বি-রাষ্ট্রীয় সুইচ, যেখানে একটি নিয়ন্ত্রণ একই বিষয়বস্তুর দুটি সংস্করণের মধ্যে পৃষ্ঠাটিকে উল্টে দেয়। যে কি মাস্টার অ্যাডঅন টগল কন্টেন্ট উইজেট করে: দুটি লেবেল, তাদের মধ্যে একটি সুইচ এবং প্রতিটির পিছনে সামগ্রীর একটি ব্লক। বার্ষিক মূল্যের বিপরীতে মাসিক হল সুস্পষ্ট ক্ষেত্রে, এবং ইম্পেরিয়াল ইউনিটের বিরুদ্ধে মেট্রিক হল আরেকটি।

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

একসাথে উভয় ব্যবহার করে

তারা ভালভাবে একত্রিত হয়, কারণ তারা বিভিন্ন প্রশ্নের উত্তর দেয়।

একটি পরিকল্পনা তুলনা পৃষ্ঠা মাসিক এবং বার্ষিক জন্য ট্যাব ব্যবহার করতে পারে, প্রতিটি ট্যাবের ভিতরে বৈশিষ্ট্যের বিবরণের অ্যাকর্ডিয়ন সহ। বাইরের স্তর দুটি সমবয়সীদের মধ্যে একটি পছন্দ; অভ্যন্তরীণ স্তর স্ক্যান করার জন্য একটি তালিকা। নেস্টেড ট্যাবগুলি এটিকে সহজ করে তোলে, যেহেতু প্রতিটি প্যানেল একটি ধারক যা একটি অ্যাকর্ডিয়ন উইজেট গ্রহণ করে।

ট্যাবের ভিতরে ট্যাবগুলি হল এমন একটি সংমিশ্রণ যা কাজ করে না, কারণ এটি একজন দর্শককে মনে রাখতে বলে যে তারা কোন জোড়া শিরোনাম বেছে নিয়েছে।

এলিমেন্টর প্রত্যেকের জন্য আপনাকে কী দেয়

উভয় উইজেট বিনামূল্যে প্লাগইনে রয়েছে এবং উভয়ই নেস্টেড উইজেট, তাই প্যানেলগুলি পাত্রে রাখে।

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

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

প্রায়শই জিজ্ঞাসিত প্রশ্নাবলী

চূড়ান্ত চিন্তা

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

সম্পর্কিত পড়া

• ট্যাব উইজেট
• উন্নত অ্যাকর্ডিয়ন উইজেট
• কন্টেন্ট উইজেট টগল করুন
• এলিমেন্টরে ট্যাব কিভাবে তৈরি করবেন
• মোবাইলে এলিমেন্টর ট্যাব
• এলিমেন্টর নেস্টেড ট্যাব ব্যাখ্যা করা হয়েছে