ওয়েব পেইজ তৈরি করুন HTML ও CSS দিয়ে

যারা ওয়েব সাইট তৈরি করা শিখতে চান তাদের জন্য এই প্রয়াস।কোন ধরনের ডিটেলে যাব না।কাজ করতে করতে শিখা হোক সবকিছু।তাই সরাসরি সাইট তৈরি করার টিউটোরিয়াল দিচ্ছি, প্রথমে একটি পেজ , ধাপে ধাপে header , menu, main section, footer এভাবে পুরো সাইটির ভিবিন্ন অংশ তৈরি করা শিখব সাথে সাথে  শিখব HTML এবং  CSS এর বিভিন্ন এলিমেন্ট

ওয়েব পেইজ তৈরি করুন খুব সহজে

ওয়েব পেইজ  তৈরি করার জন্য প্রথমেই একটি HTML ডকুমেন্ট তৈরি করতে হবে।একটি পেইজের ভিতরে Image, Music Clip, Videos থাকতে পারে ,থাকতে পারে এনিমেশন, তথ্য  ইত্যাদি ।ওয়েবপেইজ দুধরনের হতে পারে।Static এবং Dynamic।স্টাটিক ওয়েবপেইজের মধ্যে বিভিন্ন একশন থাকে না যেমন, কোন একটি ডকুমেন্ট ভিত্তিক সাইট, যাতে সবাই গিয়ে প্রয়োজনীয় ইনফর্মেশন পেয়ে থাকে।অন্যদিকে ডায়নামিক ওয়েবপেইজ ভিউয়ার দের  সাইন ইন করার সুযোগ দেয়,বিভিন্ন অনলাইন গেম খেলার সুযোগ দেয়,অর্থাৎ বেশ অনেক ধরনের সুযোগ সুবিধা নিয়ে ডায়নামিক ওয়েবপেজগুলো বর্তমানে ওয়েব্ দুনিয়ায়  রাজত্ব করছে।

কিভাবে ওয়েব পেইজের জন্য index file তৈরি করব?

ওয়েবপেইজ তৈরি করার এই টিউটরিয়াল টিতে একই সাথে আমরা শিখব HTML ,CSS এবংJavaScript।প্রথমে HTML দিয়ে সাইট টির স্ট্রাকচার তৈরি করব,CSS দিয়ে এটিতে স্টাইল যোগ করব এবং সবশেষে JavaScript দিয়ে আমাদের ওয়েবপেইজটিতে কিছু dynamic content যোগ করব।

• ১। প্রথমেই Website নামে একটি নতুন ফোল্ডার তৈরে করে নেই।এই ফোল্ডারের ভিতর Images নামে আরেকটি ফোল্ডার তৈরি করি যার মধ্যে এই ওয়েবপেইজে ব্যাবহার করা সকল ছবিগুলো থাকবে।এক্ষেত্রে png বা  jpeg ফাইল ব্যাবহার করব আমরা।
• ২। তিন ধরনের ফাইল এতে ব্যবহার করা হবে
  • ১। .html File
  • ২। .css file
  • ৩। .js file

প্রথম ধাপে ওয়েব পেইজের  index file টি তৈরি করতে হবে।এই ফাইল টি তৈরি করব এইচটিএমএল(HTML-HyperText Markup Language) এর মাধ্যমে।Html সম্পর্কে আগে একটু জেনে নিতে চাইলে এই লিঙ্ক টি থেকে ঘুরে আসতে পারেন
তাহলে প্রথম একটি এইচটিএমএল ফাইল তৈরি করি।

(windows key) +R চেপে তাতে টাইপ করুন notepad ,তারপর ok.

একটি notepad ফাইল ওপেন হবে।এখানেই আমাদের ওয়েব পেইজ তৈরির প্রাথমিক কোড লিখতে হবে।

উপরের ছবিটিতে যে কোডটুকু আছে সেটি নোটপ্যাডে টাইপ করে সেভ করুন index.html এই নামে।
এবার websites ফোল্ডারে গিয়ে index.html ফাইলটিতে ডাবল ক্লিক করে সেটিকে ব্রাউজারে ওপেন করতে হবে।
এটি দেখতে এমন হবে ,

আমাদের প্রাথমিক কাজ শেষ।এর পরবর্তী tutorial এ আমারা এই পেইজ টিতে কিছু স্টাইল যোগ করব।আর সেটি করব Cascading Style Sheet  বা সংক্ষেপে CSS এর মাধ্যমে।

নোটঃযদি সবার আগ্রহ থাকে তবে ইচ্ছে টিউনটি ধারাবাহিক ভাবে করা।