নিজের ফোনে একটা সাইট খুলতে গিয়ে কি কখনো এমন হয়েছে যে লেখা এত ছোট যে আঙুল দিয়ে টেনে বড় করতে হচ্ছে, বাটন চাপতে গিয়ে পাশেরটা চাপা পড়ছে, আর পুরো পাতা ডানে-বামে সরাতে সরাতে বিরক্ত হয়ে ব্যাক বাটন চেপে দিয়েছেন? আপনার সাইটে ঢুকে একজন ক্রেতা ঠিক এই অভিজ্ঞতাই পেলে কী হবে, সেটা সহজেই বোঝা যায়। তিনি চলে যাবেন, আর সম্ভবত অন্য কারো কাছ থেকে কিনবেন।
মোবাইল রেসপনসিভ মানে কী?
রেসপনসিভ ডিজাইন মানে এমন ওয়েবসাইট, যেটা নিজে থেকেই পর্দার মাপ বুঝে নিজের চেহারা বদলে নেয়। একই সাইট ডেস্কটপে চওড়া লেআউটে দেখায়, ট্যাবলেটে মাঝারি আকারে, আর ফোনে এক কলামে সাজানো থাকে। আলাদা করে মোবাইলের জন্য একটা সাইট, কম্পিউটারের জন্য আরেকটা বানাতে হয় না। একটাই সাইট, সব ডিভাইসে ঠিকঠাক।
১. আপনার কাস্টমার আসলে ফোনেই আছে
আমাদের দেশে অনেক মানুষের কাছে ইন্টারনেট মানেই মোবাইল ফোন। বাসের সিটে, রিকশায়, অফিসের লাঞ্চ ব্রেকে বা রাতে বিছানায় শুয়ে মানুষ ফোনেই দেখে, ফোনেই কেনে। বিশেষ করে ফেসবুক বা ইনস্টাগ্রামের বিজ্ঞাপন থেকে যারা আপনার সাইটে আসছেন, তাদের প্রায় সবাই আসছেন ফোন থেকে। এই মানুষগুলোর জন্য সাইট ঠিকমতো না চললে বিজ্ঞাপনের টাকাটাই জলে যায়।
২. প্রথম কয়েক সেকেন্ডেই সিদ্ধান্ত হয়ে যায়
ভিজিটর সাইটে ঢুকে খুব দ্রুত ঠিক করে ফেলেন, তিনি থাকবেন কি না। লেখা পড়া যাচ্ছে না, ছবি পর্দা ছাপিয়ে যাচ্ছে, মেনু খুলছে না, এমন হলে তিনি অপেক্ষা করবেন না। সাইট ছেড়ে চলে যাওয়ার হার (বাউন্স রেট) তখন বেড়ে যায়। উল্টোদিকে, যে সাইট ফোনে আরামে পড়া ও চালানো যায়, সেখানে মানুষ বেশি সময় থাকে, বেশি পেজ দেখে, আর কেনাকাটার দিকে এগোয়।
৩. গুগলও মোবাইল ভার্সনকেই আসল ধরে
গুগল এখন সাইট র্যাঙ্ক করার সময় মূলত মোবাইল ভার্সনটাকেই দেখে, একে বলা হয় মোবাইল-ফার্স্ট ইনডেক্সিং। অর্থাৎ আপনার সাইটের ডেস্কটপ রূপ যতই সুন্দর হোক, মোবাইল রূপ খারাপ হলে সার্চ রেজাল্টে পিছিয়ে পড়ার ঝুঁকি থাকে। গুগলে “ঢাকায় ভালো ক্যাটারিং” লিখে খুঁজলে যে সাইটগুলো ওপরে আসে, তাদের বেশিরভাগই ফোনে ঠিকঠাক চলে। সার্চে আসতে চাইলে মোবাইল-ফ্রেন্ডলি হওয়া এখন প্রায় শর্ত।
৪. কেনাকাটা আর যোগাযোগ সহজ হয়
ফোনের ছোট পর্দায় বাটন বড় আর চাপার মতো দূরত্বে থাকা জরুরি। “ফোন করুন” বাটনে চাপ দিলে সরাসরি কল চলে যাবে, ঠিকানায় চাপ দিলে ম্যাপ খুলবে, ফর্ম পূরণ করা যাবে সহজে, এই ছোট ছোট সুবিধাগুলোই আসলে অর্ডার বা অনুসন্ধান এনে দেয়। ই-কমার্স সাইটে চেকআউটের ধাপগুলো ফোনে জটিল হলে ক্রেতা শেষ মুহূর্তে কার্ট ফেলে চলে যান। রেসপনসিভ ডিজাইন এই ঝামেলা কমায়।
৫. এক সাইট, কম খরচ, কম ঝামেলা
আগে অনেকে ডেস্কটপ ও মোবাইলের জন্য আলাদা সাইট বানাতেন। এতে দুটো সাইটই আলাদা করে আপডেট করতে হতো, খরচ আর পরিশ্রম দুটোই বেড়ে যেত। রেসপনসিভ সাইটে একবার কনটেন্ট বদলালে সব ডিভাইসে একসঙ্গে বদলে যায়। দীর্ঘমেয়াদে সময় আর টাকা, দুটোই বাঁচে।
৬. ব্র্যান্ডের ছাপ পড়ে
কেউ হয়তো আপনার ব্যবসাকে প্রথমবার ফোনের পর্দাতেই দেখছেন। সেই প্রথম দেখায় যদি সাইট এলোমেলো মনে হয়, তাহলে ব্যবসাটাকেও অগোছালো ভেবে নিতে পারেন। গোছানো, পরিষ্কার মোবাইল সাইট বোঝায় যে আপনি ক্রেতার সুবিধার কথা ভাবেন। এই বিশ্বাসটা অনেক সময় দামের চেয়েও বড় ভূমিকা রাখে।
আপনার সাইট মোবাইলে ঠিক আছে কি না, কীভাবে বুঝবেন?
নিজের ফোনে খুলে দেখুন। একাধিক ফোনে হলে আরও ভালো, কারণ পর্দার মাপ ভেদে চেহারা আলাদা হতে পারে।
লেখা পড়তে জুম করতে হচ্ছে কি না দেখুন। করতে হলে ফন্ট ছোট।
বাটন ও লিংকে সহজে আঙুল পড়ছে কি না দেখুন। পাশাপাশি অনেক লিংক ঠাসা থাকলে সমস্যা।
পাতা ডানে-বামে সরাতে হচ্ছে কি না দেখুন। সরাতে হলে লেআউট ঠিক নেই।
গুগলের ফ্রি টুল PageSpeed Insights দিয়ে সাইটের মোবাইল পারফরম্যান্স ও লোডিং গতি যাচাই করে নিন।
মোবাইল ডিজাইনের কয়েকটা সহজ নিয়ম
ফোনের জন্য ডিজাইন করার সময় আগে সবচেয়ে জরুরি তথ্যটা ওপরে রাখুন। লেখা পড়ার মতো বড় রাখুন, বাটন আঙুলের মাপের হোক। ছবি ছোট সাইজে কমপ্রেস করুন, নইলে ধীর নেটওয়ার্কে সাইট খুলতেই সময় লাগবে। ঝকঝকে কিন্তু ভারী পপ-আপ আর স্লাইডার যতটা পারেন কমান। আর ফর্মে যত কম ঘর থাকবে, ফোনে তা পূরণ করা তত সহজ হবে।
শেষ কথা
মোবাইল রেসপনসিভ ওয়েবসাইট এখন আলাদা কোনো সুবিধা নয়, এটা একটা ন্যূনতম প্রত্যাশা। আপনার ক্রেতা ফোনে আছেন, গুগল ফোনের ভার্সন দেখে, আর খারাপ অভিজ্ঞতা পেলে মানুষ নিঃশব্দে চলে যায়, কোনো অভিযোগও করে না। নতুন সাইট বানানোর সময় ডেভেলপারকে শুরুতেই বলে দিন, মোবাইলকে আগে ভাবতে হবে। আর পুরোনো সাইট থাকলে আজই ফোনে একবার খুলে দেখে নিন।