যখন একজন দর্শক প্রথম কোনো ওয়েবসাইট পরিদর্শন করেন, তখন তারা প্রথম যে জিনিসটি লক্ষ্য করেন তা হল এটি কত দ্রুত লোড হয় এবং এটি কোন ধরনের অভিজ্ঞতা প্রদান করে, তারা এটি অ্যাক্সেস করার জন্য যে ডিভাইসটি ব্যবহার করে তা নির্বিশেষে।
কর্মক্ষমতা এবং রূপান্তরের জন্য আপনার ওয়েবসাইটকে কীভাবে অপ্টিমাইজ করতে হয় তা শেখা অপরিহার্য কারণ এটি গ্যারান্টি দেবে যে এটি যতটা কঠিন কাজ করছে এবং আপনার ব্যবহারকারীরা তাদের ব্রাউজিং অভিজ্ঞতার সাথে সন্তুষ্ট। এই টিউটোরিয়ালে, আমরা আপনার Elementor ওয়েবসাইট অপ্টিমাইজ করার জন্য 6টি পদ্ধতির উপরে যাব।
কেন আপনি এলিমেন্টর ব্যবহার করা উচিত?
আপনার যদি একটি এলিমেন্টর সাইট থাকে কিন্তু আপনি এটি এখনও অপ্টিমাইজ না করে থাকেন তবে আপনি অনেকগুলি দুর্দান্ত বৈশিষ্ট্য হারাচ্ছেন৷ এলিমেন্টর হল একটি ওয়ার্ডপ্রেস ওয়েবসাইট নির্মাতা যা আপনাকে নান্দনিকভাবে আকর্ষণীয় এবং স্বতন্ত্র ওয়েব পেজ তৈরি করতে দেয়। আপনি ওয়েব ডিজাইনের বিভিন্ন দিক একত্রিত করার সাথে সাথে, Elementor আপনাকে শেষ ফলাফল প্রদর্শন করে, প্রক্রিয়াটিকে আপনার জন্য দ্রুত যেতে সাহায্য করে।
যদিও এলিমেন্টর বাক্সের বাইরে দুর্দান্ত, প্লাগইন গতি এবং সাইটের কার্যকারিতার ক্ষেত্রে বিকাশের জন্য অবশ্যই জায়গা রয়েছে। আপনার সাইটের জন্য প্লাগইনটি অপ্টিমাইজ করার সময় এলিমেন্টর যা অফার করে তার সর্বাধিক পেতে সাহায্য করার জন্য আমরা এই পোস্টে ছয়টি পদ্ধতির উপরে যাব।
1. ওয়েবসাইট লেআউট অপ্টিমাইজেশান
Elementor আপনার ওয়েবসাইটে ডিজাইন যোগ করার জন্য এটিকে আরও গতিশীল এবং ব্যবহারকারী-বান্ধব করার জন্য বিভিন্ন লেআউট প্রদান করে। আপনার বিষয়বস্তুর সাথে কোনটি সবচেয়ে ভাল কাজ করে তার উপর নির্ভর করে আপনি গ্রিড ফর্ম্যাট বা রাজমিস্ত্রির শৈলীর মতো বিভিন্ন বিকল্প থেকে বেছে নিতে পারেন।
আপনার আইটেমগুলিকে কার্যকরভাবে প্রদর্শন করতে আপনি একটি প্রচলিত ব্লগ থিমও ব্যবহার করতে পারেন। আপনার ওয়েবসাইট ডিজাইনকে আরও প্রতিক্রিয়াশীল করতে আপনি নতুন যোগ করা কাস্টম ব্রেকপয়েন্ট ব্যবহার করতে পারেন। অন্য কথায়, আপনার ওয়েবসাইট প্রতিটি স্ক্রীন আকারে সুন্দর প্রদর্শিত হবে এবং যেকোন ডিভাইসে দর্শকদের জন্য একটি ভাল অভিজ্ঞতা প্রদান করবে। এই ব্রেকপয়েন্টগুলির সাথে, ডিভাইসের প্রস্থের উপর ভিত্তি করে ওয়েবসাইট লেআউট গতিশীলভাবে পরিবর্তিত হয়, যা এলিমেন্টরের প্রতিক্রিয়াশীল নিয়ন্ত্রণ লোডিং কৌশল ব্যবহার করে উন্নত করা যেতে পারে। সার্ভারের প্রতিক্রিয়া সময় এখন 23 শতাংশ পর্যন্ত বাড়ানো যেতে পারে।
ব্রেকপয়েন্ট অন্তর্ভুক্ত করা হয়েছে, সেইসাথে অতিরিক্ত স্থান সহ নতুন ওয়াইডস্ক্রিন ডিভাইসের মাত্রা। এটি আপনাকে প্রয়োজন অনুযায়ী ডিসপ্লে সাইজ উপরে বা কম করার উপর সম্পূর্ণ নিয়ন্ত্রণের অনুমতি দেয়, যার ফলে একটি ভাল প্রতিক্রিয়া হার সহ একটি সমাধান হয়।
2. সার্ভার দ্বন্দ্ব সমাধান করুন
এটা অনুমেয় যে কোনো প্লাগইন সার্ভারের দ্বন্দ্ব সৃষ্টি করবে। এলিমেন্টর ব্যবহার করার সময় আপনার হোস্টিং বা সার্ভারের সমস্যাগুলি কমাতে আপনি কোর এলিমেন্টর সেটিংসে একটি সাধারণ টুইক ব্যবহার করতে পারেন।
এলিমেন্টর অ্যাডভান্সড বিকল্পগুলিতে , স্যুইচ এডিটর লোডার পদ্ধতিটিকে ফ্রন্ট-এন্ডে সক্রিয় করুন এবং এটি সার্ভার কনফিগারেশন দ্বন্দ্ব সমাধানে সহায়তা করবে।
আপনি এলিমেন্টর এডিটর লোডার প্রক্রিয়া সক্রিয় করতে এই বিকল্পটি ব্যবহার করবেন, যা বিভিন্ন হোস্টিং সার্ভারের উদ্বেগের সাথে মোকাবিলা করার জন্য দরকারী।
3. ফন্ট লোডিং পদ্ধতি
এলিমেন্টর সাইটগুলিতে Google ফন্ট লোড প্রক্রিয়া ব্যবহারকারীদের দ্বারা পরিবর্তন করা যেতে পারে। এই টাইপফেসগুলি যেভাবে লোড করা হয় তা আপনার ওয়েবসাইট লোড হওয়ার গতিতে প্রভাব ফেলতে পারে। এলিমেন্টরের ক্রু নিয়মিতভাবে আপডেট প্রকাশ করে যা তাদের প্লাগইনের গতি উন্নত করে
নির্বাচন করার জন্য পাঁচটি ভিন্ন ফন্ট লোডিং কৌশল রয়েছে:
- ডিফল্ট: ফন্ট-ডিসপ্লে পদ্ধতি ব্রাউজার দ্বারা নির্ধারিত হয়।
- ব্লক করা: ফন্টের মুখের জন্য একটি ছোট ব্লক সময় এবং একটি সীমাহীন অদলবদল সময় সেট করে।
- ফলব্যাক: ফলব্যাক হিসাবে ফন্টকে একটি খুব ছোট ব্লক সময়কাল এবং খুব সংক্ষিপ্ত অদলবদল সময় দেয়।
- ঐচ্ছিক" যখন টেক্সটকে অস্পষ্ট করার কথা আসে, তখন এটি ফলব্যাকের মতই। শুধুমাত্র পার্থক্য হল ফন্টটি সম্পূর্ণ লোড না হওয়া পর্যন্ত এটি একটি ফলব্যাক ফন্ট ব্যবহার করে।
- অদলবদল: যদি একটি ফন্ট প্রত্যাশিত হিসাবে লোড করতে ব্যর্থ হয়, ফলব্যাক ফন্টগুলি উপলব্ধ হওয়ার পরে সর্বশেষ সংস্করণ ব্যবহার করে পুনরায় রেন্ডার করার আগে ব্যবহার করা হবে।
আপনার ফন্ট লোডিং একটি স্বাভাবিক সমস্যা হলে অদলবদল সবচেয়ে নির্ভরযোগ্য বিকল্প।
4. ইমেজ অপ্টিমাইজেশান
যখন আপনার ওয়েবসাইটের সামগ্রিক গতি বাড়ানোর কথা আসে, তখন ইমেজ অপ্টিমাইজেশান অত্যন্ত গুরুত্বপূর্ণ। গ্রাহকরা আশা করেন ওয়েবসাইটগুলি দ্রুত লোড হবে এবং আরও ভিজ্যুয়াল সামগ্রী থাকবে৷ আপনার ওয়েবসাইট লোড হতে সময় কমাতে আপনাকে অবশ্যই আপনার ফটোগ্রাফগুলি অপ্টিমাইজ করতে হবে৷
ওয়ার্ডপ্রেসের সাথে, আপনি অলস লোডিং বিকল্পটি ব্যবহার করতে পারেন যা অন্যান্য সামগ্রীর লোডিং দূর করে যখন শুধুমাত্র এই মুহূর্তের জন্য প্রয়োজনীয় সামগ্রী লোড করা হয়। যাইহোক, এটি এলিমেন্টরের সাথে কাজ করে না যেহেতু প্লাগইনটি একটি পৃথক স্টাইলশীটে পটভূমি চিত্র CSS তৈরি করে। ওয়ার্ডপ্রেসের সাথে, সবকিছুর জন্য একটি প্লাগইন রয়েছে। দ্রুত লোডিং গতির জন্য কীভাবে আপনার ছবিগুলি অপ্টিমাইজ করবেন সে সম্পর্কে আমাদের বিস্তারিত টিউটোরিয়াল দেখুন।
স্মুশ
এলিমেন্টরের সাথে সামঞ্জস্যপূর্ণ এবং ওয়ার্ডপ্রেসের জন্য একটি অল-ইন-ওয়ান ইমেজ অপ্টিমাইজেশান সমাধান। আপনার ফটোগুলি প্রাথমিক সার্ভারের পরিবর্তে একটি CDN এর মাধ্যমে পরিবেশন করা হবে, যার ফলে দ্রুত লোডের সময় এবং কম ব্যান্ডউইথ ব্যবহার হবে৷ এটি দর্শকের ব্রাউজার এবং ভিউপোর্টের জন্য উপযুক্ত চিত্রের আকার নির্বাচন করে এবং অলস লোডিংয়ের মাধ্যমে ফটোগুলি প্রদর্শন করে।
5. কার্যকরীভাবে আপনার প্লাগইন নির্বাচন করা
এলিমেন্টরের নিজস্ব নির্মাতা রয়েছে, তবে এটি আপনাকে আরও বিশেষ কিছুর প্রয়োজন হলে প্লাগইনগুলিকে সংহত এবং পরিচালনা করার অনুমতি দেয়। এলিমেন্টর, উদাহরণস্বরূপ, WooCommerce, Yoast, Rank Math, ACF, Toolset, Pods, LearnDash, Tutor LMS এবং MonsterInsights এর মত জনপ্রিয় ওয়ার্ডপ্রেস প্লাগইনগুলির সাথে সামঞ্জস্যপূর্ণ।
Elementor এর সাথে সামঞ্জস্যপূর্ণ প্লাগইনগুলি খুঁজে বের করার প্রচেষ্টা নিন। এলিমেন্টর উইজেটগুলি হ্যাপি অ্যাডঅনস এবং এসেনশিয়াল অ্যাডঅনগুলির মতো অ্যাড-অনগুলিতে অন্তর্ভুক্ত করা হয়েছে, যা আপনাকে আপনার সাইটের ফর্মগুলিকে ভিজ্যুয়াল এডিটরে সংহত করতে দেয়৷ আপনার Elementor সাইটে ফাংশন স্বয়ংক্রিয় করতে, আপনি Uncanny Automator এর মত একটি প্লাগইন ব্যবহার করতে পারেন।
6. DOM আউটপুট দিয়ে আপনার কর্মক্ষমতা উন্নত করুন
এলিমেন্টরের বর্তমান সংস্করণে বর্ধিত সম্পদ লোডিং এবং অ্যাক্সেসযোগ্যতা সহ বেশ কয়েকটি গতির উন্নতি রয়েছে। ছোট ফাইলের আকারের সম্পদগুলি দ্রুত লোড হয় এবং শর্তসাপেক্ষে লোড করা লাইটবক্সগুলি চাহিদা অনুযায়ী লোড হতে পারে।
যখন DOM উপাদান এবং পৃষ্ঠার ওজন আপনার ওয়েবসাইটের কার্যকারিতাকে বাধা দেয়, তখন Elementor সেগুলি কমানোর চেষ্টা করে। এটিতে ইনলাইন লোডিংও রয়েছে, যা ব্যবহারকারীদের কোনো তথ্য বা কার্যকারিতা প্রদর্শন করার আগে সমস্ত জাভাস্ক্রিপ্ট ফাইল সম্পূর্ণরূপে ডাউনলোড করার জন্য অপেক্ষা না করেই উইজেটগুলি দেখতে দেয়৷
যাইহোক, কিছু পরিবর্তন বেশি সময় নিতে পারে কারণ তাদের বাধা সৃষ্টির সম্ভাবনা কম থাকে, অন্যদের ভুলভাবে করা হলে সমস্যা সৃষ্টির ঝুঁকি বেশি থাকে।
কোন সন্দেহ নেই যে Elementor ওয়েবসাইট ডিজাইন এবং কর্মক্ষমতা একটি উল্লেখযোগ্য অগ্রগতি. এটিতে স্লাইডার, অ্যানিমেশন এবং লাইভ ফর্ম বিল্ডারগুলির মতো অনেকগুলি নতুন ক্ষমতা রয়েছে যা দর্শকদের কাছ থেকে ডেটা সংগ্রহ করার পাশাপাশি জিনিসগুলি বিক্রি করে এমন ওয়েবসাইটগুলির ব্যবহারকারীর অভিজ্ঞতা বাড়াতে সাহায্য করতে পারে৷
এবং এই টিউটোরিয়ালের জন্য এই সবই আমাদের কাছ থেকে। আমাদের টিউটোরিয়াল সম্পর্কে আপডেট থাকতে Facebook এবং Twitter- এ আমাদের সাথে যোগ দিতে ভুলবেন না।
