Course Name – Web Technology

Lecture 4– Clients-Servers Communication, Website design principles,

Site planning and navigation

Presented By
Sudipta Sahana
Asst. Prof.
Dept. of CSE
JIS College of Engineering
[email protected]
 Topic of Interest

 Clients-Servers Communication
 Website design principles
 Planning the Website
 Types of web navigation
 Styles of web navigation
 Clients-Servers Communication
In network applications, a client and server work together to get useful work done.

Clients and servers communicate with each other across the Internet or any other network.
(Client-server applications are also common on local area networks).

The client requests some service and the server performs it (or returns an error message if
there is a problem).
 Clients-Servers Communication(Continued)
When the client receives the page (or error message), it formats and displays it.

1. the user enters a URL and hits enter

2. the client program sends a Get message containing the URL to the waiting server

3. if the server has the requested document, it sends it back to the client

4. if the server does not have the document, it sends an error message back to the client

5. the client displays whatever was returned

6.the server waits for the next request

 Website design principles
•The success of any website entirely depends on how its web design is. Whether the designers
have taken utmost care or not while developing it.
•Good website design needs a wide range of professionals having expertise in different areas.
Their collective efforts need to put in when there is a critical decision to take place.
• Here in this presentation, we’ll outline the 8 essential principles of good website design
which must be pondered while developing a website.
1. Simple is the best: Over-designed website may not work. Putting too many elements on
the page may lead to distract visitors from the main purpose of your website. Simplicity
always works in an effective web page design.
 Website design principles(Continued)
2. Consistency: Consistency in website design matter a lot. Give your attention to match
design elements throughout each of the pages. It can be understood that your fonts, sizes,
headings, sub-headings, and button styles must be the same throughout the website.

3. Typography & Readability: No matter how good your design is text still rules the website
as it provides users the desired information. Since search engine crawlers are very much
familiar with this data, it becomes an integral part of SEO activities.
 Website design principles(Continued)
4. Mobile compatibility: Keeping in mind the ever-growing usage of smartphones, tablets,
web design must be effective for various screens. If your website design doesn’t support
all screen sizes, chance is that you’ll lose the battle to your competitors.

5.Color palette and imagery: A perfect color combination attracts users while a poor
combination can lead to distraction. This necessitates you to pick a perfect color palette
for your website which can create a pleasing atmosphere, thus leaving a good impact on
visitors.
 Website design principles(Continued)
6. Easy loading: No one likes the website that takes too much time to load. So take care of it
by optimizing image sizes, combing code into a central CSS or JavaScript file as it
reduces HTTP requests. Also, compress HTML, JavaScript and CSS for enhanced loading
speed.

7. Easy Navigation: Study shows that visitors stay more time on the websites having easy
navigation. For effective navigation, you may consider creating a logical page hierarchy,
using bread scrums, and designing clickable buttons.

8. Communication: The ultimate purpose of the visitors is to get information, and if your
website is able to communicate your visitors efficiently, most probably they would spend
more time on your website.
Planning the Website
 Types of web navigation
The use of website navigation tools allow for a website's visitors to experience the site with
the most efficiency and the least incompetence.
There are many different types of website navigation:

1. Hierarchical website navigation: The structure of the website navigation is built from
general to specific. This provides a clear, simple path to all the web pages from anywhere on
the website.
 
2. Global website navigation: Global website navigation shows the top level sections/pages
of the website. It is available on each page and lists the main content sections/pages of the
website.
 
3. Local website navigation: Local navigation is the links within the text of a given web
page, linking to other pages within the website.
 Styles of web navigation
Navigation bar: A navigation bar or (navigation system) is a section of a website or online
page intended to aid visitors in travelling through the online document.
 
Sitemap: A site map (or sitemap) is a list of pages of a web site accessible to crawlers or
users.
 
Dropdown menu: In computing with graphical user interfaces, a drop-down menu or drop-
down list is a user interface control GUI element ("widget" or "control"), similar to a list box,
which allows the user to choose one value from a list.

Flyout menu: In computing with graphical user interfaces, a menu that flies out (either down
or to the side) when you click or hover (mouseover) some GUI element.
 
Named anchor: An anchor element is called an anchor because web designers can use it to
anchor a URL to some text on a web page. When users view the web page in a browser, they
can click the text to activate the link and visit the page whose URL is in the link.
Thank
You