আসসালামু আলাইকুম । কেমন আছেন সবাই? আশা করি মহান আল্লাহ্‌ তা'আলার অশেষ রহমতে ভাল আছেন? আমিও আলহামদুলিল্লাহ্‌ ভাল আছি ।

আমরা গত ৮ টি পর্বে এইচটিএমএল নিয়ে আলোচনা করেছি । আজ আমরা সিএসএস নিয়ে আলোচনা করবো । আমি সিএসএস টিউটোরিয়ালটি আপানদের কাছে সহজভাবে উপস্থাপন করবো - ইনশাল্লাহ্‌ ।

সিএসএস (CSS) এর পূর্ণরূপ হচ্ছে Cascading Style Sheets. সিএসএস এর সাহায্যে ওয়েবপেইজের বিভিন্ন উপাদানের গঠন, আকার, আকৃতি, রং ইত্যাদি নির্ধারণ করা হয় । ওয়ার্ল্ড ওয়াইড ওয়েব কনসোর্টিয়াম (W3C) নামে একটি অলাভজনক প্রতিষ্ঠান ১৭ ডিসেম্বর ১৯৯৬ সালে সিএসএস ডেভেলপ করেন ।

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

সিএসএস শেখার প্রয়োজনীয়তা

ওয়েব ডিজাইন & ডেভেলপমেন্ট শেখার ক্ষেত্রে সিএসএস শেখার প্রয়োজনীয়তা অপরিসীম । এছাড়া, সিএসএস এর কিছু বিশেষ সুবিধা রয়েছে;

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

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

নিয়ন্ত্রন সুবিধাঃ এইচটিএমএল ট্যাগ এর মাধ্যমে প্রতিটি অ্যাট্রিবিউট এর ডিজাইন নির্ধারণ করে দিতে হয় । ফলে, পরিবর্তন করার সময় প্রতিটি অ্যাট্রিবিউট এ পরিবর্তন করতে হয় । কিন্তু সিএসএস এর মাধ্যমে মাত্র একটি কোড পরিবর্তন করে সমস্ত সাইটের ডিজাইন পরিবর্তন করা যায় । অর্থাৎ, ওয়েবসাইট এর ডিজাইন সহজে নিয়ন্ত্রন করা যায় ।

ব্যবহার উপযোগীঃ সিএসএস সব ধরনের ডিভাইস এ ব্যবহার উপযোগী । সিএসএস এর মাধ্যমে ওয়েবসাইটের কন্টেন্টগুলোকে অপটিমাইজ করে সব ধরণের ডিভাইসে ব্যবহারের উপযোগী করা যায় । যা এইচটিএমএল দ্বারা সম্ভব নয় ।

সিএসএস শেখার পূর্বপ্রস্তুতি

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

নোটপ্যাড প্লাস প্লাস (Notepad ++) ডাউনলোড করতে এখানে  ক্লিক করুন ।

এছাড়া, সিএসএস এ কালার কোড বেশ গুরুত্বপূর্ণ । সব ধরণের কালার কোড মনে রাখা সম্ভব নয় । তাই, কালার কোড জানার জন্য Pixie Color Picker ব্যবহার করতে পারবেন । এই সফটওয়্যার এর মাধ্যমে আপনি অনায়াসে-ই যেকোনো কালার কোড জানতে পারবেন ।

পিক্সি কালার পিকার (Pixie Color Picker) ডাউনলোড করতে এখানে  ক্লিক করুন ।

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

আজকের সেলফ ওয়ার্ক

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

১ । সিএসএস কি?

২ । সিএসএস কেন ব্যবহার করা হয়?

৩ । এইচটিএমএল শেখার পর কি শিখতে হয়?

৪ । সিএসএস শেখার আগে কি শিখতে হবে?

৫ । সিএসএস শিখতে কি কি লাগবে?

যদি কোন প্রশ্নের উত্তর দিতে সমস্যা হয় তাহলে আমাকে কমেন্ট এর মাধ্যমে জানাবেন ।

ওয়েব ডিজাইন টিউটোরিয়াল এর ৯ম এখানেই শেষ করছি । আগামী টিউটোরিয়াল এ থাকছে;

আমার ফেইসবুক আইডিঃ এখানে

ধন্যবাদ সবাইকে আমার আজকের টিউটোরিয়ালটি মনোযোগ সহকারে পড়ার জন্য । ভাল থাকবেন সবাই । আল্লাহ্‌ হাফেজ ।