ওয়েব ডিজাইনের ধারণা

ওয়েব ডিজাইন

ওয়েব ডিজাইন হল এমন একটি প্রক্রিয়া যা ইলেকট্রনিক ফাইল বা ওয়েবপেজের বাহ্যিক সৌন্দর্য তৈরি করে। এই প্রক্রিয়ায় বিভিন্ন লেআউট, রং, গঠন, গ্রাফিক্স, চিত্র এবং ইন্টারেক্টিভ বৈশিষ্ট্যগুলি ব্যবহার করা হয়।

ইন্টারনেট

ইন্টারনেট হলো পৃথিবীজুড়ে বিস্তৃত অসংখ্য নেটওয়ার্কের সমম্বয়ে গঠিত একটি বিরাট নেটওয়ার্ক ব্যবস্থা । ইন্টারনেট কে যোগাযোগ ব্যবস্থাও বলা হয়। 1969 সালে যুক্তরাষ্ট্রে সর্বপ্রথম আরপানেট (Arpanet-Advanced Research Projects Administration Network) দিয়ে যাত্রা শুরু করে।

ওয়েব

ইন্টারনেট ব্যবহার করে ওয়েব সাইট থেকে তথ্য নেওয়ার প্রক্রিয়াকে বলা হয় ওয়েব। ওয়েব কে www (World Wide Web) ও বলা হয়। তিনটি প্রযুক্তির সমন্বয়ে ওয়েব গড়ে উঠেছে। যথা-

প্রথমত, HTML (Hyper Text Markup Language) যার দ্বারা ওয়েব পেইজ তৈরি করা হয়।
দ্বিতীয়ত, HTTP (Hyper Text Transfer Protocol)
তৃতীয়ত, Web browser: যে প্রোগ্রাম ডেটা রিসিভ ও অনুবাদ করে ক্লায়েন্টকে তার ফলাফল প্রদর্শন করে।

ওয়েব পেইজ

ইন্টারনেট ব্যবহারকারিদের দেখা বা ব্যবহারের সুবিধার্থে বিভিন্ন দেশের ওয়েব সার্ভারএ রাখা HTML ফাইল কে Web Page বলে। এই HTML ফাইল বিভিন্ন ধরণের ও বিন্যাস বা Format এর তথ্য সম্বলিত থাকতে পারে। যেমন, ডেটা ফাইল হিসেবে pdf, docs, ppt ছবি ও গ্রাফিক্স ফাইল হিসেবে jpg, png, gif অডিও ফাইল হিসেবে mp3, amr; ভিডিও ফাইল হিসেবে mp4, avi, mkv, mpeg.

ওয়েবসাইট

একই ডোমেইনের অধীনে পরস্পর সংযুক্ত একাধিক ওয়েব পেইজের সমষ্টিকে ওয়েবসাইট বলে।

হোম পেইজ

কোন ওয়েবসাইটে প্রবেশ করলে প্রথম যে পেইজটি প্রদর্শিত হয় তাকে হোম পেইজ বলে।

IP Address বা Internet Protocol Address

ইন্টারনেটে যুক্ত প্রতিটি কম্পিউটার বা ডিভাইসের জন্য একটি ঠিকানা থাকে। এ ঠিকানাকে বলা হয় আইপি এড্রেস। বর্তমানে আইপি ভার্সন ৪  বা IPV4 চালু আছে। একটি আইপি এড্রেস ৩২ বিট ব্যবহার করে গড়ে ওঠে। এই বিট গুলোর প্রতি ৮টিকে নিয়ে হয় একটি অকটেট। সুতরাং, আইপি এড্রেসে থাকছে চারটি অকটেট বা ৩২ বিট। একটি আইপি এড্রেস তিন ভাবে প্রকাশ করা যেতে পারে:

ডটেড ডেসিম্যাল- ২০৩.৯১.১৩৯.২
বাইনারি- ১১০০১০১১.১০১১০১১.১০০০১০১১.১০
হেক্সাডেসিম্যাল- CB:5B:8B:2

বর্তমানে আইপি ভার্সন ৪  বা IPV4 চালু আছে।

ডোমেইন নেম

এক বা একাধিক আইপি অ্যাড্রেসকে সনাক্তকরণের জন্য যে অদ্বিতীয় আলফানিউমেরিক (ক্যারেক্টার এবং নাম্বার সম্বলিত) ঠিকানা ব্যবহার করা হয় তাকে ডোমেইন নেম বলে।
সহজ ভাষায় বলতে গেলে ডোমেইন নেম হচ্ছে একটা ওয়েবসাইটের নাম। facebook.com, google.com এগুলো একেকটা ডোমেইন নেম বা ওয়েবসাইট। প্রতিটি ডোমেইন মূলত এক একটি আইপি যেমন: facebook.com এর আইপি 157.240.1.35। 

ওয়েব পোর্টাল

ওয়েব পোর্টাল হচ্ছে বিশেষভাবে পরিকল্পিত ওয়েব সাইট যা বিভিন্ন গুরুত্বপূর্ণ তথ্যের লিংকের সমাহার। যেমন – www.bangladesh.gov.bd হচ্ছে একটি ওয়েব পোর্টাল। যেখানে বাংলাদেশের বিভিন্ন গুরুত্বপূর্ণ মন্ত্রণালয়ের তথ্য সংবলিত ওয়েবসাইটের লিংক দেওয়া আছে।

ওয়েব হোস্টিং

ওয়েব পেইজ বা ইলেকট্রনিক ফাইলগুলো কোনো সার্ভারে রাখাকে ওয়েব হোস্টিং বলে। ফাইল বা পেইজ গুলো সার্ভার কম্পিউটারের হার্ডডিস্কে জমা থাকে।

ক্লায়েন্ট কম্পিউটার

যে কম্পিউটার থেকে আমরা ওয়েব পেইজ ব্রাউজ করি সেই কম্পিউটারকে ক্লায়েন্ট কম্পিউটার বলে। ক্লায়েন্ট কম্পিউটারে ক্লায়েন্ট সফটওয়্যার এর মাধ্যমে বিভিন্ন ওয়েবসাইট ব্রাউজ করা হয়। কিছু ক্লায়েন্ট সফটওয়্যার এর উদাহরণ – Google Chrome , Opera, Firefox ইত্যাদি।

আপলোড

নিজের কম্পিউটার হতে কোনো ফাইল অন্যের কম্পিউটারে অথবা সার্ভারে প্রেরণকে আপ-লোড বলে।

ডাউনলোড

প্রয়োজনে অন্যের কম্পিউটার অথবা সার্ভার হতে ফাইল নিজের কম্পিউটারে নিয়ে আসাকে ডাউন-লোড বলে।

ওয়েব ব্রাউজার

যে সফটওয়্যার এর মাধ্যমে পৃথিবীর বিভিন্ন দেশের সার্ভারে রাখা পরস্পর সংযুক্ত ওয়েবপেইজ গুলো ব্রাউজ করা বা দেখা যায় তাকে ওয়েব ব্রাউজার বলে । ওয়েব ব্রাউজারের উদাহরণ – Internet Explorer, Google Chrome, Mozilla Firefox, and Apple Safari ইত্যাদি। পৃথিবীর বিভিন্ন দেশের সার্ভারে রাখা পরস্পর সংযুক্ত ওয়েবপেইজ পরিদর্শন করাকে ওয়েব ব্রাউজিং বলা হয়।

সার্চ ইঞ্জিন

সার্চ ইঞ্জিন হল এক ধরনের সফটওয়্যার সিস্টেম যা দিয়ে ইন্টারনেটে বিভিন্ন ধরনের তথ্য খুজে পাওয়া যায়। বর্তমানে গুগল সবচেয়ে জনপ্রিয় এবং সুপরিচিত সার্চ ইঞ্জিন। সার্চ ইঞ্জিনের উদাহরণ- Google, Bing and Yahoo! ইত্যাদি।

ওয়েবসাইটের প্রকারভেদ

গঠন বৈচিত্র্যের উপর ভিত্তি করে ওয়েবসাইট দুই ধরণের-

১.  স্ট্যাটিক ওয়েবসাইট (Static Website)

২.  ডাইনামিক ওয়েবসাইট (Dynamic Website)

১. স্ট্যাটিক ওয়েবসাইট (Static Website):

যে সকল Website এর ডেটার মান ওয়েব পেইজ লোডিং বা চালু করার সময় পরিবর্তন করা যায় না, তাকে Static Website বলে। Hyper Text Markup Language (HTML) দ্বারা এই ওয়েবসাইট তৈরি করা হয়। ব্রডব্যান্ড কোম্পানিগুলোর ওয়েবসাইট।

স্ট্যাটিক ওয়েবসাইট এর বৈশিষ্ট্য

•  ওয়েবসাইটের কনটেন্ট নির্দিষ্ট থাকে।
• চালু অবস্থায় কনটেন্ট আপডেট করা যায় না।
• কোন ডেটাবেজ থাকে না । অর্থাৎ কেবলমাত্র সার্ভার থেকে ক্লায়েন্টে বা গ্রাহকে  একমুখী কমিউনিকেশন হয়।
• খুব দ্রুত লোড হয়।
•  HTML এবং CSS means Cascading Style Sheets (সিসকেডিং স্টাইল শিট) দিয়েই একটি ওয়েবসাইট তৈরি করা যায়।

স্ট্যাটিক ওয়েবসাইট এর সুবিধা

•  এ ধরণেরর ওয়েবসাইট খুব সহজে তৈরী ও নিয়ন্ত্রন করা যায় ।
•  ডায়ানমিক ওয়েবসাইটের চেয়ে খুব সহজে ডিজাইন করা যায় ।
•  খুব সহজেই সার্চ ইঞ্জিন পরিচালনা করা যায় ।
• কনটেন্টগুলো সহজে নিয়ন্ত্রন করা যায় ।
•  সহজেই ওয়েবপেজের লে-আউট চেঞ্জ করা যায় ।
•  খুব দ্রুততার সাথে এসব ওয়েবসাইট থেকে খুব কম নেট স্পীডেও ডাটা নামানো বা ডাউনলোড করা যায় ।
•  খরচ কম

স্ট্যাটিক ওয়েবসাইট এর অসুবিধা

•  কনটেন্ট কোডিং বা প্রোগ্রামিং করে আপডেট করতে হয়। তাই সময় বেশি লাগে।
•  ব্যবহারকারীর কাছ থেকে ইনপুট নেওয়ার ব্যাবস্থা থাকে না।
•  কনটেন্ট বেশি হলে নিয়ন্ত্রণ করা কঠিন হয়ে যায়।

২. ডাইনামিক ওয়েবসাইট (Dynamic Website): 

যে সকল Website এর ডেটার মান ওয়েব পেইজ লোডিং বা চালু করার সময় পরিবর্তন করা যায়, তাকে Dynamic Website বলে। এর সবচেয়ে ভাল উদাহরণ হল Facebook। এই Website তৈরির জন্য HTML এর সাথে স্ক্রিপ্টিং ভাষা বা প্রোগ্রামিং ভাষার প্রয়োজন হয়।

ডাইনামিক ওয়েবসাইটের বৈশিষ্ট্য

•  চালু অবস্থায় কোড পরিবর্তন না করেই কনটেন্ট যুক্ত , ডিলিট এবং আপডেট করা যায়।
•  ডেটাবেজ থাকায় কুয়েরি করে তথ্য বের করা যায়।
•  সার্ভার থেকে ক্লায়েন্টে এবং ক্লায়েন্ট থেকে সার্ভারে  উভমুখী কমিউনিকেশন হয়।
•  ডাইনামিক ওয়েবসাইট তৈরি করার জন্য HTML,CSS এর সাথে স্ক্রিপ্টিং ভাষা যেমন- PHP বা ASP.Net ইত্যাদি এবং এর সাথে ডেটাবেজ যেমন- MySQL বা SQL ইত্যাদি ব্যবহার করা হয়।

ডাইনামিক ওয়েবসাইটের সুবিধা

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

ডাইনামিক ওয়েবসাইটের অসুবিধা

•  ডেটাবেজ ব্যবহিত হয় ফলে লোড হতে বেশি সময় নেয়।
•  ওয়েবসাইট উন্নয়ন এবং নিয়ন্ত্রন করা কঠিন। ফলে খরচ বেশি।

ওয়েবসাইটের কাঠামো

ওয়েবসাইটের কাঠামো:

যে অবকাঠামোতে একটি ওয়েবসাইটের সব তথ্য উপস্থাপন করা হয়, তাকে ওয়েবসাইটের কাঠামো বলা হয়। ওয়েবসাইটের কাঠামো তিনটি অংশে বিভক্ত। যথা:

১.   হোমপেজ

২.  মূল সেকশন বা মূল ধারার পেজ

৩.  উপ-সেকশন বা উপধারার পেজ

১. হোমপেজ: হোমপেজ ব্রাউজার শুরুতে লোড করে। হোমপেজ হলো একধরনের সূচি। এই পেজে মূল প্রোগ্রাম, ব্যানার, অ্যানিমেশন যুক্ত থাকে। এখানে মেন্যু তৈরি করে অন্যান্য পেজের সঙ্গে যুক্ত করা থাকে।

২. মূল সেকশন বা মূল ধারার পেজ: হোমপেজের পরের ওয়েবপেজগুলোকে মূল সেকশন বলে। মূল সেকশন কয়েকটি পেজ নিয়ে গঠিত হয়।

৩. উপ-সেকশন বা উপধারার পেজ: মূল সেকশন আবার অনেকগুলো পেজের সঙ্গে যুক্ত। হোমপেজ থেকে মূল সেকশন এবং মূল সেকশন থেকে উপ-সেকশনে পেজের সংখ্যা বৃদ্ধি পেতে থাকে এবং লেখার পরিমাণও বাড়তে থাকে।

উপরিউক্ত পেজগুলো বিভিন্নভাবে সাজানো থাকতে পারে। ওয়েবসাইটের বৈশিষ্ট্য অনুসারে তার বিভিন্ন পেজগুলো নিম্নোক্ত চারভাবে সাজানো যেতে পারে। যেমন:

১। ট্রি বা হায়ারারকিক্যাল

২। ওয়েব লিংকড বা নেটওয়ার্ক

৩। সিকুয়েন্স বা লিনিয়ার

৪। হাইব্রিড বা কম্বিনেশন

ট্রি বা হায়ারারকিক্যাল কাঠামো:

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

ওয়েব লিংকড কাঠামো:

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

সিকোয়েন্স বা লিনিয়ার কাঠামো:

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

ü সরল লিনিয়ার কাঠামো

ü যৌগিক লিনিয়ার কাঠামো।

সরল লিনিয়ার কাঠামো:

এ কাঠামোয় ওয়েবসাইটের ওয়েবপেজগুলো পর পর সংযুক্ত থাকে। ফলে একটি ওয়েব থেকে অন্যটিতে যেতে হলে ধাপে ধাপে যেতে হয়। সাধারণত বিভিন্ন প্রশিক্ষণ বা শিক্ষামূলক সাইটে এই  কাঠামো ব্যবহার করা হয়।

যৌগিক লিনিয়ার কাঠামো:

এ কাঠামোয় ওয়েবসাইটের ওয়েবপেজগুলো পর পর সংযুক্ত থাকলেও, প্রতিটি পেজের সঙ্গে অন্য এক বা একাধিক পেজের সংযোগ থাকতে পারে।

  

হাইব্রিড বা কম্বিনেশন কাঠামো:

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