আমাদের মধ্যে অনেকেরই ভালো ওয়েব ডিজাইনার হওয়ার ইচ্ছে আছে।অনেকেই চায় নিজের একটি সুন্দর ওয়েবসাইট বানাতে,আবার অনেকেই ফ্রিল্যন্সিং এ ওয়েবসাইট তৈরিতে সুনাম ও খ্যাতি অর্জন করতে চায় । কিন্তু সাইট যদি সুন্দর বা ক্লায়েন্টের মনমতো না হয় তাহলে তা কখনই সম্ভব নয়। তাদের জন্য আমার এই পোষ্ট ,ভালো ওয়েব সাইট ডিজাইন করার জন্য অতীব প্রয়োজনীয় কিছু টিপস,

প্রাথমিক প্রস্তুতিঃ

নিম্নোক্ত ধাপগুলোকে প্রাথমিক প্রস্তুতির অংশ হিসেবে গন্য করা যায় যা ওয়েবসাইট ডিজাইনিং এ খুবই গুরুত্বপূর্ণ।

১) প্রথমত,ওয়েবসাইট ডিজাইন শুরুর পূর্বে আপনাকে মানসিকভাবে প্রস্তুত থাকতে হবে।এর ফলে আপনার কাজ অনেকখানি সহজ হয়ে যাবে।

২) আপনাকে কর্মোদ্যমী হতে হবে আপনি যতই আরামপ্রিয় হোন না কেন।

৩) এখন ভাবুন,আপনি যে ওয়েব সাইট ডিজাইন করতে যাচ্ছেন তা মূলত কোন ধরনের হবে অর্থাৎ তার মূল কাজ কি হবে।সাইটটা কি কোনো প্রতিষ্ঠানের অফিশিয়াল সাইট হবে নাকি কোনো মার্কেটিং সাইট হবে নাকি তথ্যবহুল সাইট হবে,এটা আপনাকে ভাবতে হবে।

৪) আপনার সাইটে কোন ধরনের এবং কোন বয়সের ভিজিটর বেশী আসার সম্ভাবনা আছে,তা নিয়ে চিন্তা করুন।

৫) এখন মনে মনে আপনার সাইটের একটি চেহারা তৈরী করুন।এখানে কোন ধরনের এড দেয়া হবে তা ভাবুন।এরপর এতে মেনুবার,আর্টিকেল,এড ইত্যাদি যথাস্থানে স্থাপন করুন(মনে মনে)।

৬) হোমপেজ যেকোনো সাইটেরই খুব গুরুত্বপূর্ণ বিষয়।তাই সাইট ডিজাইনিং এর আগে আপনাকে হোম পেজটির উদ্দেশ্য জানতে হবে।সাধারণত যে কোনো সাইটের হোমপেজ এমন হয় যে ভিজিটর সাইটে ভিজিট করার সাথে সাথে সাইটটির মূল তথ্য বা উদ্দেশ্য সম্পর্কে অবহিত হয়।

৭) সময় সম্পর্কে সচেতন হতে হবে।যদি নিজের জন্য সাইটটি ডিজাইন করেন তবে সময় হয়ত তেমন বড় ব্যাপার না,তবে যদি ক্লায়েন্টের জন্য ডিজাইনিং করেন তবে তা খুব জরুরী।এক্ষেত্রে সময় কম থাকলে আপনি শর্টকাট apply করুন।বাহারী রংসাজসজ্জা থেকে বিরত থেকে সাইটের যে অংশটি বেশী দরকার তাতে সময় বেশী দিন।

এখন শুরু হবে ওয়েবসাইট ডিজাইন করা

লোগো ডিজাইনঃ

প্রতিটা ওয়েবসাইটেরই একটি লোগো থাকে,তাই লোগো ডিজাইন দিয়েই ওয়েবসাইট ডিজাইন শুরু করুন।কাজটি ছোট হলেও এর গুরুত্ব অপরিসীম,কারন সামান্য লোগো দিয়েই আপনি ওয়েবসাইটের অনেক তথ্য ভিজিটরদের সামনে উপস্থাপন করতে পারেন।

লোগো ডিজাইনিং এ এডোবি ফটোশপ বা এডোবি ইলাস্ট্রেটর যে কোনোটি ব্যবহার করা যায়।

১)  অহেতুক লোগোকে জটিল করবেন না।যত সহজসরল লোগো তৈরি করা যায় ততই ভালো।একটি বিষয় খেয়াল করলে দেখবেন,যত প্রতিষ্ঠিত ওয়েব সাইট আছে তাদের লোগো তত সাধারণ।একটি লোগো যত সাধারণ হয় তা ভিজিটরদের জন্য মনে রাখা তত সহজ হয়।জটিল লোগো মনে রাখা তাদের জন্য কষ্টসাধ্য।

২)  লোগো ডিজাইনিং এ সৃজনশীলতার পরিচয় দিন।সৃজনশীল লোগো অন্য সাইটের লোগোর চেয়ে ব্যতিক্রমী হয়,আর ব্যতিক্রমী লোগো মানুষের মনে থাকাটাই স্বাভাবিক।

৩) গতানুগতিক ডিজাইন পরিহার করুন।

৪)  লোগোকে দৃষ্টিনন্দন করুন।এর জন্য আপনাকে যে চোখে লাগার মত রঙ ব্যবহার করতে হবে তা কিন্তু নয়।

৫)  লোগোটি এমন হতে হবে যেন লোগোটি সাদা কালো রঙের হলেও খুব সহজেই তা চোখে পড়ে।মাঝে মাঝে লোগোটি সাদা কালো রঙ্গে উপস্থাপনের দরকার হতে পারে।

৬)  লোগোটি এমন হতে হবে যেনো তা খুব ছোট সাইজ করা হলেও ভিজিটরদের তা দেখতে সমস্যা না হয়। মাঝে মাঝে আপনার লোগোটি ছোট জায়গায় উপস্থাপন করার দরকার হতে পারে।

ওয়েবসাইটের অন্যান্য অংশ ডিজাইনঃ

লোগো ডিজাইন করার পর ওয়েব সাইটের অন্যান্য লেআউটগুলো তৈরির পালা।

১)  যে সাইটটি আপনি ফটশপে ডিজাইন করছেন তার প্রস্থ ৯৬০ পিক্সেলের বেশী করা উচিত নয়।যদিও বেশীর ভাগ ভিজিটরের মনিটরের রেজ্যুলুশনের প্রস্থ ১০২৪ পিক্সেল।কিন্তু আপনাকে মনে রাখতে হবে পেজটি বড় হলে পেজের পাশে একটি লম্বালম্বি স্ক্রলবার থাকে যা নিজেই প্রস্থ বরাবর কিছু পিক্সেল জায়গা নেয়।এখন আপনার পেজের প্রস্থও যদি ১০২৪ পিক্সেল হয় তবে একটি অনুভূমিক স্ক্রলবার তৈরি হবে যা বিরক্তিকর।

২)  এখন তৈরি করা লোগোটি ফটোশপ ডকুমেন্টে(ফটোশপের যে ডকুমেন্টে আপনি সাইটটি ডিজাইন করছেন) ইম্পোর্ট করুন এবং পেজটির যথাস্থানে স্থাপন করুন।

৩) মধ্যম সারিবিন্যাস বা Centre Aligne বিশিষ্ট ওয়েবসাইট তৈরি করা সবচেয়ে ভালো। বাম সারিবিন্যাস বা Left align বিশিষ্ট ওয়েবসাইট তুলনামূলকভাবে কম প্রচলিত। কারণ,আপনার ওয়েব সাইট যদি ডান বা বাম সারিবিশিষ্ট হয় এবং ভিজিটরের মনিটরের রেজ্যুলুশন বেশী হয় তাহলে, ব্রাউজারে বামে বা ডানে অনেক জায়গা ফাকা থাকবে যা দৃষ্টিকটু হবে,তাছাড়া এতে পেজের কোনো আংশিক তথ্য ভিজিটরের চোখে নাও পড়তে পারে।

৪) এবার আপনার সাইটের Header অংশটি তৈরি করুন।Header এ সাধারণত লোগো,প্রাইমারী নেভিগেশন বার এবং লগইন ফর্ম থাকে।

এটি একটি নেভিগেশন বার।

৫) এবার কন্টেন্ট অর্থাৎ আপনার সাইটের সারগর্ভ যেখানে থাকবে তা ডিজাইন করার পালা।এ জায়গাটি শুরু হয় মূলত ব্যানার বা লোগোর নিচ থেকে।ভিজিটর সাইটের পেজটি পড়বে উপর থেকে নিচের দিকে ,বাম থেকে ডানে। সুতরাং লোগোর নিচে বামদিকটাই মহামূল্যবান।এখান থেকেই আপনার লেখা শুরু হবে।এখানে অহেতুক কাব্যিক বা সাহিত্যক কথার অলংকার না ঝরিয়ে সহজ ভাষায় বর্ণনা করুন আপনার সাইটের মূল বক্তব্য অর্থাৎ সাইটের উদ্দেশ্য।বুঝানোর জন্য যতটুকু বর্ণনা করতে হয় করুন তবে অহেতুক দীর্ঘায়িত করবেন না।বর্ণনা এক,দুই বা তিন কলামে করতে পারেন।তবে একটি কলাম শেষ করে আরেক কলামে যাওয়ার জন্য স্ক্রল ঘুরিয়ে আবার পেজের উপর অংশে আসার মত কষ্ট ভিজিটরদের না দেয়াই ভালো আর এর জন্য কলাম ব্যবহার না করাই উত্তম।

৬) এরপর Footer অর্থাৎ পেজের নিচের অংশ ডিজাইন করার পালা।এখানে আপনি নেভিগেশন,কপিরাইটের যাবতীয় তথ্য বা Terms snd services উল্লেখ করতে পারেন।

এটি টেকটিউনস এর পেজ footer.
৭) ফটোশপে প্রয়োজনীয় এডিটিং শেষে ইমেজ স্লাইস করুন  স্লাইস  টূল দিয়ে।তবে উল্লেখ্য,স্লাইস করা ইমেজের সংখ্যা অহেতুক বেশী না হওয়াই ভালো।আর যেকোনো স্লাইস করার পরে ফোটোগ্রাফ  jpeg  ফরম্যাটে এবং অন্যান্য ইমেজ GIF বা PNG ফরম্যাটে সেভ করুন।

স্লাইস টুল

ফটোশপে স্লাইস করার পরে নেভিগেশনবার

পরবর্তী পর্বে আরো নতুন ও প্রয়োজনীয় ওয়েব ডিজাইনিং  টিপস নিয়ে হাজির হবো,ততক্ষণ পর্যন্ত বিদায়,ভালো থাকবেন সবাই।

কিছু কথাঃ

আমাদের দেশে প্রায় সবাই কম পরিশ্রমে(অথবা বিনা পরিশ্রমে) আয় করতে চাই।এদের মধ্যে অনেকেই আছি যারা আউটসোর্সিং ইনকামের প্রতি আগ্রহী,মনে করি এ পথেই হয়ত অনেক টাকা আয় করা যায় অনেক কম কষ্টে।আর এ কারনেই আমরা ভর্তি হই ব্যাঙ্গের ছাতার মত গজিয়ে ওঠা “বিনা শ্রমে অনলাইনে ইনকাম করুন”  বিজ্ঞাপনধারী প্রতিষ্ঠানে।কিন্তু আমি আমার লেখা শুরুর আগে সবার জ্ঞাতার্থে জানাতে চাই কোনো কাজেই কষ্ট ছাড়া সফল হওয়া যায় না।সুতরাং কোন কাজে টাকা বেশী তা চিন্তা না করে কাজ করাই উত্তম,যা শিখবেন,ভালোভাবে শিখবেন,উন্নতি হবেই । ধন্যবাদ।

বিঃদ্রঃ ওয়েবসাইট ডিজাইনিং এ ফটোশপের প্রয়োজনীয়তা অপরিসীম।তাই ফটোশপে ভাল জ্ঞান থাকা প্রয়োজন।বিভিন্ন টিউটোরিয়াল সাইটে ফটোশপের অনেক টিউটোরিয়াল আছে।ফটোশপে শুধু ব্যানার ,বাটন বা লোগো ডিজাইন করা শিখলেই যে ফটোশপে ওয়েবডিজাইন করা শেখা যাবে তা নয়। সবকিছু বানানোই শিখতে হবে।ধরুন,আপনি ফটোশপে মোমবাতি বানানোর টিউটোরিয়াল পেলেন।আপনি ভাবছেন,ওয়েব সাইট তৈরি করতে তো মোমবাতি বাতি বানাতে হয় না।ব্যাপারটা তা নয়।বরং মোম বানানর মাধ্যমে আপনি ফটোশপের বিভিন্ন কৌশল apply করা শিখবেন।তাছাড়া ওয়েবসাইট তৈরিতেও মোম বানানোর দরকার হতে পারে।ধরুন, Candlelight hotel and resturent ওয়েবসাইটের জন্য লোগো দরকার।লোগোটি এমন হবে যেনো একটি জলন্ত মোমের পাশে candlelight.com লেখা।এ লোগো তৈরির জন্য তো মোম বানাতে জানতে হবে।সুতরাং ,ফটোশপেও সবকিছু সম্পর্কেই ধারণা থাকতে হবে।সবাইকে ধন্যবাদ।