Home » » ওয়েব ডিজাইন কোর্স : ক্লাস-১

ওয়েব ডিজাইন কোর্স : ক্লাস-১

Written By Ruhul on Tuesday

ওয়েব ডিজাইন কোর্স (HTML ও CSS): ক্লাস-১ Web Design Course
ওয়েব ডিজাইন কোর্স (HTML ও CSS): ক্লাস-১

ওয়েব ডিজাইন কোর্স (HTML ও CSS): ক্লাস-১


ওয়েবসাইট কি?
ওয়েবসাইট (website) হল কোন ওয়েব সার্ভারে রাখা ওয়েব পৃষ্ঠা, ছবি, অডিও, ভিডিও ও অন্যান্য ডিজিটাল তথ্যের সমষ্টি, যা ইন্টারনেট এর মাধ্যমে অ্যাক্সেস করা যায়। ওয়েব পৃষ্ঠা মূলত একটি এইচটিএমএল ডকুমেন্ট। সমস্ত উন্মুক্ত ওয়েবসাইটগুলিকে সমষ্টিগতভাবে "ওয়ার্ল্ড ওয়াইড ওয়েব" বা "বিশ্বব্যাপী জাল" বলা হয়।

What is Web design?
Web design is a process of conceptualizing, planning, and building a collection of electronic files that determine the layout, colors, text styles, structure, graphics, images, and use of interactive features that deliver pages to your site visitors.

ওয়েব ডিজাইন কি?
একটি ওয়েব সাইট তৈরির জন্য লেআইট বা কাঠামো, রং, পাঠ্য শৈলী, গঠন, গ্রাফিক্স, চিত্র এবং ইন্টারেক্টিভ বৈশিষ্ট্যসহ যেসমস্ত কাজগুলো করতে হয় তাকেই ওয়েব ডিজাইন বলে। অর্থাৎ ওয়েবসাইটের বাইরের দিকটা যা দেখা যায়, ডিজাইন, লে-আউট, কালার সবকিছু ওয়েব ডিজাইন। ফেসবুক দিয়েই বুঝানোর চেষ্টা করি। যেমন ফেসবুকের কালার, লেআউট যা দেখছি, সেগুলোকে বলা যায় ওয়েব ডিজাইন। আর এজন্য জানা থাকতে হয় html, css, javascript, jquery, photoshop ইত্যাদি । তবে মূল বিষয় হল HTML ও CSS

ওয়েব ডেভেলপিং:
কোন স্ট্যাটিক ওয়েবসাইটকে ডাইনামিক রুপ দেয়া অর্থাৎ কোন ওয়েব সাইট এর বিভিন্ন এ্যাপ্লিকেশন তৈরি করা, কনটেন্ট ম্যানেজমেন্ট সিস্টেম এর মাধ্যমে খুব সহজে কোন ওয়েবসাইট মেইনটেইন করাই হল ওয়েব ডেভেলপমেন্ট। অর্থাৎ কোডিং ছাড়া ওয়েব সাইটের বিভিন্ন বিষয় পরিবর্তন করা। ফেসবুক দিয়েই বুঝানোর চেষ্টা করি। ফেসবুকের কালার, লেআউট যা দেখছি, সেগুলোকে বলা যায় ওয়েব ডিজাইন। কিন্তু সেখানে সাইনআপ করা, তারপর আইডি দিয়ে লগইন করা, পোস্ট করা, ছবি আপলোড করা ইত্যাদি ওয়েব ডেভেলপিংয়ের কাজ। ওয়েব ডেভেলপের জন্য জানা থাকতে হবে Php, ‍asp, mysql ইত্যাদি এবং কনটেন্ট ম্যানেজমেন্ট এর জন্য wordpress, joomla প্রভৃতি। তবে Php ও wordpress জানলেই কাজ করার জন্য যথেষ্ট।
  
What is HTML?
Hypertext Markup Language (HTML) is the standard markup language for creating web pages and web applications.

এইচটিএমএল কি?
হাইপার টেক্সট মার্কআপ ল্যাঙ্গুয়েজ (এইচটিএমএল: Hyper Text Markup Language) হলো একটি মার্ক আপ ল্যাঙ্গুয়েজ। অর্থাৎ যে ভাষা দিয়ে ওয়েব ডিজাইন করা হয় তাকে এইচটিএমএল বলে। এইচটিএমএল এর মার্ক আপ ট্যাগ সমূহ ব্যাবহার করে ওয়েবপেজ এর বেসিক কাঠামো তৈরি করা হয়। প্রকৃত অর্থে এটি কোনো প্রোগ্রামিং ল্যাংগুয়েজ নয় বরং একটি মার্কআপ ল্যাংগুয়েজ যা একসারি মার্কআপ ট্যাগ এর সমন্বয় গঠিত । ইন্টারনেটে, তথা ওয়েবসাইটে ওয়েবপেজ তৈরিতে এইচ টি এম এল সবচেয়ে বেশি ব্যবহৃত হয়।

ট্যাগ কি?
less than (<) চিহ্ন এবং greater than (>) চিহ্ন দিয়ে মোড়ানো (এইচটিএমএল অনুমোদিত) একটা শব্দকে ট্যাগ বলে। যেমন html শব্দটি এই দুই চিহ্ন দিয়ে মুড়িয়ে যখন   ডকুমেন্টে লিখি তখন এটার নাম html ট্যাগ। এরুপ শত শত ট্যাগ আছে এইচটিএমএল এ। যেমন , , , ইত্যাদি এক একটি ট্যাগ।
প্রায় সব ট্যাগেরই একটা opening tag বা start tag আর শেষে সমাপ্তি ট্যাগ বা closing tag থাকে। যেমন এটি opening tag আর এটি closing tag এভাবে বাকি সবগুলি। দুটো একই শুধু ক্লজিং ট্যাগে একটা forward slash (/) চিহ্ন বেশি থাকে।
** কিছু কিছু ট্যাগ আছে এগুলির ক্লজিং ট্যাগ নেই যেমন ইনপুট ট্যাগ, ইমেজ ট্যাগ ইত্যাদি। এই ট্যাগগুলি সামান্য একটু ভিন্ন।

HTML এর সর্বশেষ ভার্সন (সংস্ককরণ):
HTML এর সর্বশেষ ভার্সন হচ্ছে HTML5। এইচটিএমএল ৫ এ এক্সএইচটিএমএল সহ সকল নিয়ম অনুসরন করা হয়। কাজেই HTML5 শিখলেই আগের ভার্সনগুলি অটোমেটিক শেখা হয়ে যাবে। র্ভাসনগুলি হল: HTML 1.0, HTML 2.0, HTML 3.0, HTML 3.2, HTML 4.01, XHTML 1.0 এবং শেষে HTML5
  
এইচটিএমএল শিখতে কোন সফটওয়ার দরকার এবং কি করতে হবে?
অনেকগুলো সফটওয়ার এর মাধ্যমে এইচটিএমএল শেখা যায় যেমন:
Notepad, Notepad++, brackets html editor সহ আরো অনেক তবে সবচেয়ে ভাল হল: Notepad++
১। নোট প্যাড++ সফটওয়ার। এটি কম্পিউটারে ইনস্টল করতে হবে।
এই ওয়েবসাইট থেকে ডাউনলোড করতে পারবেন:
http://www.rosecomputerinstitute.com/2017/07/notepad-code-editor-software-free.html

২। ওয়েব ব্রাউজারের আপডেট র্ভাসন ব্যবহার করতে হবে।

৩। My Computer/ This PC এর ভিউ থেকে ফাইল এক্সটেনশ আনহাইড করতে হবে।

এইচটিএমএল এর বেসিক কোড :

নিচের কোড টি Notepad++ ওপেন করে টাইপ করুন তারপর সেভ করে  মজিলা ফায়ার ফক্স কিংবা অন্য কোন ব্রাউজার দিয়ে Run করুন।

Designed by: Ruhul | Facebook | Twitter | Instagram
Copyright © 2018. Alamin Computer - All Rights Reserved