- হোম
- পোর্টফোলিও
সর্বশেষ হালনাগাদ
আসল ক্লায়েন্ট ওয়েবসাইট, বিবরণসহ
ওয়েব ডিজাইন পোর্টফোলিও — আসল ক্লায়েন্ট ওয়েবসাইট
একটা ওয়েব ডিজাইন পোর্টফোলিও এমন হওয়া উচিত, যাতে কাজটা যাচাই করা যায়, শুধু মুগ্ধ হয়ে দেখা নয়। এখানকার প্রতিটা প্রজেক্ট একটা লাইভ সাইট: ক্লায়েন্ট কী করেন, সাইটের কী কাজ করার ছিল, কী বানানো হয়েছে, আর একটা লিংক — যাতে ফোনে খুলে নিজেই বিচার করতে পারেন।
- লাইভ সাইট, মকআপ নয়
- বানানো কোনো সংখ্যা নেই
- WordPress আর WooCommerce বিল্ড
- বাংলাদেশ আর কানাডা

কীভাবে পড়বেন
এই ওয়েব ডিজাইন পোর্টফোলিও কীভাবে পড়বেন
এখানকার প্রতিটা প্রজেক্ট ক্লায়েন্টের ব্যবসা, সাইটের কী কাজ করার ছিল আর তার পরের সিদ্ধান্তগুলো ব্যাখ্যা করে — শুধু একটা স্ক্রিনশট নয় — যাতে আপনি বিচার করতে পারেন একই ভাবনা আপনার প্রজেক্টে খাটে কি না।
যে সাইটই খুলুন, দুটো জিনিস চেক করবেন। প্রথমত, মোবাইল রেসপন্সিভ ওয়েব ডিজাইন: ল্যাপটপে নয়, ফোনে খুলুন, কারণ বেশিরভাগ কাস্টমার সেখানেই দেখবেন। দ্বিতীয়ত, কল টু অ্যাকশন: ফোন নম্বরে কল যায় কি, WhatsApp বাটনে চ্যাট খোলে কি, কোটের ফর্ম কাজ করে কি? যে ওয়েব পেজ ডিজাইন দেখতে সুন্দর কিন্তু এই পরীক্ষায় ফেল করে, সেটা শুধু সাজসজ্জা — আর কোনো পোর্টফোলিওর সেটা লুকানো উচিত নয়।
এখানকার সব কিছু বানিয়েছেন WebDesignerBD-এর Selimuzzaman Afridi, বেশিরভাগ WordPress আর WooCommerce-এ, বাংলাদেশ আর বিদেশের ক্লায়েন্টদের জন্য। এই পোর্টফোলিওতে কিছুই বানানো নয়: যে রেজাল্ট যাচাই করা নেই, তার দাবি করা হয় না, আর ক্লায়েন্ট নিশ্চিত করার পরই কোনো প্রজেক্ট এখানে আসে।
এক নজরে
- পুরো বিবরণনিশ্চিত করা 2টি প্রজেক্ট
- প্ল্যাটফর্মWordPress, WooCommerce, Elementor
- দেশবাংলাদেশ, কানাডা
- প্রতিটা প্রজেক্টেমোবাইল-ফার্স্ট, সার্চ-রেডি, সত্যিকারের CTA
- কে বানিয়েছেনSelimuzzaman Afridi
ফিচার করা প্রজেক্ট
ফিচার করা প্রজেক্ট, পুরো বিবরণসহ
দুটো লাইভ বিল্ড — ক্লায়েন্ট, ব্রিফ আর বিল্ডের বিবরণসহ। প্রতিটা ফোনে খুলে দেখুন — যেকোনো পোর্টফোলিও বিচারের সৎ উপায় এটাই।
সার্ভিস ব্যবসা · অন্টারিও ও কুইবেক, কানাডা · দুই ভাষা (ইংরেজি/ফরাসি)
BlueGuard Duct Cleaning — blueguard.ca
ক্লায়েন্ট
Blue Guard একটা এয়ার ডাক্ট আর ড্রায়ার ভেন্ট ক্লিনিং কোম্পানি, যারা অন্টারিও আর কুইবেক জুড়ে বাড়ির মালিকদের সার্ভিস দেয়। এদের কাস্টমাররা খোঁজেন শহরের নাম দিয়ে, ইংরেজি বা ফরাসিতে, আর কয়েক মিনিটেই — সাধারণত ফোনে — ঠিক করে ফেলেন কোট চাইবেন কি না।
সাইটের যা করার ছিল
নিজের শহরে, নিজের ভাষায় ডাক্ট ক্লিনিং খোঁজা মানুষের কাছ থেকে কোটের অনুরোধ আনা, আর এমনভাবে বিশ্বাসযোগ্য দেখানো যাতে কেউ ঘরের ভেতরে ডাকতে ভরসা পান। মানে দুই ভাষার কনটেন্ট, প্রতিটা সার্ভিস এরিয়ার জন্য আলাদা পেজ, চোখে পড়ার মতো সার্টিফিকেশন আর রিভিউ, আর এমন একটা কোটের পথ, যা একটাও অকেজো বাটন ছাড়া ফোনে কাজ করে।
যা বানানো হয়েছে
- দুই ভাষায় হুবহু একই পেজ কাঠামোসহ ইংরেজি আর ফরাসি সাইট
- এয়ার ডাক্ট, ড্রায়ার ভেন্ট আর সম্পর্কিত ক্লিনিং সার্ভিসের পেজ
- প্রতিটা শহরের জন্য সার্ভিস এরিয়ার ল্যান্ডিং পেজ (গাতিনোসহ), লোকাল সার্চের জন্য লেখা
- প্রতিটা পেজে স্ক্রল ছাড়াই দেখা যায় এমন কোট আর বুকিংয়ের বাটন, ক্লিক করলেই কল
- NADCA সার্টিফিকেশন আর Google রিভিউ ব্যাজ, প্রথমবার আসা ভিজিটর যেখানে তাকান সেখানে
- মোবাইল-ফার্স্ট লেআউট, দ্রুত পেজ, schema, আর লঞ্চের দিন থেকেই Search Console
যা দিয়ে বানানো: WordPress · Elementor · দুই ভাষার সেটআপ · যশোর থেকে রিমোটে বানানো আর সাপোর্ট দেওয়া
ই-কমার্স · বাংলাদেশ · WooCommerce
Gonjo — gonjo.com.bd
ক্লায়েন্ট
Gonjo একটা বাংলাদেশি মেনসওয়্যার ব্র্যান্ড, যারা অনলাইনে প্রিমিয়াম পাঞ্জাবি কালেকশন বিক্রি করে, আর ঈদের সময় যাদের চাহিদা হঠাৎ অনেক বেড়ে যায়। এদের ক্রেতারা ফোনে ঘুরে দেখেন, কালেকশন তুলনা করেন, আর কয়েক ট্যাপে অর্ডার করতে চান — কিংবা বাংলায় মেসেজ করে।
সাইটের যা করার ছিল
মোবাইল ডেটায় থাকা ক্রেতাদের কাছে সারা বাংলাদেশে পাঞ্জাবি বিক্রি করা: কালেকশন সহজে ঘুরে দেখার ব্যবস্থা, সাইজ আর কাপড় নিয়ে সব প্রশ্নের উত্তর দেওয়া প্রোডাক্ট পেজ, ঝামেলা ছাড়া অর্ডার নেওয়া, আর যাঁরা চ্যাট করতে পছন্দ করেন তাঁদের জন্য বাংলায় একটা WhatsApp অর্ডার লাইন, যা একই অর্ডার ফ্লোতে যায়।
যা বানানো হয়েছে
- কাস্টমাররা যেভাবে কেনাকাটা করেন, সেভাবে সাজানো কালেকশন আর ক্যাটাগরি নেভিগেশনসহ WooCommerce স্টোর
- প্রোডাক্ট সার্চ, ভ্যারিয়েশন, উইশলিস্ট, কার্ট, আর এক হাতের বুড়ো আঙুলে চালানোর মতো চেকআউট
- মৌসুমি কালেকশনের ব্যানার (ঈদ কালেকশন), যা মালিক নিজেই ডেভেলপার ছাড়া বদলাতে পারেন
- সাধারণ চেকআউটের পাশাপাশি বাংলায় WhatsApp অর্ডার লাইন
- র্যাংক করার মতো করে সাজানো প্রোডাক্ট আর ক্যাটাগরি পেজ, schema আর পরিষ্কার URL সহ
- মালিকের ট্রেনিং, যাতে প্রোডাক্ট, দাম আর অফার নিজেরাই আপডেট করতে পারেন
যা দিয়ে বানানো: WordPress · WooCommerce · মালিক নিজেই সামলানো ক্যাটালগ
স্ট্যান্ডার্ড
এখানকার প্রতিটা সাইটে যা থাকে
রেসপন্সিভ ওয়েব ডিজাইন হলো ন্যূনতম শর্ত, বিক্রির মূল কথা নয়। বাজেট যা-ই হোক, ওপরের প্রতিটা প্রজেক্টে এই ছয়টা জিনিস আছে।
মোবাইল রেসপন্সিভ ওয়েব ডিজাইন
আগে ফোনের স্ক্রিনে ডিজাইন, তারপর বড় স্ক্রিনে, কারণ বেশিরভাগ বাংলাদেশি ভিজিটর — আর বিদেশের ক্লায়েন্টদের বেশিরভাগ কাস্টমারও — আসেন ফোন থেকে।
সত্যিকারের কল টু অ্যাকশন
ফোন নম্বরে চাপলে কল যায়, WhatsApp বাটনে চাপলে চ্যাট খোলে, ফর্ম পৌঁছায়। কোথাও href="#" নেই — পুরনো সাইটের সবচেয়ে দামি ভুল।
লঞ্চের দিন থেকেই সার্চ-রেডি
সাইট লাইভ হওয়ার আগেই টাইটেল, হেডিং, schema, sitemap, দ্রুত পেজ আর Search Console যুক্ত করা।
মোবাইল ডেটাতেও স্পিড
নির্দিষ্ট সাইজসহ WebP ছবি, অল্প প্লাগইন, ক্যাশিং — অফিসের Wi-Fi-তে নয়, মাঝারি দামের একটা Android-এ 4G দিয়ে চেক করা।
মালিক নিজেই এডিট করতে পারেন
যুক্তিসঙ্গত টেমপ্লেট আর লক করা গ্লোবাল স্টাইলসহ WordPress, বাংলা বা ইংরেজিতে রেকর্ড করা ওয়াকথ্রুসহ হস্তান্তর।
নির্দিষ্ট কোট, সরাসরি ডেভেলপার
প্রতিটা প্রজেক্টের স্কোপ আর দাম আগে লিখিতভাবে ঠিক করা, আর বানিয়েছেন সেই মানুষ, যাঁর সাথে ক্লায়েন্ট কথা বলেছেন।
প্যাটার্ন
ওয়েব পেজ ডিজাইনের যে সিদ্ধান্তগুলো বারবার দেখবেন
প্রজেক্টগুলো পাশাপাশি দেখলে একই সিদ্ধান্ত বারবার চোখে পড়ে, কারণ সেগুলো কাজ করে। প্রতিটা সার্ভিস বা ক্যাটাগরির জন্য একটা পেজ, ঠাসাঠাসি একটা পেজ কখনো নয়।
কল টু অ্যাকশন — কোট, কল, WhatsApp, কেনা — ফোনে স্ক্রল ছাড়াই দেখা যায়, কোনো স্লাইডারের নিচে লুকানো নয়। ব্যবসা, টিম আর প্রোডাক্টের আসল ছবি স্টক ছবির জায়গা নেয়। আর বাংলাদেশে, যেখানে কাস্টমাররা বাংলায় ভাবেন, সেখানে বাংলা বা দুই ভাষার লেআউট।
দ্বিতীয় প্যাটার্ন হলো সংযম। এখানকার প্রতিটা সাইট বানানো হালকা থিম, ছোট প্লাগইন তালিকা আর স্ক্রিনের মাপে বানানো ছবি দিয়ে — ওয়েব পেজ ডিজাইনের সেই চাকচিক্যহীন দিক, যা ঠিক করে মোবাইল ডেটায় সাইট দুই সেকেন্ডে লোড হবে নাকি আট সেকেন্ডে। স্পিড পরে যোগ করা কোনো ফিচার নয়; সাইটগুলো এভাবেই বানানো।
তৃতীয়টা হলো হস্তান্তর। প্রতিটা ক্লায়েন্ট নিজের সাইট নিজেই এডিট করতে পারেন, কারণ যে সাইট মালিক বদলাতে পারেন না, সেটা পুরনো হয়ে যায়। এজন্যই লঞ্চের এক বছর পরেও এই সাইটগুলো একই রকম থাকে: মালিকরা নিজেরাই দাম, ছবি আর অফার আপডেট করেন, এমন সাইটে যা তাঁদের এডিট সামলানোর মতো করে বানানো। আপনারটাও এভাবে বানাতে চাইলে প্রতিটা সার্ভিসের ব্যাখ্যা আছে ওয়েব ডেভেলপমেন্ট পেজে, আর শুরুর দাম আছে প্রাইসিং পেজে।
সাধারণ প্রশ্ন
কাজ নিয়ে ক্রেতারা যা জিজ্ঞেস করেন
পোর্টফোলিও তুলনা করার সময় ক্রেতারা যা জানতে চান।
01এই পোর্টফোলিওতে পুরো বিবরণসহ মাত্র দুটো প্রজেক্ট কেন?
কারণ এখানে শুধু সেই প্রজেক্টগুলোই দেখানো হয়, যেগুলোর ক্লায়েন্ট, স্কোপ আর প্রকাশের অনুমতি নিশ্চিত। প্রতিটা ক্লায়েন্ট নিশ্চিত করলে আরও কাজ যোগ হবে — পোর্টফোলিও তখনই কাজের, যখন এর সব কিছু যাচাই করা যায়।
02প্রতিটা সাইটের মোবাইল ভার্সন কি দেখতে পারব?
যেকোনো লাইভ সাইট আপনার ফোনে খুলুন — মোবাইল রেসপন্সিভ ওয়েব ডিজাইনের সৎ পরীক্ষা এটাই। ডেস্কটপে ব্রাউজারের জানালা ছোট-বড় করে চট করে দেখে নিতে পারেন, কিন্তু বিচার করুন আসল ফোনে।
03প্রতিটা প্রজেক্টের রেজাল্ট বা সংখ্যা কি প্রকাশ করেন?
শুধু যাচাই করা থাকলে। এই পেজ বলে প্রতিটা সাইটের কী কাজ করার ছিল আর কী বানানো হয়েছে; ট্রাফিক, র্যাংকিং বা আয়ের কোনো সংখ্যা বানিয়ে বলে না।
04প্রজেক্টগুলো কোন প্ল্যাটফর্মে বানানো?
বেশিরভাগ WordPress-এ, স্টোরের জন্য WooCommerce আর লেআউটের জন্য Elementor — কীভাবে হালকা করে বানানো হয় তা দেখুন WordPress ডেভেলপমেন্ট পেজে। প্রজেক্টে দরকার হলে কাস্টম কোডও ব্যবহার হয়।
05আমার মতো সাইট কি বানান?
ফিচার করা প্রজেক্ট দুটোর একটা সার্ভিস ব্যবসা, অন্যটা অনলাইন স্টোর। প্রতিটা বিল্ডে কী থাকে, তা দেখুন বিজনেস ওয়েবসাইট আর ই-কমার্স ওয়েবসাইট পেজে।
06রেফারেন্স হিসেবে কোনো ক্লায়েন্টের সাথে কি যোগাযোগ করতে পারব?
ফিচার করা সাইটগুলো লাইভ আর সবার জন্য খোলা, আর সেটাই সবচেয়ে নির্ভরযোগ্য রেফারেন্স: খুলুন, বাটনগুলো চেক করুন, একটা টেস্ট অর্ডার দিন। যেখানে ক্লায়েন্ট যোগাযোগে রাজি হয়েছেন, অনুরোধ করলে আমরা যোগাযোগ করিয়ে দেব।
07একটা প্রজেক্ট এখানে কীভাবে যোগ হয়?
লঞ্চের পর, ক্লায়েন্টের অনুমতি নিয়ে, আর ক্লায়েন্টের ব্যবসা, সাইটের কী কাজ করার ছিল আর কী বানানো হয়েছে — তার বিবরণসহ। স্ক্রিনশটগুলো মালিকের দেওয়া, আর সাইট রিডিজাইন হলে আপডেট করা হয়।
08এখানে রেসপন্সিভ ওয়েব ডিজাইন বলতে আসলে কী বোঝায়?
এমন একটা সাইট, যা প্রতিটা স্ক্রিনে মানিয়ে নেয়: লেআউট নিজে থেকে সাজে, ছবি নির্দিষ্ট মাপসহ ছোট-বড় হয় যাতে কিছু লাফিয়ে না সরে, আঙুলে চাপার মতো বড় বাটন, আর জুম না করেই পড়া যায় এমন লেখা। ওপরের প্রতিটা প্রজেক্ট এভাবেই বানানো।
একটা ওয়েব ডিজাইন পোর্টফোলিও ততটাই সৎ, যতটা সৎ তার সবচেয়ে দুর্বল দাবি, তাই এটা দাবি করে খুব কম: এখনই খুলে দেখার মতো দুটো বিবরণসহ বিল্ড, আর কোনো বানানো সংখ্যা নেই। আপনার প্রজেক্ট সার্ভিস ব্যবসা, স্টোর বা এর মাঝামাঝি কিছু হলে, সাইটের কী করার আছে লিখে মেসেজ করুন আর সোজা উত্তর নিন।


