দ্রুত ল্যান্ডিং পেজ সাধারণত আরও বেশি কনভার্সন এনে দেয় এবং AMP হলো আকর্ষণীয় গুগল অ্যাডস ল্যান্ডিং পেজ তৈরি করার একটি চমৎকার উপায়, যা আরও দ্রুত লোড হয়। amp.dev ওয়েব ডেভেলপারদের আকর্ষণীয় ও উচ্চ পারফরম্যান্সের পেজ তৈরির জন্য প্রয়োজনীয় রিসোর্স সরবরাহ করে। এই ধাপে ধাপে নির্দেশিকাটিতে বর্ণনা করা হয়েছে কীভাবে আপনার AMP পেজগুলোতে গুগল অ্যাডস এবং অন্যান্য বিজ্ঞাপন প্রযুক্তি ব্যবহার করতে হয়।
ধাপ ১: AMP পেজ তৈরি এবং যাচাই করুন
AMP পৃষ্ঠা তৈরি করুন
একটি সাধারণ AMP পেজ কীভাবে তৈরি করতে হয় তা শিখতে, AMP প্রজেক্টের ' Create your first AMP page' টিউটোরিয়ালটি দিয়ে শুরু করুন। আরও হাতে-কলমে ও ধাপে ধাপে নির্দেশনার জন্য, 'Convert HTML to AMP' এবং 'Add advanced AMP features' টিউটোরিয়ালগুলো সম্পূর্ণ করুন। আপনি 'AMP Websites Examples' এবং 'AMP Templates' থেকে AMP কম্পোনেন্টগুলোর নমুনা কোড এবং টেমপ্লেট খুঁজে নিতে পারেন।
নিচের তালিকায় এএমপি পেজে ব্যবহৃত কিছু উপাদানের বর্ণনা দেওয়া হয়েছে— সম্পূর্ণ তথ্যের জন্য উপাদানগুলো দেখুন।
- amp-bind : জাভাস্ক্রিপ্টের মতো ইভেন্টের উপর ভিত্তি করে কাস্টম স্টেটফুল ইন্টারঅ্যাকটিভিটি যোগ করুন।
- amp-form : এমন ল্যান্ডিং পেজ তৈরি করুন যেখানে ব্যবহারকারীর কাছ থেকে ইনপুট প্রয়োজন হয়।
- amp-list : একটি CORS JSON এন্ডপয়েন্ট থেকে ডায়নামিকভাবে কন্টেন্ট ফেচ করুন।
- amp-carousel : একটি ইমেজ গ্যালারি স্ক্রল করার জন্য ইমেজ ক্যারোসেল।
- amp-lightbox : কোনো কম্পোনেন্টের সাথে ইন্টারঅ্যাক্ট করা হলে সেটির পূর্ণ-স্ক্রিন ভিউ প্রদর্শন করে।
- amp-call-tracking কল ট্র্যাকিংয়ের জন্য একটি হাইপারলিঙ্কে থাকা ফোন নম্বরকে গতিশীলভাবে প্রতিস্থাপন করে।
- amp-mustache : Mustache.js দিয়ে রেন্ডারিং করার অনুমতি দেয়।
- amp-date-picker : তারিখ নির্বাচন করার জন্য একটি উইজেট প্রদান করে। ডেট পিকারটি ইনপুট ফিল্ডের সাপেক্ষে একটি ওভারলে হিসাবে, অথবা একটি স্থির ক্যালেন্ডার উইজেট হিসাবে প্রদর্শিত হতে পারে।
AMP পৃষ্ঠাগুলি যাচাই করুন
ডেভেলপমেন্টের সময় আপনাকে নিশ্চিত করতে হবে যে আপনার AMP পেজগুলো বৈধ। আপনার ডকুমেন্টগুলো ভ্যালিডেট করার জন্য AMP বিভিন্ন পদ্ধতি প্রদান করে। একটি AMP পেজ ভ্যালিডেট করার সবচেয়ে প্রচলিত উপায় হলো ওয়েব ভ্যালিডেটর অথবা গুগল ওয়েবমাস্টার টুলস ভ্যালিডেটর ব্যবহার করা। এছাড়াও আপনি ক্রোম ব্রাউজার প্লাগইন ও ডেভেলপার কনসোল ব্যবহার করতে পারেন, অথবা আপনার বিল্ডে amphtml-validator npm মডিউলটি ইন্টিগ্রেট করতে পারেন।
আপনি AMPBench- ও ব্যবহার করতে পারেন, যা একটি ওপেন সোর্স ওয়েব অ্যাপ্লিকেশন ও পরিষেবা। এটি AMP পেজ ডেপ্লয়মেন্ট সংক্রান্ত সমস্যা যাচাই ও ডিবাগ করতে ব্যবহৃত হয়।
AMP টেস্টিং সংক্রান্ত সহায়তার জন্য, AMP প্রজেক্টের ' Getting Support' পেজটি দেখুন।
ধাপ ২: কনভার্সন ট্র্যাকিং এবং অ্যানালিটিক্সের জন্য AMP সেট আপ করুন।
গুগল বিজ্ঞাপন রূপান্তর ট্র্যাকিং
Google Ads কনভার্সন ট্র্যাক করতে amp-analytics কম্পোনেন্টটি ব্যবহার করুন। এটি কীভাবে সেট আপ করতে হয় তা জানতে, ‘Set up Google Ads conversion measurement for AMP landing pages’- এর ধাপগুলো অনুসরণ করুন।
গুগল অ্যানালিটিক্স
গুগল অ্যানালিটিক্স হলো amp-analytics দ্বারা সমর্থিত অ্যানালিটিক্স সমাধানগুলোর মধ্যে একটি। AMP এবং নন-AMP পেজগুলোর মধ্যে সেশন একীভূত করতে, “Set up Google Analytics session unification for AMP”- এর ধাপগুলো অনুসরণ করুন।
গুগল ট্যাগ ম্যানেজার
amp-analytics কম্পোনেন্টটিতে Google Tag Manager-এর জন্য বিল্ট-ইন সাপোর্ট রয়েছে। Google Ads কনভার্সন ছাড়াও, আপনি Google Tag Manager ব্যবহার করে রিমার্কেটিং, DoubleClick Floodlight, Google Universal Analytics এবং এই জাতীয় অন্যান্য মেজারমেন্ট প্রোডাক্ট যোগ করতে পারেন। সামঞ্জস্যপূর্ণ ট্যাগগুলোর সম্পূর্ণ তালিকা দেখুন।
অ্যাডোবি অ্যানালিটিক্স (পূর্বে অমনিচার নামে পরিচিত)
Adobe Analytics তাদের amp-analytics কম্পোনেন্টের সাথে ওয়েবসাইট পারফরম্যান্স ট্র্যাকিং সলিউশন বাস্তবায়নের জন্য দুটি পদ্ধতি প্রদান করে: iframe ( adobeanalytics_nativeConfig ) এবং non-iframe ( adobeanalytics ) বাস্তবায়ন। প্রতিটি পদ্ধতির সুবিধা-অসুবিধা এবং বাস্তবায়নের বিস্তারিত বিবরণ সম্পর্কে পড়ুন।
অন্যান্য সাধারণ গুগল অ্যাডস-সম্পর্কিত প্রযুক্তি একীভূত করা
আপনি ব্যবহারকারীর কার্যকলাপ এবং ইভেন্ট ট্র্যাক করতে amp-analytics কম্পোনেন্টটি ব্যবহার করতে পারেন। AMP অ্যানালিটিক্স ৪০টিরও বেশি অ্যানালিটিক্স ভেন্ডরের নেটিভ সাপোর্ট সহ আসে। এই ফ্রেমওয়ার্কটি নমনীয় এবং আপনাকে কাস্টম কনফিগারেশন ব্যবহার করে URL পরিমাপ ও ট্রিগার করার সুযোগ দেয়, যার মাধ্যমে আপনি আপনার নিজের সার্ভারে অথবা এমন ভেন্ডরদের কাছে অ্যানালিটিক্স তথ্য পাঠাতে পারেন যেখানে নেটিভ AMP সাপোর্ট নেই। আপনি যদি এমন কোনো প্রযুক্তি ব্যবহার করেন যা বর্তমানে সমর্থিত নয়, তবে আপনার ভেন্ডরকে সাপোর্ট যোগ করার জন্য বলুন ।
এএমপি অ্যানালিটিক্স নমনীয় ভেরিয়েবল প্রতিস্থাপনেরও সুযোগ দেয়; বিস্তারিত জানতে, ভেরিয়েবল প্রতিস্থাপন ডকুমেন্টেশন দেখুন।
ধাপ ৩: গুগল অ্যাডস UI-তে AMP সার্ভিং সক্রিয় করুন।
যদিও গুগল সার্চে এএমপি পেজগুলো আপনার পেজের লিঙ্কের মাধ্যমে স্বয়ংক্রিয়ভাবে খুঁজে পাওয়া যায় , বিজ্ঞাপনদাতাদের অবশ্যই গুগল অ্যাডসে এএমপি পেজের ইউআরএল স্পষ্টভাবে উল্লেখ করতে হবে। গুগল অ্যাডস ইউআই-তে এএমপি ইউআরএল সেট আপ করার বিস্তারিত জানতে ‘গুগল অ্যাডসের সাথে এএমপি কীভাবে ব্যবহার করবেন’ পড়ুন।
এছাড়াও, যদি আপনি আপনার AMP ল্যান্ডিং পেজে Google Ads ট্র্যাফিক আনতে চান কিন্তু না চান যে সেগুলি অর্গানিক সার্চ রেজাল্টে দেখা যাক, তাহলে যেকোনো সাধারণ ওয়েব পেজের মতোই আপনার robots.txt ফাইলে প্রাসঙ্গিক AMP পেজগুলির জন্য Disallow নির্দেশাবলী যোগ করুন।
এএমপি প্রজেক্টে প্রতিদিন নতুন নতুন কার্যকারিতা ও উপাদান যুক্ত করা হচ্ছে। যদি আপনি কোনো অনুপস্থিত কার্যকারিতা খুঁজে পান, তবে একটি গিটহাব ইস্যু খোলার মাধ্যমে আপনি অবদান রাখতে পারেন অথবা সেটি যুক্ত করার জন্য অনুরোধ করতে পারেন।