Responsive Web Design With WordPress Theme Customization

web-design
Responsive Web Design

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

Web Design কি?

Web Design মানে হচ্ছে একটা ওয়েবসাইট দেখতে কেমন হবে বা এর সাধারন রূপ কেমন হবে তা নির্ধারণ করা। ওয়েবডিজাইনারহিসেবে আপনার কাজ হবে একটা পূর্ণাঙ্গ ওয়েব সাইটের টেম্পলেট বানানো। যেমন ধরুন এটার লেয়াউট কেমন হবে। হেডারে, মেনু কোথায় থাকবে, সাইডবার হবে কিনা, ইমেজগুলো কিভাবে প্রদর্শন করবে ইত্যাদি। ভিন্ন ভাবে বলতে গেলে ওয়েবসাইটের তথ্য কি হবে এবং কোথায় জমা থাকবে এগুলো চিন্তা না করে, তথ্যগুলো কিভাবে দেখানো হবে সেটা নির্ধারণ করাই হচ্ছে ওয়েবডিজাইনার এর কাজ। আর এই ডিজাইন নির্ধারণ করতে ব্যাবহার করতে হবে কিছু টুলস যেমন PHOTOSHOP, GIMP ইত্যাদি এবং কিছু Markup এবং Scripting Language যেমন HTML, CSS এবং JavaScript ইত্যাদি। ওয়েব ডিজাইনারদের কে আমরা Front-end ডেভেলপার ও বলতে পারি।

রেসপনসিভ ওয়েব ডিজাইন?

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

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

ওয়ার্ডপ্রেস থিম কাস্টমাইজেশন কি?

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

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

১. ওয়েব ডিজাইন

  • বেসিক এইচটিএমএল এবং এইচটিএমএল ৫
  • ওয়ারফ্রেমিং ওয়েবসাইট ডিজাইন
  • ওয়েবসাইট ডিজাইন টুলস অ্যান্ড সফটওয়ার
  • ওয়ারফ্রেমিং টুলস
  • ফাইল এর প্যাকেজ তৈরি করে রাখা
  • এইচটিএমএল এবং এইচটিএমএল ৫ এর লিখার নিয়ম
  • ইমেজ ট্যাগ
  • ইলিমেন্টস এবং অ্যাট্রিবিউট
  • এইচটিএমএল লিঙ্ক এবং লিস্ট ট্যাগ
  • টেবিল ট্যাগ এর কাজ এবং লেআউট তৈরি করা
  • ডিভ ট্যাগ এর ধারনা এবং ব্যাবহার এর নিয়ম
  • ক্লাস এবং আইডি এর মধ্যে পার্থক্য
  • এইচটিএমএল এবং এইচটিএমএল ৫ দিয়ে পুরনাঙ্গ ফর্ম তৈরি করা
  • আইফ্রেম এর ব্যাবহার, অডিও, ভিডিও ইমপ্লিমেন্ট
  • গিফ এনিমেশন এমবেড
  • সিএসএস এবং সিএসএস ৩ এর পরিচিতি এবং ব্যাবহার
  • সিএসএস এবং সিএসএস ৩ লিখার নিয়ম
  • সিএসএস বর্ডার, মার্জিন, প্যাডিং এর ব্যাবহার এবং পার্থক্য
  • সিএসএস উইড এবং হাইট
  • সিএসএস বর্ডার, প্যাডিং, মার্জিন, উইড এবং হাইট এর ব্যাবহার করে বক্স মডেল তৈরি করা
  • সিএসএস টেক্সট এবং ফন্ট নিয়ে কাজ করা
  • সিএসএস আইকন এর রিসোর্স এবং কাজ
  • সিএসএস লিঙ্কস নিয়ে একটিভ, হোভার এবং ক্লিক এর ব্যাবহার
  • সিএসএস উইএল, ওএল এবং এলআই নিয়ে লিস্ট তৈরি করা
  • সিএসএস টেবিল তৈরি করা এবং এর বিভিন্ন লেয়াউট
  • সিএসএস ম্যাক্স-উইড এবং উইড এর পার্থক্য এবং ব্যাবহার
  • সিএসএস পজিশন
  • সিএসএস ওভারফ্লো
  • সিএসএস পজিশন এবং ওভারফ্লো এর ব্যাবহার
  • সিএসএস ফ্লয়েট নিয়ে কাজ করা এবং লে-আউট তৈরি করা
  • সিএসএস ইনলাইন-ব্লক
  • সিএসএস এলাইন
  • সিএসএস অপাসিটি
  • সিএসএস এর ছোট একটি হোভার এফেক্ট তৈরি করা
  • সিএসএস এর সকল ব্যাসিক জ্ঞান নিয়ে একটি ওয়েবসাইট ডিজাইন করা
  • সিএসএস দিয়ে এইচটিএমএল এর ফর্মকে ডিজাইন করা
  • এডভান্স সিএসএস পরিচিতি
  • সিএসএস 3 2D ট্রান্সফর্ম
  • সিএসএস 3 3D ট্রান্সফর্ম
  • সিএসএস ব্যাকগ্রাউন্ড, গ্র্যাডিয়েন্ট এবং শেড তৈরি করা
  • সিএসএস 3 ট্রানজিশন
  • সিএসএস 3 ফ্লেক্সবক্স
  • সিএসএস 3 গ্রিড

২. বুটস্ট্রাপ 4 ওয়েব ডিজাইন

  • টেমপ্লেট এর জন্য বুটস্ট্রাপ এর ব্যাবহার
  • ইমেজ হভার এফেক্ট
  • সিএসএস বিফর এবং আফটার এফেক্ট
  • এইচটিএমএল এবং সিএসএস দিয়ে ওয়েবসাইট ডিজাইন
  • পিএসডি এর বিভিন্ন ব্যাপার এবং ফটোশপ দিয়ে পিএসডি থেকে বিভিন্ন এলিমেন্ট নিয়ে এইচটিএমএল এ কাজ করা
  • ওয়ানপেজ ওয়েবসাইট ডিজাইন করা
  • একটি বিজনেস ইনফমেশনাল ওয়েবসাইট ডিজাইন
  • পোর্টফলিও ওয়েবসাইট ডিজাইন
  • ওয়েবসাইট এর বিভিন্ন ছোট ছোট অংশের কাজ

৩. এডভান্স প্রফেশনাল ওয়েব ডিজাইনিং

  • সিএসএস 3 হেডার মেনু ডিজাইন উইথ এডভান্স সিএসএস 3
  • ইমেজ হভার এফেক্ট
  • সিএসএস 3 বিফর এবং আফটার এফেক্ট
  • এইচটিএমএল 5 এবং সিএসএস 3 দিয়ে ওয়েবসাইট ডিজাইন
  • পিএসডি এর বিভিন্ন ব্যাপার এবং ফটোশপ দিয়ে পিএসডি থেকে বিভিন্ন এলিমেন্ট নিয়ে এইচটিএমএল 5 এ কাজ করা
  • ওয়ানপেজ ওয়েবসাইট ডিজাইন করা
  • একটি বিজনেস ইনফমেশনাল ওয়েবসাইট ডিজাইন
  • পোর্টফলিও ওয়েবসাইট ডিজাইন
  • ওয়েবসাইট এর বিভিন্ন ছোট ছোট অংশের কাজ

ওয়ার্ডপ্রেস কাস্টমাইজেশন কোর্সে কি কি শিখব?

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

Leave A Reply

Your email address will not be published. Required fields are marked *