ওয়েব ডিজাইন কি? কিভাবে ও কোথায় শিখবো (বিস্তারিত)

ওয়েব ডিজাইন কি?

আমরা প্রতিনিয়তই অসংখ্য ওয়েবসাইট ব্রাউজ করছি। এক একটা ওয়েব সাইট এক এক ধরনের। ওয়েবসাইট এর আকার, আকৃতি ও লেখা সবগুলিই আলাদা আলাদা হয়। সহজভাবে বলতে গেলে ফটোশপ, HTML ও CSS এর সাহায্যে কিছু সংখ্যক লেখা ও ছবি কে পূর্নাঙ্গ ওয়েবসাইটে রুপ দেওয়াকেই ওয়েব ডিজাইনিং বলা হয়।

প্রত্যেকটা ওয়েবসাইট ই এইচ.টি.এম.এল ও সিএসএস এর সাহায্যে গঠিত হয়। অতএব, আপনি HTML ও CSS জানলে একটা স্টাটিক ওয়েবসাইট বানাতে পারবেন। তাহলে HTML, CSS আসলে কি? এই দুইটা হলো ওয়েব প্রোগ্রামিং ল্যাংগুয়েজ বা ওয়েবসাইট তৈরি করার ভাষা যা দ্বারা আপনি ওয়েব ডিজাইনিং করতে পারবেন। আর ফটোশপ হলো একটা ছবি ইডিট করার সফটওয়ার যা দ্বারা আপনি আপনার ওয়েবসাইট টি আগে থেকেই ডিজাইন করে দেখতে পারবেন। পরে HTML and CSS এর সাহায্যে সে ডিজাইনকে ওয়েবসাইটে রুপান্তর করতে পারবেন।

ওয়েব ডিজাইন কেনো শিখবো?

আপনি যদি মনে করেন আপনি অনলাইন এ ক্যারিয়ার গড়বেন তাহলে আপনাকে অবশ্যই HTML and CSS সম্পর্কে ধারনা রাখতে হবে। আপনি যে ক্ষেত্রেই কাজ করেন না কেনো, আপনার কোন না কোন ভাবে HTML and CSS কাজে লাগবেই। আর যদি আপনি ওয়েব ডেভেলাপমেন্ট এ ক্যারিয়ার গড়তে চান তাহলে তো আপনাকে অবশ্যই শিখতে হবে। ওয়েব ডিজাইনিং হলো ওয়েব ডেভেলাপমেন্ট শিখার প্রথম ধাপ।

কাদের জন্য উপযুক্ত

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

ওয়েব ডিজাইনের চাহিদা

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

ওয়েব ডিজাইনের ভবিষ্যৎ

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

ওয়েব ডিজাইন শিখতে কি কি লাগে

তেমন কোন শিক্ষাগত যোগ্যতাই লাগবে না। আপনার ইচ্ছাশক্তিটাই যথেষ্ট। যে কেউ চাইলে ওয়েব ডিজাইন শিখতে পারে।

ওয়েব ডিজাইন শিখতে কতদিন লাগে

আর ওয়েব ডিজাইন শিখতে গেলে একদম নতুন হিসাবে ৩ মাস লাগতে পারে। তবে কিছুটা বেশি সময় দিলে ২ মাসেই HTML and CSS ভালোভাবে আয়ত্ব করা সম্ভব। তবে মনে রাখবেন, ওয়েব ডিজাইনিং এর সাথে ওয়েব ডেভেলাপমেন্টের নিবিড় সম্পর্ক রয়েছে। ওয়েব ডিজাইনিং শিখতে কম সময় লাগলেও ওয়েব ডেভেলাপমেন্ট শিখতে ২ বছর পর্যন্ত লেগে যেতে পারে।

ফ্রি ওয়েব ডিজাইন কোর্স (ভিডিও)

আপনাকে অবশ্যই সর্বপ্রথম এইচ.টি.এম.এল শিখতে হবে। তার পর সে এস এস শিখতে হবে। HTML and CSS শিখার সবচেয়ে ভালো উপায় হলো টিউটোরিয়াল দেখে তা সাথে সাথে প্রাকটিস করা। নিচের প্লেলিষ্ট থেকে আপনি HTML and CSS শিখতে পারেন।

1. Basic HTML Course by Rasel Ahmed:
বাংলাদেশের জনপ্রিয় ওয়েব ডেভেলাপার
ও প্রতিষ্ঠাতা, আর আর ফাউন্ডেশন
লিংকঃ https://www.youtube.com/playlist?list=PLhPBqF–77IkXtAflmBIBE4ewHr-TbEb8

Another Course By Rasel Ahmed:
https://www.youtube.com/playlist?list=PLG9FGQQWJ7aLPYr-zO1Am9cMQwGw7A04y

2. Basic Web Design Course by MD Nurullah:
ফ্রিলান্সার
ও প্রতিষ্ঠাতা, ফ্রিলান্সিং কেয়ার।
লিংকঃ https://www.youtube.com/playlist?list=PLbsixBK6B5e66wkXMdQNRavvZS_kawZoU

এইখান থেকে বেসিক HTML, CSS শিখার পর আপনাকে শিখতে হবে কিভাবে PSD to HTML করতে হয়। PSD হলো ফটোশপের একটা ফাইল যা দেখে দেখে আপনাকে হুবহু একটা ওয়েবসােইট বানোতে হবে। তাহলে চলুন জেনে নেই কিভাবে PSD to HTML শিখতে পারবেন।

1. PSD to HTML Course:
Course by রাসেল আহমেদ,
লিংকঃ
JPEG to HTML:
https://www.youtube.com/playlist?list=PLhPBqF–77Il85wzB3PzZU2QjF7nvk-aH

PSD to HTML – Full project (Resturant PSD):
https://www.youtube.com/playlist?list=PLG9FGQQWJ7aKi_kZmVroZo27HaSB8Oxya

PSD to HTML – Momento Tutorial:
https://www.youtube.com/playlist?list=PLG9FGQQWJ7aJgKinD0uTAesz4wP1E0pSL

PSD to HTML Secret Tips:
https://www.youtube.com/playlist?list=PLG9FGQQWJ7aJ0SdgmSMplqxbyFWABiSo9

2. PSD to HTML Course by MD Nurullah:
লিংকঃ
Web Design Advance Course:
https://www.youtube.com/playlist?list=PLbsixBK6B5e4j7uxzJ9kpJ2p_082USrfq

আপনি যদি ফটোশপে নতুন হয়ে থাকেন, তাহলে এইখান থেকে ফটোশপের বেসিক জিনিসপত্রগুলি শিখে নিতে পারেন।

1. Basic Adobe Photoshop Tutorial by RR Foundation
https://www.youtube.com/playlist?list=PLG9FGQQWJ7aIx9aLES6vN-rCaVZfCCydM

2. Adobe Photoshop Basic Tutorial by Rasel Ahmed
https://www.youtube.com/playlist?list=PLhPBqF–77ImNQjOHXFRjLMKeF_xzAziz

এইগুলি শিখার পর আপনাকে টুইটার বুটষ্ট্রাপ শিখতে হবে। যা আপনার কাজ করার গতিকে অনেক বাড়িয়ে দিবে। এখান থেকে টুইটার বুটষ্টাপ শিখতে পারবেন।

1. Bootstrap 3 Framework Tutorial By MD Nurullah
https://www.youtube.com/watch?v=d-M4XEBmwtw

==> Create a Responsive Website Using Bootstrap 3
https://www.youtube.com/playlist?list=PLbsixBK6B5e7YXAtcJQDiXwZVoY9ROQIR

2. Twitter BootStrap Tutorial by Rasel Ahmed
https://www.youtube.com/playlist?list=PLhPBqF–77Il6B1-dzCZsSjrPaA7uf0CJ

এইগুলি শিখার পর আপনাকে কিছু এডভান্স জিনিস শিখতে পারেন এই প্লেলিষ্ট থেকে:
Some advance Tips by MD Nurullah
https://www.youtube.com/playlist?list=FL-rLNnxfLy48GaiwPfIisOQ

ওয়েব ডিজাইন ওয়েবসাইটমূহ

————————————————————————————-
=> http://www.w3schools.com
এইটাকে ওয়েব ডিজাইনিং শিখার বাইবেল বলা হয়ে তাকে। কারন এই ওয়েবসাইট থেকে আপনি HTML and CSS এর সবকিছু জেনে নিতে পারবেন।

= http://getfirebug.com/
আপনি যদি মজিলা ফায়ারফক্স ব্রাউজার ব্যবহার করেন তাহলে Inspect Element করার জন্য এই এডঅন্স টি ব্যবহার করতে হবে।

=> http://getbootstrap.com
এটা হলো একটা ফ্রেমওয়ার্ক। অত্যন্ত দারুন একটা ফ্রেমওয়ার্ক। যা আপনার ওয়েব ডিজাইন করার অভিজ্ঞতাই পরিবর্তন করে দিবে। অবশ্যই আপনাকে এটি শিখতে হবে।

=> http://fontawesome.io/
যে কোন আইকনকে ফন্ট হিসাবে ব্যবহার করার ক্ষেত্রে এই ওয়েবসাইটের জুড়ি নেই। একবার ভিজিট করেই দেখুন না।

=>http://www.google.com/fonts/
এই ওয়েবসাইট থেকে আপনি আপনার ওয়েবসাইটের জন্য গুগল ফন্ট ডাউনলোড করতে পারবেন।
=> http://www.dafont.com/
ফন্ড ডাউনলোড করার জন্য আরেকটি দারুন ওয়েবসাইট।

https://www.iconfinder.com/
http://www.iconarchive.com/
আইকন খুজে পাওয়ার জন্য এই ওয়েবসাইটগুলি বেশ উপকারী। যে কোন আইকন খুজে ব্যবহার করতে পারবেন। এক কথায় দারুন।

=> https://www.sublimetext.com/
এটা হলো সবচেয়ে ভালো কোড ইডিটর।

=> http://codepen.io/
অত্যান্ত দারুন একটি ওয়েবসাইট। যাতে আপনি অনেক অনেক বানানো কোড পেয়ে যাবেন। সম্পুর্ন ফ্রি তে।

=> https://css-tricks.com
যখন কোড করা শিখে যাবেন তার পর এইখান থেকে অনেক রেডিমেট কোড পেয়ে যাবেন। খুব মজার ওয়েবসাইট

=> http://www.os-templates.com/free-psd-templates
=> https://www.template.net/design-templates/psd/free-psd-website-templates/
এই দুইটা ওয়েবসাইট থেকে ফ্রি PSD ফাইল ডাউনলোড করে নিতে পারবেন প্রাকটিস করার জন্য।

=> https://ctrlq.org/beautifier/
কোড লিখার পর তা ভালোমতো সাজানোর জন্য এই ওয়েবসাইট টি ব্যবহার করতে পারেন। দারুন একটি ওয়েবসাইট

=> https://validator.w3.org/
আপনার লেখা কোড ভেলিড কিনা এসব চেক করতে পারবেন এই ওয়েবসাইট থেকে।

ওয়েব ডিজাইনের কাজ কোথায় পাওয়া যায়?

আমি আগেই বলেছি যে, শুধু HTML and CSS শিখে খুব একটা কাজ পাওয়া যাবে না। কারন বর্তমানে সবাই ডায়নামিক ওয়েবসাইট তৈরি করতে চায়। তাই আপনাকে ডায়নামিক করা শিখতে হবে। তা না হলে আপনি নিখুত কোডিং করতে পারবেন না। কারন HTML and CSS কোড করার সময় ডায়নামিকের কথা মাথায় রেখে কোড করতে হয়। তা না হলে ডায়নামিক করার সময় বেশ ঝামেলা পোহাতে হয়। আশাকরি ব্যাপারটি বুঝতে পেরেছেন। তারপরেও আপনি কোথায় কোথায় কাজ খুজতে পারেন জেনে নিন।
http://upwork.com
http://freelancer.com
http://themeforest.net

ওয়েব ডিজাইনের কাজ কিভাবে পেতে হয়

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

ওয়েব ডিজাইন বিষয়ক ওয়েবসাইট

=> https://shapebootstrap.net/
এইটা হলো Bootstrap দিয়ে গঠিত টেমপ্লেটের দারুন একটা ওয়েবসাইট। আপনি অনেক ধারনা পেতে পারেন এই ওয়েব সাইট থেকে। মজার ব্যাপার হলো এই ওয়েব সাইটের মালিক বাংলাদেশী। তবে বিশ্বের সেরা ওয়েবসাইটের মধ্যে অন্যতম এই ওয়েবসাইট টি।

=> https://themeforest.net/category/site-templates
একদম প্রফেশনাল মানের ওয়েবসাইট টেমপ্লেট পাবেন এই সাইটটি তে।

=> https://webdesign.tutsplus.com/
=> http://www.hongkiat.com/blog/category/design/
যখন আপনি এডভান্স হবেন তখন এই ওয়েব সাইটগুলি কিন্তু নিয়মিত ফলো করতে হবে। নিত্যনতুন খবরাখবর রাখার জন্য।

(এই পোষ্টটি প্রতিনিয়তই আপডেট করা হবে)