ফজলে রাব্বীগ্রাহকেরা বলেন, আপনার ওয়েবসাইট ফোনে "ঠিকমতো খোলে না"। লেখা এত ছোট যে জুম করতে হয়, বাটনগুলো একটার ওপর আরেকটা উঠে যায়, মেনু খোলে না, অর্ডার ফর্ম স্ক্রিনের বাইরে চলে যায়। অথচ আপনার অনেক ভিজিটরই আসেন ফেসবুক পোস্ট বা বিজ্ঞাপন থেকে, ফোনে, অনেক সময় মোবাইল ডেটায়। ওয়েবসাইটে আটকে গেলে তারা ফেসবুকে ফিরে গিয়ে অন্য কাউকে মেসেজ করেন।
সমাধান সাধারণত আরও কিছু ছোট জোড়াতালি নয়। দরকার এমন একটি রিডিজাইন, যা শুরু হয় ফোনের স্ক্রিন থেকে।
পুরোনো ডেস্কটপ সাইট জোড়াতালিতে কেন টেকে না
অনেক ব্যবসার ওয়েবসাইট ল্যাপটপের স্ক্রিন ধরে বানানো, পরে কোনোভাবে ফোনে ফিট করানো হয়েছে। পুরোনো থিম, নির্দিষ্ট মাপের পেজ বিল্ডার, বড় ইমেজ স্লাইডার আর চওড়া টেবিল ছোট স্ক্রিনে ঝামেলা করে। ডেভেলপার একটি পেজ ঠিক করে দিলেও পরের বার নতুন পণ্য যোগ করলে বা থিম আপডেট করলে আরেক জায়গায় সমস্যা দেখা দেয়।
তবে কখনো কয়েকটি নির্দিষ্ট সংশোধনই যথেষ্ট, যেমন সাইট মোটামুটি নতুন আর শুধু মেনু বা একটি ফর্মে সমস্যা। খরচ করার আগে একটি সৎ অডিট বলে দেয় আপনার অবস্থা কোনটি।
পনেরো মিনিটে নিজেই পরীক্ষা করুন
- নিজের ফোনে আর একটি কম দামের অ্যান্ড্রয়েড ফোনে সাইটটি খুলুন, যেমন ফোন আপনার অনেক গ্রাহক ব্যবহার করেন।
- ওয়াই-ফাই বন্ধ করে মোবাইল ডেটায় দেখুন, তাহলে আসল লোডিং সময় বুঝবেন।
- গ্রাহক যে কাজে আসেন সেটা করে দেখুন: পণ্য খোঁজা, দাম দেখা, কল বা হোয়াটসঅ্যাপ করা, অর্ডার দেওয়া।
- যেখানে জুম করতে হলো, পাশে স্ক্রল করতে হলো, অপেক্ষা করতে হলো বা দুবার ট্যাপ করতে হলো, সব লিখে রাখুন।
- বাংলা লেখা ঠিকভাবে দেখাচ্ছে কিনা আর পড়ার মতো বড় কিনা দেখুন।
- হোম পেজ আর একটি পণ্য বা সার্ভিস পেজ Google PageSpeed Insights দিয়ে পরীক্ষা করুন, এটি বিনামূল্যে মোবাইল রিপোর্ট দেয়।
সমস্যাগুলোর এই তালিকাই হবে রিডিজাইনের ব্রিফ।
মোবাইল-ফার্স্ট মানে আসলে কী বদলায়
মোবাইল-ফার্স্ট ডিজাইনে আগে সরু স্ক্রিন আর বুড়ো আঙুলের কথা ভেবে পরিকল্পনা হয়, তারপর বড় স্ক্রিনের জন্য বাড়ানো হয়। বাস্তবে এর মানে:
- এক কলামে কনটেন্ট, গ্রাহকের দরকারের ক্রমে: আপনি কী দেন, দাম বা দাম জানার উপায়, আর কীভাবে অর্ডার করবেন।
- বড় বাটন, আর কল বা হোয়াটসঅ্যাপ বাটন সবসময় হাতের নাগালে।
- ছোট ফর্ম, শুধু দরকারি তথ্য, আর ফোন নম্বরের ঘরে নম্বরের কিবোর্ড।
- ছবি ছোট আর কমপ্রেস করা, যাতে দুর্বল নেটওয়ার্কেও পেজ খোলে।
- ছোট মেনু, কম দরকারি পেজগুলো নিচে ফুটারে।
- বাংলা আর ইংরেজি দুটোর জন্যই পড়ার মতো ফন্ট।
ডিজাইনের আগে যা ঠিক করবেন
- মূল কাজ: ফোনের ভিজিটর কী করবেন, কল, মেসেজ, অর্ডার নাকি বুকিং? প্রতিটি পেজ সেই একটি কাজ সহজ করবে।
- কোন পেজগুলো জরুরি: অ্যানালিটিক্স থাকলে দেখুন মানুষ আসলে কোন পেজে যান। সেগুলো যত্ন নিয়ে বানান; কেউ পড়ে না এমন পুরোনো পেজ একসাথে করা বা বাদ দেওয়া যায়।
- প্ল্যাটফর্ম: WordPress-এ হালকা, আধুনিক থিম নিয়ে থাকা অনেক সময়ই ঠিক আছে। থিম দিয়ে পরিষ্কারভাবে হয় না এমন ফিচার লাগলে কাস্টম বানানো যুক্তিসঙ্গত।
- পেজের ঠিকানা: যতটা সম্ভব আগের ইউআরএল রাখুন, না হলে ঠিকমতো রিডাইরেক্ট দিন, যাতে গুগলে এখনকার অবস্থান না হারান। বিস্তারিত আছে এসইও না হারিয়ে ওয়েবসাইট সরানো পেজে।
সাধারণ ভুল
- শুধু ডিজাইনারের দামি ফোন আর অফিসের দ্রুত ওয়াই-ফাইতে পরীক্ষা করা।
- পেজ পরিষ্কার দেখাতে মোবাইলে জরুরি তথ্য লুকিয়ে ফেলা।
- পুরো স্ক্রিন ঢেকে দেওয়া পপ-আপ, যা আঙুল দিয়ে বন্ধ করা কঠিন।
- ভারী ভিডিও ব্যাকগ্রাউন্ড আর স্লাইডার, যা গ্রাহকের মোবাইল ডেটা খেয়ে ফেলে।
- চেহারা বদলানো, কিন্তু ধীর হোস্টিং আর বড় ছবি আগের মতোই রেখে দেওয়া।
আপনার কাজ আর ডেভেলপারের কাজ
ওপরের পরীক্ষা, আসল ছবি জোগাড়, পণ্য বা সার্ভিসের লেখা হালনাগাদ আর মূল কাজ ঠিক করা আপনি নিজেই পারেন। রেসপন্সিভ লেআউট, থিম বা কোড, স্পিড, রিডাইরেক্ট আর নানা ডিভাইসে পরীক্ষা ওয়েবসাইট ডেভেলপমেন্টের কাজ। আমি সাধারণত শুরু করি আপনার নিজের ফোনে বানানো সমস্যার তালিকা থেকে, কারণ সেটাই দেখায় আসল গ্রাহক কোথায় আটকে যান।
সবচেয়ে ছোট প্রথম পদক্ষেপ
নিজের সাইটে অর্ডার দিতে বা ইনকোয়ারি পাঠাতে চেষ্টা করার সময় ফোনের স্ক্রিন রেকর্ড করুন। একবার দেখে প্রতিটি আটকে যাওয়ার মুহূর্ত লিখে ফেলুন। ছোট এই ভিডিও অনেক রিপোর্টের চেয়ে বেশি কথা বলে। এটাকে রিডিজাইন পরিকল্পনায় রূপ দিতে সাহায্য চাইলে যোগাযোগ করুন।