প্রকাশিত: ২২ জুন, ২০২৬
এআই এজেন্টরা যখন শুধু টেক্সট তৈরি করা থেকে আপনার ওয়েবসাইটে ব্রাউজিং, ইন্টারঅ্যাক্ট করা এবং জটিল কাজ সম্পন্ন করার দিকে বিকশিত হচ্ছে, তখন এই অ-মানব ব্যবহারকারীদের জন্য একটি উচ্চ-মানের অভিজ্ঞতা নিশ্চিত করতে ডেভেলপারদের বিশেষ টুলের প্রয়োজন। নতুন লাইটহাউস এজেন্টিক ব্রাউজিং ক্যাটাগরি, ক্রোম ডেভটুলস-এর উন্নত সংস্করণের সাথে মিলিত হয়ে, আপনাকে এজেন্ট-রেডি ওয়েবসাইট তৈরি করতে সাহায্য করার জন্য ডিটারমিনিস্টিক অডিট এবং একটি টেস্টিং ফ্রেমওয়ার্ক প্রদান করে।
এজেন্টিক ওয়েবে রূপান্তরের দুটি প্রধান পর্যায় রয়েছে: এজেন্টদের দ্বারা ওয়েব অনুসন্ধান এবং এজেন্টদের দ্বারা ওয়েব ব্যবহার ।
যখন এজেন্টরা শুধু ওয়েবসাইট খোঁজে, তখনও সার্চ ইঞ্জিন অপটিমাইজেশন (SEO)-এর মূলনীতিগুলো প্রযোজ্য থাকে । এই ব্লগ পোস্টে, আমরা সেই কাজের উপর আলোকপাত করব যা ডেভেলপাররা করতে পারেন যখন কোনো এজেন্ট সরাসরি ওয়েবসাইটের সাথে ইন্টারঅ্যাক্ট করে।
আপনার এজেন্ট-রেডি ওয়েবসাইট নিরীক্ষা করুন, উন্নত করুন এবং ডিবাগ করুন।
আপনার সাইটে একটি এআই এজেন্টকে নির্ভরযোগ্যভাবে কোনো কাজ, যেমন অ্যাপয়েন্টমেন্ট বুক করা বা অর্ডার দেওয়া, সম্পন্ন করতে হলে তার অনুমানযোগ্য ও মেশিন-পাঠযোগ্য সংকেত প্রয়োজন। এই প্রস্তুতি মূল্যায়ন ও উন্নত করতে আপনাকে সাহায্য করার জন্য এখানে কিছু টুল দেওয়া হলো।
আপনার ওয়েবসাইটের এজেন্টিক-প্রস্তুতি নিরীক্ষা করুন
লাইটহাউসের নতুন এজেন্টিক ব্রাউজিং ক্যাটাগরিটি M150 থেকে পাওয়া যাচ্ছে এবং এটি ডেভেলপারদের তাদের ওয়েবসাইটগুলো কতটা এজেন্ট-বান্ধব তা মূল্যায়ন করার জন্য একগুচ্ছ সুনির্দিষ্ট নিরীক্ষা প্রদান করে, যা নতুন শিল্প মান গ্রহণে উৎসাহিত করে।
অডিটে যা যা যাচাই করা হয় : এই অডিটগুলো মেশিনের সাথে মিথস্ক্রিয়ার জন্য গুরুত্বপূর্ণ তিনটি মূল ক্ষেত্রের উপর আলোকপাত করে:
- অ্যাক্সেসিবিলিটি : অ্যাক্সেসিবিলিটি মূলত মানুষের জন্য। এজেন্টরা তাদের প্রাথমিক ডেটা মডেল হিসেবে অ্যাক্সেসিবিলিটি ট্রি-এর উপর নির্ভর করে, যা অ্যাসিস্টিভ টেকনোলজি (AT)-এর জন্য DOM থেকে উদ্ভূত হয়। এজেন্টিক ব্রাউজিং অডিটটি অ্যাক্সেসিবিলিটি অডিট থেকে এমন কিছু বিভাগ যাচাই করে যা মেশিনের সাথে মিথস্ক্রিয়ার জন্য অত্যন্ত গুরুত্বপূর্ণ। উদাহরণস্বরূপ, উভয় অডিটই যাচাই করে যে প্রতিটি ইন্টারেক্টিভ এলিমেন্টের একটি প্রোগ্রাম্যাটিক নাম আছে। একটি সুগঠিত অ্যাক্সেসিবিলিটি ট্রি-ই হলো সেই প্রধান উপায় যার মাধ্যমে এআই এজেন্টরা আপনার পৃষ্ঠাটি বুঝতে পারে।
- স্থিতিশীলতা : কিউমুলেটিভ লেআউট শিফট (CLS) ব্যবহার করে ভিজ্যুয়াল স্থিতিশীলতা পরিমাপ করে, যাতে এলিমেন্টগুলো অপ্রত্যাশিতভাবে সরে না যায় এবং এজেন্টের ভুল ক্লিক প্রতিরোধ করা যায়।
- WebMCP ইন্টিগ্রেশন : এটি নিবন্ধিত WebMCP টুলগুলোর প্রাপ্যতা, ডিক্লারেটিভ WebMCP অনুপস্থিত ফর্ম এবং স্কিমার বৈধতা যাচাই করে। WebMCP গ্রহণ করলে এজেন্টরা আপনার সাইটের লজিক ও ফর্মগুলোকে সুস্পষ্টভাবে প্রকাশ করতে পারে, যা ইন্টারঅ্যাকশনকে নির্ভরযোগ্য করে তোলে।
স্কোর : অন্যান্য লাইটহাউস ক্যাটাগরির মতো নয়, প্রকাশের সময় এজেন্টিক ব্রাউজিং একটি তথ্যমূলক এবং অ-বেঞ্চমার্কযুক্ত বিভাগ । এর মূল লক্ষ্য হলো একটি সুনির্দিষ্ট র্যাঙ্কিংয়ের পরিবর্তে কার্যকরী সংকেত (পাস বা ফেলের অবস্থা এবং সতর্কতা) প্রদান করা।
নির্দিষ্ট অডিট চেকগুলো এবং উন্নতির জন্য আপনি কী করতে পারেন সে সম্পর্কে আরও জানতে, লাইটহাউসের এজেন্ট ব্রাউজিং অডিট সংক্রান্ত ডকুমেন্টেশন দেখুন।
এজেন্ট এবং ওয়েবসাইটের মধ্যে মিথস্ক্রিয়াকে আরও দ্রুত এবং নির্ভরযোগ্য করে তুলুন
WebMCP হলো একটি প্রস্তাবিত স্ট্যান্ডার্ড, যার লক্ষ্য হলো বিদ্যমান ওয়েবসাইটগুলিতে AI এজেন্টদের জন্য স্ট্রাকচার টুল উন্মুক্ত করা, যা এজেন্টদের মিথস্ক্রিয়াকে ত্বরান্বিত ও সরল করে। এর বাস্তবায়ন সম্পর্কে আরও তথ্যের জন্য, WebMCP সম্পর্কে পড়ুন দেখুন।
আপনার পছন্দের কোডিং এজেন্ট ব্যবহার করে সর্বশেষ ফিচারগুলো প্রয়োগ করুন।
মডার্ন ওয়েব গাইডেন্স ডেভেলপারদের এজেন্ট-রেডি ওয়েবসাইট তৈরি করতে সাহায্য করার জন্য সেরা অনুশীলন এবং দক্ষতার একটি সংগ্রহ প্রদান করে। এতে webmcp স্কিলটি অন্তর্ভুক্ত রয়েছে, যা আপনাকে আপনার কোডিং এজেন্টের কাছে WebMCP টুলস বাস্তবায়নের দায়িত্ব অর্পণ করতে দেয়। আপনার ডেভেলপমেন্ট ওয়ার্কফ্লোতে মডার্ন ওয়েব গাইডেন্সকে একীভূত করার মাধ্যমে, আপনি নিশ্চিত করতে পারেন যে আপনার অ্যাপ্লিকেশনটি একেবারে গোড়া থেকেই আধুনিক, এজেন্ট-বান্ধব মানদণ্ড মেনে তৈরি হয়েছে। আরও জানতে, মডার্ন ওয়েব গাইডেন্স ডকুমেন্টেশন দেখুন।
এজেন্টদের জন্য ক্রোম ডেভটুলস দিয়ে আপনার ওয়েবসাইট পরীক্ষা ও ডিবাগ করুন।
গভীর ডিবাগিং এবং পুনরাবৃত্তিমূলক উন্নয়নের জন্য, Chrome DevTools for Agents একটি অনন্য টেস্টিং পার্সোনা প্রদান করে। এটি আপনাকে আপনার নিজস্ব এআই-সহায়তাযুক্ত IDE বা কোডিং এজেন্টকে একটি ব্রাউজিং এজেন্টে রূপান্তরিত করতে দেয়, যা আপনাকে উচ্চ মাত্রার নিয়ন্ত্রণ প্রদান করে।
এজেন্টদের জন্য ডেভটুলস-এর মাধ্যমে আপনি যা করতে পারেন:
- এজেন্টের মিথস্ক্রিয়া অনুকরণ করুন: আপনি একজন এজেন্টের নেওয়া সুনির্দিষ্ট পদক্ষেপগুলো অনুকরণ করতে পারেন, কার্যকরভাবে "ব্যবহারকারী (বা এজেন্ট) হয়ে ব্যর্থতাগুলো পুনরুৎপাদন করতে এবং আপনার ওয়েবসাইটের কার্যপ্রবাহ যে সুনির্দিষ্ট, তা যাচাই করতে পারেন।
- সরাসরি লাইটহাউস চালু করা: আপনার টেস্টিং এনভায়রনমেন্ট সক্রিয় ট্যাবে সরাসরি
lighthouse_auditটুলটি চালু করতে পারে। এটি পেজের বর্তমান অবস্থার উপর ভিত্তি করে তাৎক্ষণিক ও একাধিক ক্যাটাগরির হেলথ চেক প্রদান করে, যা আপনাকে Agentic Browsing স্ট্যান্ডার্ডের সাথে মিলিয়ে সমাধানগুলো পর্যায়ক্রমে যাচাই করার সুযোগ দেয়। - স্ক্রিনকাস্ট এবং ডিবাগ: টুলটি বিস্তারিত লগিং এবং স্ক্রিনকাস্টের সুবিধা দেয়, ফলে এজেন্ট কীভাবে পেজটিকে উপলব্ধি করে এবং তার সাথে ইন্টারঅ্যাক্ট করে, তা আপনি স্পষ্টভাবে দেখতে পারেন। এর ফলে অ্যাক্সেসিবিলিটি ট্রি-এর মতো কিছু মেশিন-পঠনযোগ্য সিগন্যাল প্রকাশ পায়, যা এজেন্টকে বিভ্রান্ত করতে পারে।
এটি আপনাকে স্থাপনের আগে অ-মানব ব্যবহারকারীদের জন্য একটি উচ্চ-মানের অভিজ্ঞতা নিশ্চিত করতে সাহায্য করে।
Chrome DevTools for Agents-এর কার্যকারিতা এবং কনফিগারেশন সম্পর্কে আরও জানতে, আমাদের GitHub রিপোজিটরি দেখুন।
এজেন্টদের জন্য ক্রোম ডেভটুলস-এর নিম্নলিখিত উদাহরণ কনফিগারেশনটি (AntigravityCLI-এর জন্য ~/.gemini/config/mcp_config.json অথবা Antigravity-তে কনফিগার করা) ক্রোম ক্যানারির সাথে সংযোগ স্থাপন করে।
{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": [
"-y",
"chrome-devtools-mcp@latest",
"--autoConnect",
"--categoryExperimentalWebmcp",
"--channel=canary"
]
}
}
}
এই উদাহরণ কোয়েরিটি ব্যবহার করুন: "Chrome DevTools MCP ব্যবহার করে, https://googlechromelabs.github.io/webmcp-tools/demos/pizza-maker/ -এ যান এবং ১০টি মাশরুম ও ২টি বেল পেপার দিয়ে আমার জন্য একটি পিৎজা তৈরি করুন; আপনি কী করেছেন এবং কোন টুলগুলো ব্যবহার করেছেন তার একটি সারসংক্ষেপ আমাকে অবশ্যই দেবেন।"
আপনি এজেন্টিক-রেডিনেস লাইটহাউস অডিট সম্পাদন করতে ডেভটুলস ফর এজেন্টস-ও ব্যবহার করতে পারেন:
আমি Chrome DevTools MCP ব্যবহার করে https://googlechromelabs.github.io/webmcp-tools/demos/french-bistro/?notoolname-এর উপর একটি এজেন্টিক লাইটহাউস অডিট করতে চাই; আমাকে একটি পূর্ণাঙ্গ সারসংক্ষেপ দিন।
এরপর কী?
অবদান রাখতে এবং আলোচনায় অংশ নিতে, অফিসিয়াল লাইটহাউস রিপোজিটরি দেখুন।
WebMCP সম্পর্কে আরও তথ্যের জন্য, WebMCP ডকুমেন্টেশন দেখুন। Modern Web Guidance সম্পর্কে আরও তথ্যের জন্য, Modern Web Guidance ডকুমেন্টেশন দেখুন। জেনারেটিভ এআই-এর জন্য আপনার ওয়েবসাইট অপ্টিমাইজ করা সম্পর্কে আরও তথ্যের জন্য, Google Search-এ জেনারেটিভ এআই ফিচারগুলির জন্য আপনার ওয়েবসাইট অপ্টিমাইজ করা দেখুন।