ওয়েব ডিজাইন ও ডেভোলপমেন্ট শিখতে চান? ঘরে বসে প্রফেশনাল ওয়েব ডিজাইনার/ডেভোলপার হতে চান? (মেগা টিউন)

18 5,457

আসসালামু আলাইকুম, কেমন আছেন সবাই? সবাইকে বিজয় দিবসের রক্তিম শুভেচ্ছা জানিয়ে আমি আমার ১ম টিউন শুরু করছি। এটি আমার ১ম টিউন তাই অনুগ্রহ পূর্ব ভুল ত্রুটি ক্ষমা সুন্দর দৃষ্টিতে দেখার জন্য অনুরোধ করছি এবং আপনাদের সুপরামর্শ কামনা করি।

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

ওয়েব ডিজাইনার/ডেভোলপার হতে হলে কি কি বিষয় শিখতে হবে ?

ওয়েবে গ্রাফিক্সের প্রচুর ব্যবহার হয় তাই গ্রাফিক্সের জন্য

  • Adobe Photoshopও এ্যানিমেশন এর জন্য
  • Adobe Flash

আর ওয়েবসাইট তৈরি করার জন্য

  • HTML
  • CSS
  • JavaScript
  • PHP
  • MySQL

এছাড়াও আরো অনেক কিছু আছে যেমন  WordPress, Joomla ইত্যাদি।

আপনি যদি ওয়েব ডিজাইনার হতে চান তাহলে আপনাকে  Adobe Photoshop,  Adobe Flash (যদি এ্যানিমেশন তৈরি করতে চান), HTML, CSS ও JavaScript শিখতে হবে। আর যদি ডেভোলপার হতে চান তাহলে ঐগুলোর পাশাপাশি PHP ও MySQL শিখতে হবে। যদি কোন প্রকার প্রোগ্রামিং বা কোডিং ছাড়াই ওয়েবসাইট তৈরি করতে চান তাহলে WordPress ও Joomla.

কোনটা কি কাজে ব্যাবহার হয় ?

Adobe Photoshop:

ওয়েব ডিজাইনে ফটোশপ কেন? ইমেজ বা ছবি ছাড়া ওয়েবসাইট নেই বললেই চলে।  ওয়েব সাইটে ইমেজ ব্যবহার করার আগে এডিট করার জন্য দরকার ফটোশপ। এছাড়াও বর্তমানে ওয়েবসাইটের মূল ডিজাইন ও লে-আউট ফটোশপ এ তৈরি করা হয়। যা পিএসডি টেমপ্লেট হিসেবে পরিচিত। ওয়েবসাইটে আকর্ষনীয় গ্রাফিক্স ব্যবহার করার জন্য ফটোশপের ব্যবহার জানা জরুরী।

Adobe Flash:

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

HTML:

এইচটিএমএল হচ্ছে একটি ওয়েবসাইটের মূল ও প্রথম উপাদান। এইচটিএমএল ছাড়া ওয়েবসাইট তৈরি করা সম্ভব নয়। এটি একটি হাইপার টেক্সট মার্কআপ ল্যাংগুয়েজ। অন্যান্য প্রোগ্রামিং ল্যাংগুয়েজের মত এটি কঠিন নয়,  খুবই সহজ। এর সাহায্যে ওয়েবসাইটের মূল গঠন তৈরি করা হয়। Mark Up Language এক সেট Mark Up ট্যাগের সমন্বয়ে গঠিত হয়। একটা ওয়েব পেজের বিভিন্ন অংশ ব্রাউজারের মাধ্যমে কিভাবে প্রদর্শিত হবে, তা HTML এ Mark Up ট্যাগ সমূহ ব্যবহার করে প্রকাশ করা হয় । এটা শিখলেই আপনি একটা ওয়েব পেজ তৈরী করতে পারবেন।

CSS:

CSS এর পূর্ণরুপ হচ্ছে ক্যাসকেডিং স্টাইল শীট( Cascading Style Sheet). এইচটিএমএল দিয়ে তৈরি করা ওয়েবসাইট কে স্টাইল করার জন্য CSS ব্যবহার করা হয়। সহজ ভাষায় ওয়েব পেজের বিভিন্ন উপাদানের গঠন, আকার, আকৃতি, অবস্থান, রং, গতিশীলতা ইত্যাদি নির্ধারণের সহজ কৌশল হচ্ছে CSS । সিএসএস দিয়ে ওয়েবসাইটের লে-আউট ও কন্ট্রোল করা হয়।  যা আগে এইচটিএমএল এর টেবিল এর সাহায্যে করা হত।

JavaScript:

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

PHP:

এটিও একটি প্রোগ্রামিং ল্যাংগুয়েজ। পিএইচপি (PHP:Hypertext Preprocessor ) একটা সার্ভার সাইড ও ক্রস প্লাটফর্ম  স্ক্রিপ্টিং ল্যাংগুয়েজ। পিএইচপি এর বেশিরভাগ syntax গুলো C,Perl,Java থেকে ধার করা।এই ল্যাংগুয়েজটির উদ্দেশ্য হল ওয়েব পেজ দ্রুত তৈরী করা ডাইনামিকালি। PHP ছাড়াও আরো অনেক সার্ভার সাইড টেকনোলজি রয়েছে তবে PHP সবচাইতে বেশি জনপ্রিয় কারন এটি ফ্রী। পিএইচপি রান করাতে হলে আপনার পিসি কে একটি লোকাল সার্ভারে পরিণত করতে হবে কারন পিএইচপি সার্ভার ব্যাতিত ব্রাউজারে রান করতে পারে না। পি এইচপি ওয়েবে তথ্য সংরক্ষণের ক্ষেত্রে সর্বোচ্চ নিরাপত্তা প্রদান করে। পি এইচ পি কে এইচ টি এম এল (HTML) এর সাথেও ব্যবহার করা যায়। ওয়ার্ডপ্রেস জুমলা সহ বেশ কিছু এডভান্সড ওপেনসোর্স কনটেন্ট ম্যানেজমেন্ট সিস্টেম (CMS) পি এইচ পি দ্বারা তৈরি। পি এইচ পি ব্যবহার করে কাস্টম কনটেন্ট ম্যানেজমেন্ট সিস্টেম তৈরি করা যায়। এছাড়া ই-কমার্স, ম্যানেজমেন্ট, অনলাইন ব্যাংকিং সফটওয়্যার ইত্যাদি তৈরিতেও পি এইচ পি ব্যাপকভাবে ব্যবহুত হচ্ছে।

MySQL:

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

কিভাবে শিখবেন ?

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

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

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

এবারে আসি HTML, CSS, JavaScript, PHP, MySQL এর ব্যাপারে

আপনি যদি একে বারে নতুন হন তাহলে বাংলায় শুরু করুন। আমি কিছু বাংলা টিউটোরিয়ালের লিঙ্ক দিলাম নিচে।

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

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

আর কাজ করতে গেলে হয়ত অনেক সময় অনেক সমস্যা হতে পারে সেক্ষেত্রে ফেসবুকে বিভিন্ন গ্রুপ থেক সাহায্য নিতে পারেন যেমন,

  • https://www.facebook.com/groups/HTML.CSSandJavaScript/
  • https://www.facebook.com/groups/Wordpress2Smashing/

অথবা সরাসরি আমার সাথে যোগাযোগ করতে পারেন।

ফেসবুকে আমি

18 মন্তব্য
  1. habibelinks বলেছেন

    সুন্দর পোস্টটির জন্য অনেক ধন্যবাদ আপনাকে…

  2. মোহাম্মদ অভি বলেছেন

    @khorshed Alam ভাই , এই কথা গুলো এডিড করে দেন [ টেকটিউনস এ রেগুলার ভিজিটর হিসেবে আছি অনেক দিন ধরে। কিন্তু কখনো টিউন করা হয়নি। চলুন এখন আসল কথায় যাওয়া যাক……]

    আশা করি বুজতে পেরেছেন ।

  3. নাঈম প্রধান বলেছেন

    নাইস। খুব ভাল পোস্ট। ধন্যবাদ আপনাকে।

  4. জাকির হোসেন বলেছেন

    সুন্দর এই পোস্টের জন্য আপনাকে অভিনন্দন।

  5. sabuj4u বলেছেন

    অসাধারণ লিখছেন । অনেক ভাল লাগল । ধন্যবাদ ।

  6. noyon2889 বলেছেন

    খুবই সুন্দর করে সাজিয়ে লেখার জন্য আপনাকে অনেক অনেক ধন্যবাদ। একটা স্পষ্ট ধারনা পেলাম।

  7. সুজন বলেছেন

    Thanks For your Post.

  8. anam202 বলেছেন

    thanks

  9. Real বলেছেন

    সুন্দর পোস্টটির জন্য অনেক ধন্যবাদ আপনাকে…

  10. Khorshed Alam বলেছেন

    আপনাদের সবাইকে ধন্যবাদ মন্তব্য করার জন্য।

  11. DesiRocker বলেছেন

    1st post e apnake welcome.. Thanks, amar jehetu website ase, tai post ti amar khub kaje lagbe.. 10x..

  12. Linkon বলেছেন

    বস দারুন হইছে লিখে যাও

    তোমার জন্য শুভ কামনা রইল @@

  13. alif বলেছেন

    wow!! thank you bro.

  14. Turjo, Bangladesh. বলেছেন

    Nice post.. thank you.

  15. মো: নাসির উদ্দিন বলেছেন

    নাইস। খুব ভাল পোস্ট। ধন্যবাদ আপনাকে।

  16. প্রীতম চক্রবর্তী বলেছেন

    লিখাটি খুবই সুন্দর হয়েছে।
    ধন্যবাদ আপনাকে।

  17. RIHDOY ISLAM বলেছেন

    দারুন পোস্ট ধন্যবাদ আপনাকে।

    1. Khorshed Alam বলেছেন

      @RIHDOY ISLAM: ধন্যবাদ আপনাকে

উত্তর দিন