Chapter-4

Webpage Design and HTML

Difference between static and dynamic website:

Static Dynamic
A website whose content of each page is fixed and A website whose content of the page can be
does not change unless it is edited and republished. changed during runtime.
Do not access databases. Access information from a database.
Developed using client-side technologies such as Developed using client-side technologies as well as
HTML and CSS. server-side scripting languages (PHP, [Link], Java
Script, SQL etc.)
Easy to develop and maintain this type of website. Difficult to develop and maintain this type of
website.
Tend to be more secure. Not as safe as static website.
Cost less to build static website. More expensive to build. Requires skilled people to
develop and monitor this website.
Used for small-scale websites that do not require Suitable for large scale e-commerce and social media
continuous changes. websites.

Steps for publishing a website:

 Domain name registration: A domain name needs to get registered for the website first. A name that
is unique, can easily be remembered and which has a meaning to it.
 Webpage Design: Webpages should be designed in a way where visitor’s user experience should be
the preference. There are many professional freelance web designers, developers and organization who
design websites for a fee.
 Page hosting in the web server: After completion of domain registration and designing the webpage,
the website needs to get hosted in a reliable web hosting server. Different companies host websites for
money and this is the most important step.
 Connect the website with the search engines: This step is not necessary. But to get more traffic from
the internet the website should be connected to the search engines.
 স্ট্যাটিক এবং ডাইনামিক ওয়েবসাইযির িযযয পার্কযঃ
থ

স্ট্যাটিক ডাইনামিক
এই ধরনের ওন়েবসাইনের তথ্য নেনদি ষ্ট থ্ানে যা রাে োইনে এই ধরনের ওন়েবসাইনে রােোইনে ওন়েবসাইনের তথ্য
পনরবনতিত হ়ে ো যনদ ো এটে পুেরা়ে পাবনিশ েরা হ়ে। পনরবতিে হনত পানর।
ডেোনবজ বযবহৃত হ়ে ো। ডেোনবজ হনত তথ্য এনেস েনর।
HTML এবং CSS এর েনতা নবনিন্ন ক্লান়েন্ট-সাইে প্রযুক্তি এ ধরনের ওন়েবসাইে ততনর েরনত ক্লান়েন্ট-সাইে
বযবহার েনর এ ধরনের ওন়েবসাইে ততনর েরা যা়ে। প্রযুক্তির পাশাপানশ সািিার-সাইে ক্তিনটং িযাঙ্গু ন়েজ
(PHP, [Link], SQL ইতযানদ) এর প্রন়োজে হ়ে।
এ ধরনের ওন়েবসাইে ডেনিিপ এবং রক্ষণানবক্ষণ েরা এ ধরনের ওন়েবসাইে ডেনিিপ এবং রক্ষণানবক্ষণ েরা
সহজ। েটিে।
এ ধরনের ওন়েবসাইে ডবনশ নেরাপদ। স্ট্যাটেে ওন়েবসাইনের েনতা নেরাপদ ে়ে।
স্ট্যাটেে ওন়েবসাইে ততনরনত েে খরচ হ়ে। ওন়েবসাইে ততরী এবং রক্ষণানবক্ষনণ দক্ষ ডিানের
প্রন়োজে হ়ে তাই খরচ ডবনশ হ়ে।
ড াে আোনরর ওন়েবসাইেগুনিার জেয উপযুি ডযখানে বড় পনরসনরর ই-েোস ও ি সাোক্তজে ডযাগানযাগ োধযে
ক্রোগত তথ্য পনরবতিনের প্রন়োজে হ়ে ো। গুনিার জেয এ ধরনের ওন়েবসাইে বযবহৃত হ়ে।

ওয়েবসাইি পাবমিম ং এর যাপসিূহঃ

 ডডাযিইন ডনি ডরজিযে নঃ ওন়েব সাইেটের জেয সুন্দর, অথ্নবাধে. ি অনিতী়ে ও সহনজই েনে রাখা যা়ে
এেে এেটে োে নেবাচে ি েনর ডসই োনের ডোনেইে ডরক্তজনেশে েরনত হ়ে।
 ওয়েবযপি মডিাইনঃ ডোনেইে ডেইে ডরক্তজনেশনের পর ওন়েব ডপজগুনিা নেজাইে েরনত হ়ে ডযখানে
তনথ্যর সহজিিযতানে অগ্রানধোর ডদও়ো হ়ে। এনত বযবহারোরীরা ওন়েব সাইেটে নিক্তজে েরনত স্বাচ্ছন্দযনবাধ
েরনবে। অনেে ডপশাদার নিিযান্স ওন়েব নেজাইোর, ডেনিিপার এবং প্রনতষ্ঠাে রন়েন যারা অনথ্রি নবনেেন়ে
ওন়েবসাইে নেজাইে েনর।
 ওয়েবসাইি ডহামস্ট্ংঃ ডোনেইে ডেে ডরক্তজনেশে ও ওন়েবনপজ নেজাইনের পর ওন়েব সাইেটেনে এেটে
নেিিরনযাগয সািিানর আপনিাে েরনত হ়ে। নবনিন্ন প্রনতষ্ঠাে অনথ্রি নবনেে়ে ওন়েবসাইে ডহানস্ট্ং েনর থ্ানে এবং
এটে সবনথ্নে গুরুত্বপূণ ধাপ।
ি
 সার্থ ইজিন এর সাযর্ সংযুক্তকরনঃ এই ধাপটে অতযাবশযেী়ে ে়ে। তনব আনরা ডবনশ প্রচারেুখী েরনত
ওন়েবসাইেটেনে জেনপ্র়ে নে ু সাচি ইক্তিে এর সানথ্ সংযুি েরনত হ়ে।
 Types of Website Structure
ওয়েবসাইি কাঠাযিার প্রকারযেদ

A Website Structure can be divided into some parts. এেটে ওন়েবসাইনের গিেনে েন়েেটে িানগ িাগ েরা
It can be divided into following four parts according যা়ে। ওন়েবসাইনের তবনশষ্টয অেুযা়েী এর োিানোনে
to the characteristics of the website. They are- নেননাি চার িানগ িাগ েরা যা়ে। যথ্া-

1. Hierarchical structure/Tree ১. হা়োরারনেেযাি বা টি

2. Network structure/Web Linked ২. ডেেও়োেি বা ওন়েব নিংেে
3. Linear structure/ Sequence ৩. নিনে়োর বা নসেুন়েন্স
4. Combination structure/ Hybrid ৪. হাইনিে বা েনিনেশে

Hierarchical or Tree structure

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

ডয ওন়েবসাইনের ডপজগুনিা শাখা-প্রশাখা়ে সাজানো

থ্ানে তানে টি বা হা়োরারনেেযাি োিানো বিা হ়ে। এ
পদ্ধনতনত ওন়েবসাইনের নবনিন্ন শাখাগুনিানে
The pages of the website that are arranged in the আিাদািানব সংযুি েরা হন়ে থ্ানে। ডহােনপজ, সাব
branches are called tree or hierarchical structure. In ডেেু ও অেযােয ডপনজর নিংে থ্ানে। এনত েনর
this method several parts of a website are engaged ওন়েবসাইনের নিক্তজেররা সহনজই বুঝনত পানর ডোে
in different ways. The link of home page, sub menu অংনশ তার প্রন়োজেী়ে তথ্যগুনিা রন়েন । বড় বড়
and other pages are available here. So the visitors প্রনতষ্ঠাে বা েনপানরে
ি প্রনতষ্ঠানের ওন়েবসাইে, স্কুি,
can easily understand where the needed েনিজ, বযাংে, বীো, নবশ্বনবদযাি়েসহ নবনিন্ন বযবসান়েে
information are kept. School, college or business প্রনতষ্ঠানের ওন়েবসাইে এ ধরনের হন়ে থ্ানে। বহুস্তনর
institution's websites are this sort of website. This নবেযস্ত ওন়েবনপজসেূহ নেন়ে ততনর ওন়েবসাইনের
type of structure is used for websites made with ডক্ষনে এ ধরনের োিানো বযবহৃত হ়ে। নেনন নচে-১ এ
multiple layers of web pages. Hierarchical structure এেটে হা়োরারনেেযাি োিানোর উদাহরণ ডদ়ো হি :
is given below with examples:
select a link that page will be displayed inside a
Network or Web linked Structure comparatively bigger frame.

ডনিও়োকথ কাঠাযিা বা ওয়েবমিংকড

ডয ধরনের ওন়েবসাইে োিানোনত সবগুনিা ডপনজরই
এনে অপনরর সানথ্ নিংে থ্ানে তানে ডেেও়োেি
োিানো বিা হ়ে। এনত এেটে ডেইে ডপনজর সানথ্
In a website structure where all the pages are ডযিানব অেযােয ডপনজর ডযেে নিংে থ্ানে টিে
interlinked is known as network structure. Here the ডতেনে অেযােয ডপনজর সানথ্ও ডেইে ডপনজর নিংে
way a main page is linked with other pages, is also থ্ানে। ডিে বযবহার েনর ততনর েরা ওন়েবসাইেগুনিা
followed as in the case of the other pages are এ ডেেও়োনেির োধযনে নিংে েরা হন়ে থ্ানে যানত
linked with the main page. Websites using frames এেটে ডিনের েনধয অেযােয ডপনজর নিংেগুনিা ডেেু
are interlinked with the help of this network where আোনর রাখা হ়ে। এই ডিেটে সাধারণত নির থ্ানে এবং
the link of other pages are kept as Menu in the ডোে এেটে নিংে নেবাচেি েরনি ঐ ডপজটে
frame. This frame is generally stable and if you অনপক্ষােৃত বড় ডিনের েনধয ডদখা়ে।
Linear or Sequence Structure
মিমন়োর কাঠাযিা বা মসকুয়েন্স

ডোে ওন়েবসাইনের ডপজগুনিা ক্রোেুসানর েরার

োেচার বা োিানোনে নিনে়োর োেচার বিা হ়ে।
যখে এেটে ওন়েবসাইনের ডপজগুনিা নেনদি ষ্ট নসেুন়েন্স
In a structure where the website pages are
অেুসানর নিক্তজে েরার প্রন়োজে হ়ে তখে নিনে়োর
organized in a synchronized way is known as linear
োেচার বযবহার েরা হ়ে । ডোে ডপনজর পর ডোে
structure. When it is necessary to visit the pages of
ডপজ আসনব তা ওন়েবনপজ নেজাইে েরার সে়ে টিে
a website in a sequence then linear structure is
েরা হন়ে থ্ানে। এ ধরনের ডপজগুনিানত সাধারণত
used. Which page will come after which one is
Next, Previous, Last, First ইতযানদ নিংে বযবহার েরা
decided at the time of web designing. Normally
হ়ে। এ পদ্ধনতনত ডপজগুনিা এেটের পর আনরেটে
Next, Previous, Last, First etc. links are used in this
এিানব নসেুন়েন্স অেিার অেুযা়েী নিংে েরা থ্ানে।
type of pages. In this process, pages come one after
েেুনেন্টটে খুব বড় ো হনি অথ্াৎ ি ডপনজর সংখযা যনদ
another and thus these are linked. If the document
েে হ়ে তনব নিনে়োর োেচার বযবহার েরা িানিা।
is not too big and the number of pages is less then
এনত েনর েেুনেন্টটের ডয ডোে অংশনে সহনজই
it is better to use linear structure. This makes it easy
খুনুঁ জ ডবর েরা যা়ে।
to find any part of the document.

Combination or Hybrid Structure

হাইমিড বা কমিযন ন কাঠাযিা

এোনধে োেচার বযবহার েনর নেজাইেেৃত

When website is designed by using more than one ওন়েবসাইেনে হাইনিে বা েনিনেশে বা নেেে
structure, it is called combination or mixed োেচার বিা হ়ে। এোনধে োেচার বযবহার েরনি
structure. Using more than one structure not only ওন়েবসাইনের ডসৌন্দয ডযেে
ি বৃক্তদ্ধ পা়ে ডতেনে
increases the beauty of website but also makes it নিক্তজেরনদর জেয নিক্তজে েরাও সহজ হ়ে।
easy for the visitors to visit the website.