Chapter-1(Introduction to Web design)[10 marks]

#Network: It is a group of connected devices with each other for communicating and sharing resources.

#Internet: It is WAN networks of computer where different types of computers connected together in all over the
world.

Advantges Disadvantages
Flaws communication Internet Addiction
Online Education Access to wrong information
E-commerce and online service Theft of personal information
Abundant of Information Spams
Entertainment Virus threats
Social Networks Sensitive Information
Online Banking Wastage of time
Video calls and web Conferencing Obesity and other Heath Issues.

History Of Internet:

- In mid-1960’s, The Advanced Research Projects agency (ARPA) in the US Department of Defence (DOD) was
interested in finding a way to connects computer together.
- In 1969, ARPANET was connected 4 major computers at universities in US (UCLA, Standard Research Institute,
UCSB and the university of Utah).
- Vinton Gray Cerf was called “Father of Internet” because co-designed the TCP/IP protocols and helped developed
the architecture and structure of the Internet.
- To connect to the internet, we will typically need the following:
a) Device (computer, tablet, or smartphone)
b) ISP
c) Modem or router
d) Application Software (E.g., Chrome, Brave, WhatsApp, IG, etc)

#WWW (World wide web or W3):

• Simply called web, is a vast collection of digital pages for using information on the internet.
• It u
• In other words, it is a series of servers that are interconnected through hypertext.
• It works on client-server model.
• It was invented by a British scientist, Tim Berners-Lee in 1989.

Evolution of WWW:

- The concept of WWW was developed in Switzerland at the European Particle Research Centre (known as CERN)
in 1989.
- Webservers on the internet are collectively called as the WWW. The W3C is the closest anyone gets to set the
standard for anyone and enforcing rules about the WWW.

#URL
• URL stands for Uniform Resource Locator.
• A URL, short for a uniform resource locator is a web address pointing to a specific website, a web page, or a
document on the internet.
#Web designing:

- Refers to the creating and maintaining websites that are displayed on the internet.
- It is not limited to websites as it includes other such as web apps, mobile apps, and user interface design.

Elements of the Web Design:

- Layout: The arrangement and structure of content on a web page.
- Color : The color scheme used throughout the website.
- Graphics: can include logos, photos, clipart, or icons, all of which enhance the web design.
- Content: Content and design can work together to enhance the message of the site through visuals and text.

#WHAT is Website:

• It is typically a collection of webpages, images and other elements that are linked together to form a larger,
structured document.
• It can be made up of a single page or it could have thousands of pages.
• They are stored on a web server, a special computer that makes web pages available for people to browser.
• the term “website" refers to a collection of related web pages that are typically identified by a common
domain name and are published on web servers. Websites work through a combination of client-side and
server-side technologies to deliver content and functionality to users.
• an HTTP URL uses TCP/IP port number 80 whereas an HTTPs URL uses 443.
How the website works:

Websites are stored on powerful

computers called servers. These servers have the primary purpose of storing and delivering data. Multiple servers
often work together, forming server clusters or data centres, to handle the high demand for website access.
When you visit a website, your device sends a request to the server, and the server responds by sending the
requested data back to your device.

To display your website on the internet, we need:

1) a website 2) a domain name 3) a server

Domain name: Every website has an address known as a domain name. A domain name is a name chosen by the
website owner that redirects users to the website's IP address. For example, "amazon.com" is the domain name
for Amazon's website. Domain names are easier to remember than IP addresses, which are a series of numbers
that identify a specific server on the internet.

They can be categorized into two main types: static websites and dynamic websites:
Static Websites:

• A static website consists of fixed content that remains the same for all users.
• Each individual page of a static website displays the exact same information to every visitor.
• Static websites are typically built using HTML, CSS, and JavaScript.
• They are prebuilt source code files that do not change unless the website developer manually updates
the content.
• They are often used for smaller-scale sites or websites that do not require frequent updates.

Dynamic Websites:

• It is a collection of dynamic web pages web pages whose content changes dynamically.
• It accesses content from a database or Content Management System.
• Therefore, when we alter or update the content of the database, the content of the website is also
altered or updated.
• Dynamic websites are built using server-side scripting languages such as PHP, Node.js, ASP.NET, Ruby, etc.

STATIC WEBSITE Vs. Dynamic Website

Static website Dynamic website
1. Prebuilt content is same every time the page is 1. Content is generated quickly and changes
loaded. regularly.
2. It uses the HTML code for developing a 2. It uses server-side scripting languages such
website. as PHP, Node.js, ASP.NET, Ruby, etc.

3. It sends exactly the same response for every 3. It may generate different HTML for each of
request. the request.
4. Flexibilty is the main advantage of static 4. Content Management System is the main
website. advantage of dynamic website.
5. Information is change rarely. 5. Information is change frequently.
6. In static Website, database is not used. 6. In dynamic Website, database is used.

Web Pages:

• It is an electronic document written in computer language called HTML (HyperText Markup Language).
• Web pages are the building blocks of a website. A website consists of multiple web pages linked together
under a common domain name. Each web page has its own unique address, known as a URL (Uniform
Resource Locator), which allows users to access and view the specific content of that page.
#Front-End and Back-end Application:

Front End Development:

• Front-end development refers to the process of creating the user interface and visual elements of a website
or web application.
• It is also referred to as “client side” of the application.
• It is built using technologies such as HTML (HyperText Markup Language), CSS (Cascading Style Sheets), and
JavaScript.

o HTML (HyperText Markup Language): Used for structuring the content of web pages.
o CSS (Cascading Style Sheets): Used for styling and formatting the visual appearance of web pages.
o JavaScript: Used for adding interactivity and dynamic functionality to web pages.

• Front end frameworks such as Angular, Ember, React, etc are also popular.

Back-End Development:

• Back-end development refers to the process of building and maintaining the server-side components of a
website or web application.
• It involves working with databases, servers, APIs (Application Programming Interfaces), and other
technologies that handle the behind-the-scenes functionality of a website..

• Writing server-side code using programming languages like Java, Python, PHP, Ruby, or JavaScript (with
Node.js).
# Client and Server Scripting languages:

Client-side scripting refers to the execution of scripts on the client's browser or device. The scripts are written in
programming languages such as JavaScript, HTML, and CSS. When a user visits a webpage, the client-side scripts are
downloaded and executed on their device, allowing for dynamic and interactive web pages.

Server-side scripting involves executing scripts on the web server before sending the response to the client's browser.
The scripts are written in languages such as PHP, Python, Ruby, or JavaScript (with Node.js). Server-side scripts handle
tasks such as processing form data, accessing databases, and generating dynamic content.

Server-Side scripting Vs. Client-Side Scripting

Server-Side scripting Client-Side Scripting
1. It is used to create dynamic pages based a 1. It is used when the user’s browser already has
number of conditions when the user’s all the code and the page is altered on the basis
browser makes a request to the server. of the users input.
2. The web server executes the server-side 2. The web browser executes the client-side
scripting that produces the page to be sent scripting that resides at the user’s computer.
to the browser.
3. Server executes server-side scripts to send 3. The browser receives the page sent by the
out a page but it doesn’t execute client-side server and executes the client-side scripts.
scripts.
4. It is used to connect to the database that 4. It can’t be used to connect to the database on
reside on the web server. the web server.
5. It can access the file system residing on the 5. It can’t access the file system residing on the
web server. web server.
6. It cannot be blocked by the user. 6. It is possible to be blocked by the user.
7. Relatively secure. 7. It is secure.
8. E.g.: PHP, ASP, JSP, Ruby, Pearl, etc. 8. E.g.: HTML, CSS, JavaScript, etc.

# Responsive Web Designing:

Responsive web design refers to the practice of creating websites that can adapt and adjust their layout and content
based on the screen size and device being used to view them. It ensures that websites look good and function
properly on all devices, including desktops, tablets, and smartphones.

The main components of responsive design:

1. Flexible layouts: Using a flexible grid to create the website layout that will dynamically resize to any width.
2. Media queries: An extension to media types when targeting and including styles. It allows designers to
specify different styles for specific browser.
 3. Flexible media: Makes media (images, video and other formats) scalable, by changing the size of the media as
the size of the viewport changes.
# what is sublime text and why use sublime text:
- Sublime Text Editor is a full featured Text editor for editing local files or a code base.
- It includes various features for editing code base which helps developers to keep track of changes.
- Various features that are supported by Sublime are as follows −
• Syntax Highlight
• Auto Indentation
• File Type Recognition
• Sidebar with files of mentioned directory
• Macros
• Plug-in and Packages
- Sublime Text editor is used as an Integrated Development Editor (IDE) like Visual Studio code and NetBeans.
- Sublime Text offers its users the following benefits −
• Ability to solve linker errors.
• Keeping track of all files and folders to work with.
• Problem solving capabilities.
• Keeping color combination for syntax combination.

# what is web browser? Name some web browser:

A web browser is a software application for accessing information on the world wide web or local website and display
it.

1. Google Chrome: Google Chrome is currently the most widely used web browser worldwide, with a global
market share of around 65% on all devices.
2. Safari: Safari is the default web browser for Apple devices, such as iPhones, iPads, and Mac computers. It
holds a significant market share, with around 18% globally.
3. Mozilla Firefox: Mozilla Firefox is an open-source web browser known for its privacy features and
customization options. It has a dedicated user base and is available for multiple platforms.
4. Microsoft Edge: Microsoft Edge is the default web browser for Windows 10 and is designed to be fast and
secure. It replaced Internet Explorer as Microsoft's primary browser.
5. Opera: Opera is a feature-rich web browser available for various operating systems, including Windows,
macOS, Android, and iOS. It offers unique features like a built-in ad blocker and free VPN.
# Search Engine:
- It is service that allows users to search for content using” keyword” or “key phrases” from the internet.
# what are Web Publishing tools?
it consists of tools and resource like programming languages, designing software, animation software, etc. which help
to create and develop web pages.
Web publishing tools can serve different needs, including:

• Website creation and design: These tools offer features for designing and customizing the layout,
appearance, and functionality of websites. They may include templates, themes, and visual editors that allow
users to create visually appealing and interactive web pages.
• Content management: Web publishing tools often include content management systems (CMS) that
facilitate the organization, editing, and publishing of website content. They provide features like version
control, collaboration, and workflow management.
• Integration of multimedia: Many web publishing tools support the inclusion of various media types, such as
text, images, videos, and audio, allowing users to create engaging and interactive web experiences.
• Search engine optimization (SEO): Some web publishing tools offer built-in SEO features, helping users
optimize their websites for search engines and improve their visibility in search results.
#client and server relation:

Client:
A client is a device or software application that requests services, resources, or information from a server. In the
context of the internet, a client is typically a user's device (such as a computer, smartphone, or tablet) running a web
browser or a specific application.
Key Characteristics:
• Initiates Requests: Clients initiate requests for services or data from servers.
• User Interface: Clients often have a user interface that allows users to interact with the application or access
content.
• Receives Responses: Clients receive and interpret the responses from servers.
• Examples:
• Web browsers (like Chrome, Firefox, Safari) are clients that request web pages from servers.
• Email clients (such as Outlook, Thunderbird) request and retrieve emails from email servers.
Server:
A server is a powerful computer or software application that provides services, resources, or information to clients in
a network. Servers are designed to handle multiple requests simultaneously and respond to those requests based on
their capabilities.
• Key Characteristics:
• Listens for Requests: Servers are designed to listen for incoming requests from clients.
• Processes Requests: Servers process the requests, perform necessary operations, and return responses to
clients.
• Resource Management: Servers manage and store resources such as files, databases, or applications.
• Examples:
• Web servers (like Apache, Nginx) respond to requests for web pages by serving HTML, CSS, and other files.
• Database servers (such as MySQL, PostgreSQL) store and manage databases, responding to queries from
client applications.