History Of the Web

Concept of Internet

Definition : Internet is global system in which millions of

computers are connected together. It is basically a network of
networks.
Using internet many people can share resources and can communicate with each other. To have internet service one
must go to the service providers. That means your computer must be connected to the Internet Service Providers (ISP)
through phone-line modem or DSL.
There are some privately owned internet service providers from which we can hire the internet services.

1.1.3 Concept of World Wide Web

Definition : World Wide Web (WWW) is collections of software and

corresponding protocols used to access the resources over the network.
The world wide web is an information system in which various documents containing information are interlinked
together. User can access this information or write the information via computers. This information is typically stored
on the web pages and through web browsers we can access these web pages.
The web pages may contain the information in the form of text, audio, video, images and graphics. We can navigate
between the web pages using hyperlinks.
The concept of WWW was introduced by Sir Tim Berners-Lee the contractor at the European Organization for
Nuclear Research (CERN), Switzerland in 1980. He built a personal database of people and software models and used
hypertext so that each new page of information was linked to an existing page.
 The World Wide Web was created in 1989 by Tim Berners-Lee and his team at CERN in Geneva, Switzerland. They
made a standard way for computers to communicate, called Hyper Text Transfer Protocol (HTTP). Their text-based Web
browser was released in January 1992.
The Web became popular quickly with the creation of a browser called Mosaic. Developed by Marc Andreessen and his
team at the University of Illinois, Mosaic was released in September 1993. It allowed users to click on links and navigate
easily. In April 1994, Andreessen co-founded Netscape Communications Corporation and released Netscape Navigator
in December 1994, which became the top browser. That same year, Book Link Technologies introduced Internet Works,
the first browser with tabs.
By the mid-1990s, millions of people were using the Web. Microsoft entered the scene with Internet Explorer (IE) in
1995, based on Mosaic, and included it in Windows 95. This made IE the most popular browser, reducing competition
like Netscape.
Apple launched Safari in 2003 as the default browser for Macintosh computers, and later for iPhones (2007) and iPads
(2010). Safari 2.0 in 2005 introduced Private Browsing, which did not save website history, downloaded files, or personal
information.


WEB BROWSERS
What is a Web Browser?
In simple words, a web browser is an application through which we can access websites on the World Wide Web (www). It
provides users a medium using which they can interact with a web server as it fetches the data and displays it as a web page.
We always use Chrome for browsing websites in our daily lives. Well, Chrome is one of the most popularly used web
browsers.
In today’s time, there are various different web browsers available. Each web browser has some unique characteristics and
is distinguished depending on features like speed, security, extensions, etc. Right now, Google Chrome is the most used
browser in the world, however, there are some other popular browsers being used like Mozilla Firefox, Opera, Microsoft
Edge, etc.
Functions of a Web Browser
A web browser is a medium through which you can basically access different websites.
 The main function of a web browser is to provide an interface to the user for sending requests and fetching
data/information from the web servers.
 It also displays the information to the user including multimedia elements (images and videos) in the form of
webpages, using CSS and JavaScript.
 A web browser acts as a platform to access various websites. Users can visit different websites by just entering the
URL of the website on the web browser.
 Browsers also have navigation features like a navigation bar, tabs, and other tools which make surfing the net easier.
One can also open multiple web page at the same time, reload, and navigate forward and backward between web
pages.
 Another function of web browsers is to ensure secure and safe access to websites. This is accomplished by pop-up
warnings, scanning for malicious software and other safety measures.
 The functionality of browsers can also be improved by adding extensions or plugins to the browser. Most commonly
installed extensions include AdBlock, Calendar and other constructive tools.
 The data accessed by a user frequently is stored by the web browsers in the form of cache. This saves the loss of data
and time while accessing the data again and again.
Features of Web Browser
A web browser consists of several features which provide a user-friendly environment in a browser. Some of the features are
listed below:
 Home Page: Whenever we open a browser, the first web page which loads is called the home page. Although the
home page of a browser has some default setting, it can be changed according to user’s preference.
 Address (URL) Bar: The URL of the website that has to be accessed is entered here. Through this bar user can
access different websites or search anything on browser.
 Navigation Buttons: Using the forward and backward buttons user can revisit previously opened web pages. These
buttons provide convenience to retrieve data previously accessed.
 History: If you visited a website and want to revisit it after a few days but have forgotten the address of website then
don’t worry as every browser has a history where it collects all previously visited data. This is a very handy feature to
revisit websites.
 Bookmark: This feature helps in quickly accessing websites. If you come across some important web page you can
always bookmark it for easy access in future.
 Refresh Button: The refresh button reloads the page and shows updates if any.
 Home Button: It brings the user to home page which can be set by user.
 Tabbed Browsing: Using this feature a user can open multiple web pages in the same web browser so that they can
easily switch between them.
 Extensions: Extensions or plugins (like AdBlock) can be installed by the user. These extensions help in improving
functionality of web browsers.
These are some of the basic features you will find in most of the browsers. Let’s look into a few unique features of the most
popularly used web browsers
Chrome:
Chrome is the most used web browser because of its attractive browsing features. One of them is that it has made accessing
data from any device convenient. This is possible as it allows to sync user’s browsing data, passwords, history by logging
with their Google account. Apart from this chrome also provides faster speed and easy to use interface.
Mozilla Firefox:
Mozilla Firefox provides a wide library of add-ons or extensions and also allows to customize the interface of the browser
to a great extent. Along with this, Mozilla Firefox pays special attention to user’s privacy policies.
Opera:
It is the first Chromium-based browser that uses a Multithreaded Compositor. It has a built-in VPN feature which is useful
in maintaining user’s privacy.
Safari:
Safari has adopted all the possible measures to protect the user’s data and information. It includes a private browsing mode,
offline reading list, intelligent tracking prevention, a customizable start page, supports gestures for easy navigation to ensure
great user interface experience.
Microsoft Edge:
You might find Edge pre-installed in Windows 10 and 11 devices. It also has user friendly interface and is integrated with
other Microsoft services. Other features like collections and web capture are causing its popularity gain.
By now we can understand how a web browser’s features and functions provide users a quick and easy access to different
web pages across the browser.
 Browser Architecture
Browser architecture is designed to provide a faster, more secure, and more feature-rich platform that helps users interact
easily with the internet. The browser architecture is broadly divided into seven parts.
User Interface
This is the user interface for the browser. It includes the Address Bar, back button, Bookmarking options, Refresh button,
etc.
The browser’s user interface is not specified in any formal specification, but comes from practices shaped over decades of
experience (and browsers copying each other).
As a result, all browsers have UIs that are extremely similar to each other.
The Browser Engine
The browser engine marshals actions between the browser’s user interface and the browser’s rendering engine.
When you type in a new website and press the enter key, the browser UI will tell the browser engine, which will then
communicate with the rendering engine.
The browser engine is responsible for coordinating web content that is fetched from the server and user interactions. It
keeps a note of which button is clicked, which URL is asked to parse, and how the web content will be processed and
displayed on the browser.
The Rendering Engine
The rendering engine is responsible for displaying the requested content.
The rendering engine will start by getting the contents of the requested document from the networking layer.
It takes in the HTML code and parses it to create the DOM (Document Object Model) tree.
The rendering engine will then parse the CSS to build the CSSOM (CSS Object Model). It’s like the DOM, but for the CSS
rather than the HTML.
While the CSS is being parsed and the CSSOM is being created, the browser is downloading other assets through the
Network Layer like JavaScript files.
The rendering engine communicates with the JavaScript engine to execute the JavaScript code and manipulate the DOM
and CSSOM.
The rendering engine then takes the DOM and the CSSOM and combines them to create the Render tree.

The rendering engine then uses the UI backend for laying out the website on the screen and finally painting the pixels to the
screen.
The entire process that the rendering engine goes through is called the Critical Rendering Path.
Examples of rendering engine include
 Safari - WebKit Rendering Engine
 Chrome - Blink Rendering Engine (Blink is a fork of WebKit)
 Firefox - Gecko Rendering Engine
Here’s a more detailed look at the flow for WebKit

Networking Layer
This layer handles the communication part. When the user enters or clicks on a URL, the network layer initiates an HTTP
request to the webserver to load the requested web page.
It also manages fetching resources from HTML files, images, stylesheets, and more.
Have you seen those cookie notifications while searching for information on the internet? Mostly, the network layer
works behind the scenes for those cookies and cache.
JavaScript Engine
The JavaScript Engine is used to parse and execute JavaScript code on the DOM or CSSOM. The JavaScript code is
provided by the web server, or it can be provided by the web browser (browser extensions or features of the browser like
automatic ad-blocking).
Early browsers used JavaScript interpreters, but modern JavaScript engines use Just-In-Time compilation for improved
performance.
Examples of JavaScript Engine include
 Chrome - V8 JavaScript Engine
 Safari - JavaScriptCore
 Firefox - SpiderMonkey Engine
UI Backend
This layer is responsible for drawing the basic widgets like select or input boxes and windows. Underneath it uses operating
system UI methods.
The rendering engine uses the UI backend layer during the layout and painting stages to display the web page on the
browser.
Data Storage
The browser needs to save data locally (cookies, cache, etc.) so the Data Storage component handles this part.
A large part of the browser goes into storing various types of data, which include not only user preferences, browsing
history, passwords, and other regular data updates as well (address, name, and contact).
Modern browsers also support storage mechanisms like localStorage, IndexedDB, and FileSystem.
 Getting Started with Web Design
What is Web Design?
Web design is the process of creating websites and web pages that combine aesthetics and functionality to provide a user-
friendly experience. It involves a wide range of elements such as layout, colour scheme, typography, and imagery, all
orchestrated to convey a specific message or facilitate certain actions.
As an integral part of the digital landscape, web design combines technical skills with creative vision to produce websites
that meet or exceed user expectations.

How to Learn Web Design

In order to learn Web Design efficiently, one can follow the below given steps to get an understanding of Web Design.

1. Understanding the basics

The first thing you should start with is to get your basics right, these basics will be the base that you will build your design
career upon. Basics of web design include Layout, Navigation, Typography, Images, and Visual Elements. Make sure
to have a decent knowledge of these topics, other than this you should also understand visual hierarchy, content writing,
grid-based layout, and interface designing.

2. Understanding UI/UX Design

Once you are done with the basics of design, we can move to understanding what UI/UX design actually is, UI and UX are
two interdependent terms where UI design or User Interface design refers to the process of creating the visual interfaces for
a software application. And UX design or User Experience design refers to the process of creating the experiences or the
interactions that a user has with a product.
The underlying principle of UI design is to design the interface between the actually working of the application or website
and the user, meanwhile the underlying principle of UX design is to keep the needs of the user prior and improve the
interaction of the user and the product keeping this in mind.
UI/UX design is about designing the entire application or website keeping the user at the centre of the design and making
sure that our design solves the problems of the user. Make sure to have a clear understanding of UI/UX design.
3. Understanding Design Principles
Now the next step in the process of getting started with web design would be to learn about the various design principles that
involved in web design, some of the most important ones are mentioned as follows:
 Balance: Balance simply means visual harmony. Good balance is like trying to create a Visual Harmony on your
website.
 Alignment: Alignment is the way in which elements are placed on the website. The most common usage of alignment
is with text alignment, making the text written left, center, right or justify align.
 Proximity: Proximity of elements means how close the elements are to other elements.
 Repetition: Repetition is basically creating a pattern in user's mind looking at the user interface.
 Contrast: Contrast is a design principle where we try and differentiate one or more elements/visuals from others by
differentiating them by help of colours, fonts, typography, repetition, alignment, or anything else.
 Accessibility: Accessibility means designing for everybody, keeping in mind the people who might have some
special needs and taking care of those needs in the product experience and interface.

4. Colour Theory
The next web design principle we will learn is Colour theory, It is the study of using colours in order to convey an emotion,
create a visual effect, or change human perception is known as Colour Theory.
Within Web Design, Colour Theory will be crucial when you will design your projects because using
colours irresponsibly may lead to miscommunicating our message or communicating the wrong message. Colour theory
helps us to start our colour palettes. It's an important foundation to understand for creating beautiful colour palettes and
foundational for a professional-looking design.

5. Typography

Typography simply is a technique in user interface design to create readable, appealing, attractive, and easy-to-eye text
for users to read. Typography plays an integral role in any website's design. Other than the visual elements, text is the
most important form to communicate with the users, sometimes, text is even more important than the visuals itself.
Therefore, we as user interface designers must focus on this aspect of UI design. Good typography is soothing to the eyes
and creates a long-lasting impression on the minds of the user.

6. Choosing the right Tools

Choosing the right tools for Web Design is crucial, the tools you use will define how flexible you are with your designing
skills so make sure to choose them wisely, few of the most popular web designing tools are:

 Adobe Photoshop

 Figma

 Adobe Illustrator

 Canva

 Sketch

 Wix

 Adobe Indesign

 Adobe After Effects

 Affinity Designer

7. Responsive Design

Responsive design is a method of designing where you design and develop your website or app which would adjust itself
accordingly to various screen sizes. You as designer must learn how to implement responsive design since it is no more a
best practice but essential for the success for the website or application since now most of the visitors to websites come
from smaller screen devices.

8. Learn Basic Coding

Coding refers to write a set of programs in programming languages that would bring your design into a real software
product. It is not expected from you as a designer to code your websites and applications but having basic knowledge of
coding languages such as HTML, CSS, JavaScript really helps in understanding how the design you created will
eventually be implemented.

HTML

Short for hypertext markup language, HTML is what you'll use to build the structure of a webpage. With this tool, you
can learn how to perform these functions and more:

• Insert headings, lists, tables, spreadsheets, and photos into web page copy
• Add hypertext links so users can move quickly to another web page
• Design forms for user interactions like ordering products or making reservations
• Incorporate applications like video clips and sound clips into web page copy

CSS

As HTML provides structure to your web page, cascading style sheets (CSS) is the computer language that gives it style.
With this tool, you can change fonts, adjust color, modify backgrounds, and more.

JavaScript

JavaScript (JS) is a scripting language used with HTML and CSS to make web pages more interactive. With JavaScript,
you can generate and control elements of web pages like photo slideshows, interactive forms, and animated graphics.
 Website Design Principles
An effective website design should fulfil its intended function by conveying its particular message whilst simultaneously
engaging the visitor. Several factors such as consistency, colours, typography, imagery, simplicity, and functionality
contribute to good website design.
1. WEBSITE PURPOSE
Your website needs to accommodate the needs of the user. Having a simple clear intention on all pages will help the user
interact with what you have to offer. What is the purpose of your website? Are you imparting practical information like a
‘How to guide’? Is it an entertainment website like sports coverage or are you selling a product to the user? There are many
different purposes that websites may have but there are core purposes common to all websites;
1. Describing Expertise
2. Building Your Reputation
3. Generating Leads
4. Sales and After Care
2. SIMPLICITY
Simplicity is the best way to go when considering the user experience and the usability of your website. Below are ways to
achieve simplicity through design.
Colour
Colour has the power to communicate messages and evoke emotional responses. Finding a colour palette that fits your
brand will allow you to influence your customer’s behaviour towards your brand. Keep the colour selection limited to less
than 5 colours. Complementary colours work very well. Pleasing colour combinations increase customer engagement and
make the user feel good.
Type
Typography has an important role to play on your website. It commands attention and works as the visual interpretation of
the brand voice. Typefaces should be legible and only use a maximum of 3 different fonts on the website.
Imagery
Imagery is every visual aspect used within communications. This includes still photography, illustration, video and all forms
of graphics. All imagery should be expressive and capture the spirit of the company and act as the embodiment of their
brand personality. Most of the initial information we consume on websites is visual and as a first impression, it is important
that high-quality images are used to form an impression of professionalism and credibility in the visitors’ minds.
3. NAVIGATION
Navigation is the wayfinding system used on websites where visitors interact and find what
they are looking for. Website navigation is key to retaining visitors. If the website
navigation is confusing visitors will give up and find what they need elsewhere. Keeping
navigation simple, intuitive and consistent on every page is key.

4. F-SHAPED PATTERN READING

The F- based pattern is the most common way visitors scan text on a website. Eye-
tracking studies have found that most of what people see is in the top and left areas of
the screen. The F shaped layout mimics our natural pattern of reading in the West (left
to right and top to bottom). An effectively designed website will work with a reader’s
natural pattern of scanning the page.
5. VISUAL HIERARCHY
 Visual hierarchy is the arrangement of elements in order of importance. This is
done either by size, colour, imagery, contrast, typography, whitespace, texture
and style. One of the most important functions of visual hierarchy is to establish
a focal point; this shows visitors where the most important information is.

6. CONTENT
An effective website has both great design and great content. Using compelling language great content can attract and
influence visitors by converting them into customers.
7. GRID BASED LAYOUT

Grids help to structure your design and keep your content organised. The grid helps to
align elements on the page and keep it clean. The grid-based layout arranges content into a
clean rigid grid structure with columns, sections that line up and feel balanced and impose
order and results in an aesthetically pleasing website.

8. LOAD TIME

Waiting for a website to load will lose visitors. Nearly half of web visitors expect a site to load in 2
seconds or less and they will potentially leave a site that isn’t loaded within 3 seconds. Optimising
image sizes will help load your site faster.

9. MOBILE FRIENDLY

More people are using their phones or other devices to browse the web. It is important to consider
building your website with a responsive layout where your website can adjust to different screens.
 WEB APPLICATION AND DEVELOPMENT TOOLS
What is Web Development?
Web development stands for building, designing, and managing websites and web apps for the internet. It needs different
programming languages, frameworks like Jest, Cypress, Puppeteer, etc. and tools like React Native, Jenkins, Circle CI, etc.,
which aids in making responsive, visually appealing, and user-friendly websites.
Web development typically encompasses three main components:
 Front-end Development
 Back-end Development
 Database Management
Who are Web Developers?
Web developers are responsible for designing, creating, and testing the performance of the websites with their coding
knowledge. So, to become a web developer, it’s essential to know some popular front-end and back-end web programming
languages like HTML, CSS, JS, and more.
Since web application development is a dynamic field that evolves continuously, a web developer’s role is a highly
demanding job throughout the world. The current web development trend includes technologies like – IOT, voice search,
machine learning, cyber-security, artificial intelligence, cloud technology, and more.
Types of Web Development Tools
Web development tools help developers build, test, deploy, and user-friendly websites. There are different types of tools you
can choose in this regard. They often include frameworks and libraries that provide a foundation for building web
applications.
  Front-end tools: You should use these tools for front-end like client-side webs. That means the user interface.
 Back-end tools: You can use these tools for the back-end portion with server-side logic – DBs, APIs, etc.
 IDEs: They come with features for the source code and text editing. Also, it provides different plug-ins and tools.
 Project management/collaborative tools: They work as a version control system for your project.

Front-End vs Back-End Web Development Tools

 Front-end development tools focus on the user interface. They build the interaction between UI elements that the
users can see. These tools ensure the responsiveness of the website/app, which means irrespective of the device and
screen size the page experience remains the same.
 Whereas, the back-end tools contribute to the unseen portion of a website/app. That means the users can’t see this part
of the application. So, these tools aid in creating servers, databases, APIs, algorithms, and more to support the front-
end part.

Top Web Development Tools

Here are some of the best web development tools that you can consider –
Front-end web Development Tools
1. React: React or [Link] is an open-source, UI development framework based on the JavaScript library. It’s popular
as a fast-speed front-end development tool. One of its top features is it provides virtual DOM instead of real DOM.
Thus, it becomes a great tool for web and mobile app development. You can reuse the components when using React.
Thus, it saves your time from re-writing the codes.
2. [Link]: [Link] is another JS library that focuses on the view layer of your web. It’s small in size and easily integrates
with other projects. Also, it summed up with the Angular, and React features, easily. Again, it supports cross-
 platform applications, unit testing, routing, etc. The two-way binding feature gives you real-time data tracking and
component updates. The fastest speed of [Link] offers refined user experience on web browsing.
3. AngularJS: This is another popular JS framework created by Google. It provides the solution for both development
and testing. One of its attractive features is supporting client-side MVC (Model-View-controller) and MVVM
(Model-View-View-Model) architecture. Also, it provides UI with HTM, two-way data binding, dependency
injection, and more. You can create a single-page-application and get Google community support for regular updates.
4. Bootstrap: Bootstrap is one of the powerful front-end mobile app and web development tools. It’s an open-
source responsive CSS framework. It maintains an easy responsive, mobile-first web development approach to design
UI-level components like forms, buttons, headers, footers, navigation menus and bars, etc. This framework also
provides cross-browser compatibility.
5. Tailwind CSS: It’s a CSS framework that helps to design custom UI components without writing CSS codes.
Instead, it helps you to use Utility classes of HTML. As a result, you don’t need to worry about the breakages due to
CSS code changes. Also, it allows using the classes from a predefined design system.
This CSS framework supports exclusive customization for front-end development. You will get 500+ components to
design your UI from here.

Back-end Web Development tools

1. PHP: PHP is a popular back-end web development tool and language. You can use it with CMS (Content
Management System) software including WordPress, Jumla, etc. as well. It helps you to enlarge your web by
implementing your plug-ins.

You can embed it easily with HTML, CSS, and other front-end tools. PHP is highly scalable and free to use. Also, it
integrates with several popular DBs – MySQL, Oracle, MS SQL Server, etc.
2. Python

It’s an easy back-end programming language with simple syntaxes. That’s why it grabs a large share of the web
development industry. It’s a cross-platform language that supports different languages like C, Java, etc. Also, it helps in
data visualization, and analytics, as well.

The Selenium Python combination creates great test scripts for automation, cross-browser, and parallel testing. It’s free
and open-source. You can try new types of apps with this. Thus, it increases productivity.

3. JavaScript: JS is a popular web development language. Every front-end developer must know this language along
with HTML and CSS. Not in development, but it also supports unit testing.

You can use different JS testing frameworks like [Link], Mocha, Jest, etc. for this purpose. It increases the speed of code
execution and reduces the server load as it’s a client-side script itself.

4. [Link]: It is an open-source, cross-platform runtime environment for JS. The developers use it for server-side web
application development. [Link] easily builds real-time and data-intensive webs. A [Link] developer gives you fast
prototype delivery, on-time releases and real-time apps. Thus, it saves extra time, money, and resources.

5. Django: It’s a well-known back-end web development framework. Specifically, you can use it for Python
programming. It includes features like scalability, flexibility, extensibility, and more. You can write and run unit tests
with Django’s test execution framework.

These unit tests use the Python standard library. Also, it provides great controls over content delivery networks. As a
result sites like Netflix provide multimedia to serve the contents rapidly.

6. Ruby on Rails: It’s a powerful full-stack framework that comes with distinct features like- an active record for
connecting apps’ databases, modifying SQL queries, and more. A Rails app has three environments – development,
testing, and production. Rails create a test directory for the QAs.
RoR is totally free of cost and provides free plug-ins. You can easily modify codes and add new features through this
framework. You can easily remove bugs when you test your codes through this framework.

7. Laravel: Laravel is a framework for web development using PHP. It supports data migrations, routing, validation,
views, Blade templates, and more. It supports unit testing through [Link] files and provides a configuration
environment for your tests. The Laravel package comes with pre-built user authentication and authorization, cross-site
screening, simplified email integrations, message systems, and more. Also, it gives high performance under heavy traffic
loads.

8. [Link]: It’s a web development platform with [Link]. You can create single-page, multi-page, and hybrid web
apps with this framework. It provides faster I/O, handles asynchronous, single treads, and manages servers, routes, and
more. It supports unit, integration, and end-to-end testing. You can scale your application quickly and use JS for both
front-end, back-end developments with this framework. It gets support from Google v8 engine, which increases its
performance.

Integrated Development Environments (IDEs)

1. MS Visual Studio Code: It’s a free, open-source, cross-platform, and language-supporting code editor. It helps you
to run and debug codes with intelligence, built-in Git commands, deploy with MS Azure, etc. Also, it provides
professional test subscriptions with test case management, continuous testing, delivery, records, etc
2. Sublime Text: It’s a pure text editor that comes with a Python interface. It supports Markup and other programming
languages. It provides customization with JSON configuration files. Another important thing is – it supports split
editing (dividing the webpage into different sections).
3. Atom: The GitHub community built this open-source, free, desktop app. Generally, it edits text and source codes. It’s
a cross-platform editor and provides built-in Git control and multi-cursor plug-ins. It’s written in JS, HTML, Less,
etc.
4. WebStorm: It handles complex server-side and client-side [Link] development. Also, provides coding support for
different JS frameworks, and built-in tools for debugging, and testing the [Link] apps. Again, it supports features
like – smart code insights, [Link] built-in tools, auto-completion, etc.
5. Eclipse: It’s a free, open-source IDE for Java developers. Also, it supports JUnit tests and Maven projects. It provides
different tools and frameworks related to non-software development. Some of them are – web tools, data tools, test
and performance tools, etc.

Project Management/Collaborative tools

1. GitHub: It’s a popular version control, project management, and collaboration tool for developers. You can use
the GitHub repository to commit (save) your source code files. You can use BrowserStack-GitHub integration for
automation testing and track the changes of your codes throughout different versions of GitHub.
2. GitLab: These project management tools provide agile methodologies, CI/CD, report views, analytics, etc.
BrowserStack offers the GitLab CI/CD for continuous integration. This helps you to enable the integration for locally
hosted websites.
The main benefit is – team mates can contribute in every phase of a project. Also, it allows you to track your project’s
progress at every stage.
3. Bitbucket: It’s a code hosting and collaboration tool that provides solutions for CI/CD, automation, cloud, server,
data center, etc. BrowserStack integrates the Bitbucket pipeline for running your automation tests.
It provides unlimited repositories including Git to manage your source codes, access control, and workflow control.
You can manage large file systems from Git.
4. Trello: This project management tool handles project plans, workflows, visual progress, collaboration, and more.
It’s a simple, flexible tool that also tracks your project boards, and lists to find the people involved in every task. It
has the strongest notification system for project management. Also, you don’t need to write any notes when using it.
5. Slack: It’s a collaborative app to handle your automation workflows. It provides integrations with different
services- Google Drive, Office 365, etc. Also, it has other features like – channels, canvas, messaging, accessibility,
security, etc. It supports integrations with CRM tools and automates your important tasks.
 Overview of HTTP

• The Hyper Text Transfer Protocol (HTTP) is a request/response protocol.

• It is a communication protocol used to transfer the information on local area network and World Wide Web
(WWW).
• It is the network protocol used to deliver virtually all files and other data (collectively called resources) on the World
Wide Web, whether they're HTML files, image files, query results, or anything else. Usually, HTTP takes place
through TCP/IP sockets.
• It is also called as a stateless protocol because this protocol is not able to maintain the previous
conversation/information.

HTTP Request and Response Message

• The basic feature of HTTP protocol is that it follows the request response model.
• The client makes a request for desired web page by giving the URL in the address bar. This request is submitted to
the web server and then web server gives the response to the web browser by returning the required web page.

1. HTTP Request Message Structure

The basic structure of request message is given by following general form –

<Start line>
<Header fields>
<Blank Line>
<Message Body>
 <start Line>

The start line consists of three parts which are separated by a single space. These parts are -

i) Request method ii) Request-URI iii) HTTP version

(i) Request Method : Various methods used for making the request are enlisted in the following table

HTTP Description
method

GET The GET method is used to retrieve information from a specified URI and is assumed to be a
safe, repeatable operation by browsers.
POST The POST method is used to request the server for desired web page and the request made is
accepted as a new subordinate of the resource identified. The POST method is used for
operations that have side effects and cannot be safely repeated. For example, transferring money
from one bank account to another has side effects and should not be repeated without explicit
approval by the user.
HEAD The HEAD method is identical to GET. The only difference is that the server should not return a
message-body in the response. The meta-information contained in the HTTP headers in
response to a HEAD request should be similar to the information sent in response to a GET
request.
OPTION This method supports for the specified URL. It can be used to check the functionality of a web
server by requesting '*' instead of a specific resource.
 PUT This method uploads a representation of the specified resource.
DELETE This method is useful in deleting the specified resource.

TRACE When request is made using TRACE method the server echoes back the received request so that
a client can see what intermediate servers are adding or changing in the request.

(ii) Request-URI:
 The Uniform Resource Identifier (URI) is a string used to identify the names or resources on the Internet.
 The URI is a combination of URL and URN.
 The URL stands for Uniform Resource Locator and URN stands for Uniform ResourceName.
 The web address denotes the URL and specific name of the place or a person or item denotes the URN. For example
urn : ISBN 978-81-8431-123-2
specifies the address of some book.
If the URI is written in the form of http: then it is both an URI and URL but there are some other URI which can also be
used as URL. For example
URL Intended server

[Link] File can be located on FTP server

telnet://[Link] Telnet server

[Link] Mail box

 [Link] Web server

(iii) HTTP Version :

The first HTTP version was HTTP/0.9 but the official version of HTTP was HTTP/1.1

History of HTTP

Tim Berners Lee and his team at CERN get credit for inventing original HTTP and associated technologies.

• HTTP version 0.9: This was the first version of HTTP which was introduced in 1991.
• HTTP version 1.0: In 1996, RFC 1945 (Request For Comments) was introduced in HTTP version 1.0.
• HTTP version 1.1: In January 1997, RFC 2068 was introduced in HTTP version 1.1. Improvements and updates to
the HTTP version 1.1 standard were released under RFC 2616 in June 1999.
• HTTP version 2.0: The HTTP version 2.0 specification was published as RFC 7540 on May 14, 2015.
• HTTP version 3.0: HTTP version 3.0 is based on the previous RFC draft. It is renamed as Hyper-Text Transfer
Protocol QUIC which is a transport layer network protocol developed by Google.

<Header Field> and <Message Body>

• The host header filed is associated with the http request.

• The header fields are in the form of field name and field value.
• Thus, typical structure of http request is given be following example
 Header Fields

Blank Line

2. HTTP Response Message Structure

The basic structure of response message is given by following general form –

<Status line>
<Header fields>
<Blank Line>
<Message Body>
<Status Line>
Status line is similar to the start line in the request message. It consists of three fields.

HTTP version Status code Reason phrase

The HTTP version denotes the HTTP version such as HTTP/1.1. The status code is a numeric code indicating the type of
response. The reason phrase is in the text string form and presents the information about the status code.
For example

HTTP Version Status Code Reason Phrase

Following table explains some commonly used status codes.

Status Reason phrase Description

code
200 OK This is a standard response for successful request.
 201 Created It shows that the request is fulfilled and a new resource is being created.
202 Accepted When the request is accepted for processing but is not processed yet is
denoted by this status code.
301 Moved Permanently The URI for requested resource is moved at some another location.
401 Unauthorized The requested resource is protected by some password and the user has
not provided any password.
403 Forbidden The requested resource is present on the server but the server is not able to
respond it.
404 Not Found The requested resource is not present currently but may be available in
future.
500 Internal Server Error It is a generic error message that appears due to software internal failure.

<Header Fields>
The header field in response message is similar to that of request message.
<Message Body>
The message body consists of response message. For example,

HTTP /1.1 200/OK

Date: Sat, 30 Mar 2019 07:59:01 GMT
Server: Apache/2.0.50 (Unix) mod_perl/1.99_10 Perl/v5.8.4 mod_ssl/2.0.50 OpenSSL/0.9.7d DAV/2 PHP/4.3.8
Last-Modified: Mon, 23 Feb 2009 08:32:41 GMT Accept-Ranges: bytes
Content-Length: 2010 Content-Type: text/html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>...</html>
 The response header fields are enlisted in following table

Header field Description

Date It represents the date and time at which the response is generated.
Server The name of the server which is responding
Last-Modified The date and time at which the response is last modified.
Accept-ranges It specifies the unit which is used by the client to accept the range request.
For example, if there is a large document and only a single web page is
currently needed then this specifies the Accept-range.

Features of HTTP Protocol

1. It is a communication protocol used between web browser and web server.
2. This protocol is based on request-response messaging. That means client makes the request of desired web page and
then the server responds it by sending the requested resource.
3. It is a stateless protocol. That means HTTP protocol cannot remember the previous user’s information nor it
remembers the number of times the user has visited particular website.
4. The request-response message consists of plain text in fairly readable form.
5. The HTTP protocol has a cache control. This is an advanced feature of HTTP. Most of the web browsers
automatically store (Cache) the recently visited web pages. This is very useful feature because if the user requests the
same web page that has been visited already then it can be displayed from the cache memory instead of requesting the
web server and bringing it from there.
 Using Cookies
An Http cookie, also known as a web cookie, is a small piece of data that the server sends to the web browser. The browser
may store the cookies and send them back to the server with other requests. The typical use of the cookies is to identify
multiple requests from the same resource (browser). It helps the user to keep logged in and trace his data, such as user name
and session. It is also useful to remember the stateful information for the stateless HTTP protocol.
If you are a developer, you cannot skip the cookies as it will be helpful for session management and tracking the other user
info. A cookie is very important nowadays as any other functionality of the app. Cookies make many things easier for both
the user and the developer.
Cookies have been used for a long time and are being developed magnificently. A cookie is just textual information about
the web application. When a user visits a website, some information is saved to the local storage of the system so that if
They visit again, the app will be able to identify the user and show the relevant results.
Usage of Cookies
The following are some common usages of the cookie:
Session Management:
The primary use of the cookie is to manage user logins, shopping cart details, game scores, or anything else the server
should remember when the user logs in next time.
Generally, the session management facilitates the user to provide a secure interaction with the server through the
application. Since the user continues to interact with the web application, they create a new request every time they visit the
website. So, it provides an easy way to track their status and activity during the session.
Tracking
Tracking involves recording the user activity and analysing their behaviours to personalize the content for them. It records
and analyses their habits and interests and finds the pages that they visit. The tracking details may include the time spent on
a page or across the website during a session. There is some sensitive information in the user tracking, so the user should be
aware of the vulnerabilities of visiting insecure websites and avoid if possible, visiting such websites.
Personalization
Cookies help in personalizing user preferences, themes, and other settings. Most of the time, these settings are synchronized
with a central database to personalize the things for the users when the user logs in for the first time. The user
personalization keeps the information of the user preferences and settings for reapplying when the user logs in or restarts the
application.
Authentication
Cookies are also very important in user authentication. When the user signs in, the server uses the Set-Cookie HTTP
header in response to set a cookie with a unique "session identifier".
Next time the same user requests the same domain, the browser sends the cookie over the net using the Cookie HTTP
header.
Where are Cookies Stored?
Cookies are stored on your device in special folders or files within your web browser. Here’s where they can typically be
found:
 On Your Computer or Device: Cookies are stored as small text files on your hard drive or in your device’s storage.
 In Your Web Browser: Each browser (like Chrome, Firefox, or Safari) has its own way of storing cookies. They
keep cookies in a specific location within the browser’s data storage.
 In the Browser’s Data Folder: For instance, in Chrome, cookies are kept in the “Cookies” file located in the
browser’s profile directory, while Firefox uses a database file called [Link].
 In the Browser’s Settings: You can usually view and manage stored cookies through your browser’s settings or
preferences under privacy or security sections.
To access cookies in chrome browser, you need to follow these steps:
 Chrome: Settings > Privacy and Security > Cookies and other site data > See all site data and permissions.
Parameter for Cookies
Cookies have six parameters that can be passed to them:
1. Name of the cookie – Determines the name of the cookie.
2. Value of the cookie – Determines the value of the cookie.
3. The expiration date of the cookie – determines how long the cookie will remain active in your browser.
4. Valid path for the cookie – This sets the URL path in which the cookie is valid. Web pages or websites outside the
path of the cookie cannot use the cookie.
5. Valid domain for the cookie – This takes the path parameter one step further. This makes the cookie accessible to
pages on any of the servers when a site uses multiple servers in a domain.
 6. Need for a secure connection – It specifies that a cookie can only be used under a secure server condition, such as a
site using SSL.
What are the Different Types of Cookies?
Here are the 5 important types of cookies with a bit more detail:
1. Session Cookies:
 These are the temporary cookies that help websites remember your actions during a single visit, such as items in your
shopping cart or form inputs.
 They are deleted when you close your browser, so they don’t store information after you leave the site.
2. Persistent Cookies:
 Cookies that stay on your device for a set period or until you manually delete them. They remember your preferences,
such as login details or language settings.
 They allow websites to recognize you and recall your settings on future visits, making your experience smoother.
3. First-Party Cookies:
 Created and stored by the website you’re currently visiting. They store information like login status, site preferences,
and items in your cart.
 They improve the website’s functionality by keeping track of your interactions on that site alone.
4. Third-Party Cookies:
 Set by different websites (third parties), usually advertisers, not by the site you’re currently on. They track your
browsing habits across various sites to show you targeted ads.
 They help advertisers display ads based on your browsing history, but can also be used for analytics and social media
plugins.
5. Secure Cookies:
 Cookies that are only transmitted over encrypted connections (HTTPS), ensuring that sensitive information like login
credentials are safe during transfer.
 They enhance security by protecting the cookie data from being intercepted by unauthorized parties during online
transactions.
How to Use Cookies
Cookies are stored and managed through web browsers. If you look through the settings, you may see a list of websites your
web browser uses to store them. Only the website to which the cookie belongs has access to them. This prevents rogue
websites from prying on your log in sessions and stealing them.
Allowing or Removing Cookies
Cookies are not particularly necessary to further continue your online surfing. However, you may customise which cookies
are stored on your computer or mobile device if you want to.
Having cookies is the better and recommended choice since browsing will not be smooth and rather complicated without
them.
Steps to allow cookies:
 Locate the cookie section, which is usually found under Settings > Privacy.
 To allow cookies, check the boxes. “Allow local data” is an option that appears from time to time.
 You can simply uncheck these options if you do not want cookies.
 Removing cookies can help you reduce the chance of privacy violations. It can also clear your browser’s tracking and
personalisation settings.
Steps to remove cookies:
Regular cookies are simple to remove, but they may make specific websites more challenging to navigate. In addition, users
may have to re-enter their data for each visit if cookies are not used on the internet.
Cookies are stored in various locations by different browsers, but in general, you can:
 Locate the Settings, Privacy area, which is frequently referred to as Tools, Internet Options, or Advanced.
 In the windows, look for options and click remove to remove the cookies.
Before deleting cookies, consider the ease of use expected from a cookie-enabled website. Here are some tips that do not
require the deletion of cookies:
 To get rid of tracking cookies and other destructive sorts, you can seek the help of antivirus software, which prevents
the entry of malicious cookies.
 Using the Virtual Private Network (VPN), you can anonymise your web browsing. Since this service redirects your
web traffic to a distant server belonging to another nation, the cookies are stored in the remote server, not in your
local computer.
Regardless of how you handle cookies, it’s best to be cautious and clean up after yourself regularly.
Advantages of Using Cookies
Cookies provide many really beneficial characteristics. They are as follows:
 Because cookies save your login information, you may quickly access a website without having to go through a series
of steps like checking in.
 Cookies are used on eCommerce websites to remember your preferences and recommend comparable products to
those you’ve seen before.
 On websites, cookies are used to save user preferences. Without cookies, you will not need to update your settings
and have them persist across page loads.
Disadvantages of Using Cookies
As valuable as they can be, they also have some significant disadvantages. They are as follows:
 Cookies are prone to cyberattacks.
 Ads introduce cookies to your browser, which can track your web behaviour.
 Ads can lead to data theft and other invasions of privacy.
 Cookies track your personal information, and adverts are tailored to you as a result.

Exploring the Web Technologies

Web technology is a means of communication between computers using markup languages and multimedia packages. It
enables a way to interact with hosted information such as websites. It primarily uses hypertext markup language (HTML)
and cascading style sheets (CSS) to achieve this functionality.
What is Web Technology?
Web technology is a term used to describe all the different things people use to make websites and web-based applications.
This includes software and hardware tools, programming languages, and standards needed to create and run web apps on the
internet. Web technology comprises many areas, including web design, web development, web servers, web browsers, e-
commerce, and content management systems.
The goal of web technology is to make web-based applications work better, faster, and more enjoyable for people to use. It's
always changing and improving, so we can make the most out of the internet and all the great things it offers.

You can classify web technology into the following sections:

1. World Wide Web (WWW): The World Wide Web can further be classified into several different technologies. They
are web browsers, Hyper Text Markup Language (HTML), and Hypertext Transfer Protocol (HTTP).
2. Web Browser: This application software helps explore the World Wide Web (WWW). It provides the user interface
between the client and the server. The web browser also requests the server for web documents and services.
 3. Web Server: It is a program that acts upon the network request of the user and serves them with the files that help
open the web page. The exchange of files takes place with the help of the Hypertext Transfer Protocol (HTTP).
4. Web Pages: A web page is the digital document’s front-end linked to the World Wide Web. It can be viewed by
anyone having an internet connected web browser.
5. Web Development: Web development is everything about building and maintaining websites. It contains web
services, including web programming, web publishing, web design, and database management.

Importance of web technology

Here are some key points highlighting the importance of web technology:

1. Global Reach: The Internet and web technology allow businesses to reach a worldwide audience with their products
and services.
2. Cost-Effective: Web technology enables businesses to reduce costs by automating processes, improving efficiency,
and reducing the need for physical infrastructure.
3. Improved Communication: Web technology facilitates communication and collaboration across organizations and
geographies, enabling better knowledge sharing and decision-making.
4. Enhanced Customer Experience: Web technology allows businesses to provide a more personalized, interactive,
and engaging customer experience.
5. Access to Data: Web technology provides vast amounts of data that can be used for analysis, insights, and informed
decision-making.
6. Mobile Access: Web technology enables businesses to reach customers through mobile devices, which have become
increasingly important in people's lives.
7. Innovation: Web technology drives innovation by providing a platform for new products, services, and business
models.
8. Social Impact: Web technology can improve social and economic outcomes by providing access to education,
healthcare, and other essential services.

• Overall, web technology is a critical enabler of the digital economy, driving growth, innovation, and social progress.
Web Development can be classified into two ways:

• Frontend Development: The part of a website that the user interacts directly is termed as front end. It is also referred
to as the ‘client side’ of the application.
• Backend Development: Backend is the server side of a website. It is the part of the website that users cannot see and
interact. It is the portion of software that does not come in direct contact with the users. It is used to store and arrange
data.

Frontend Languages: The front-end portion is built by using some languages which are discussed below:

• HTML: HTML stands for Hypertext Markup Language. It is used to design the front-end portion of web pages using
a markup language. HTML is the combination of Hypertext and Markup language. Hypertext defines the link
between the web pages. The markup language is used to define the text documentation within the tag which defines
the structure of web pages.
• CSS: Cascading Style Sheets fondly referred to as CSS is a simply designed language intended to simplify the
process of making web pages presentable. CSS allows you to apply styles to web pages. More importantly, CSS
enables you to do this independent of the HTML that makes up each web page.
• JavaScript: JavaScript is a famous scripting language used to create magic on the sites to make the site interactive
for the user. It is used to enhancing the functionality of a website to running cool games and web-based software.
• AJAX: Ajax is an acronym for Asynchronous Javascript and XML. It is used to communicate with the server without
refreshing the web page and thus increasing the user experience and better performance.

There are many other languages through which one can do front-end development depending upon the framework for
example Flutter user Dart, React uses JavaScript and Django uses Python, and much more.
[Link] Technologies Name Developed Year Famous App Built
• LinkedIn
1. HTML Initial release -1993 • Google
• Docs
• Facebook
2. CSS Initial release – 1996 • Google
• Slides
• Netflix
3. JavaScript Initial release -1995 • Candy Crush
• Facebook
• Skype
4. React JS Initial release – 2013 • Airbnb
• Uber Eats
• Gmail
Angular JS JavaScript Web
5. Initial release – 2010 • PayPal
Framework
• Upwork
• Grammarly
6. Vue JS Initial release – 2014 • GitLab
• Trivago
• Duolingo
7. TypeScript Initial release – 2012
• Netflix
• Instacart
8. Bootstrap Initial release – 2011
• Apple Maps
• Trello
9. Backbone JS Initial release – 2010
• Airbnb
Backend Languages: The back-end portion is built by using some languages which are discussed below:
• PHP: PHP is a server-side scripting language designed specifically for web development. Since PHP code executed
on the server-side, so it is called a server-side scripting language.
• [Link]: [Link] is an open-source and cross-platform runtime environment for executing JavaScript code
outside a browser. You need to remember that NodeJS is not a framework, and it’s not a programming language. Most
people are confused and understand it’s a framework or a programming language. We often use [Link] for building
back-end services like APIs like Web App or Mobile App. It’s used in production by large companies such as Paypal,
Uber, Netflix, Wallmart, and so on.
• Python: Python is a programming language that lets you work quickly and integrate systems more efficiently.
• Ruby: Ruby is a dynamic, reflective, object-oriented, general-purpose programming language. Ruby is a pure
Object-Oriented language developed by Yukihiro Matsumoto. Everything in Ruby is an object except the blocks but
there are replacements too for it i.e procs and lambda. The objective of Ruby’s development was to make it act as a
sensible buffer between human programmers and the underlying computing machinery.
• Java: Java is one of the most popular and widely used programming languages and platforms. It is highly scalable.
Java components are easily available.
• JavaScript: JavaScript can be used as both (front end and back end) programming.
• Golang: Golang is a procedural and statically typed programming language having the syntax similar to C
programming language. Sometimes it is termed as Go Programming Language.
• C#: C# is a general-purpose, modern and object-oriented programming language pronounced as “C sharp”.
• DBMS: The software which is used to manage database is called Database Management System (DBMS).

[Link] Technologies Name Developed Year Famous App Built

• Netflix
1. JavaScript JS Initial release -1995 • Candy Crush
• Facebook
 • WordPress
2. PHP Initial release – 1995 • Wikipedia
• Yahoo!
• Instagram
3. Python Initial release -1991 • Google
• Spotify
• NASA WorldWind
4. Java Initial release -1995 • Jenkins
• Hadoop
• Good Reads
Ruby On
5.
Rails
Initial release -1995 • Airbnb
• GitHub

Back End Frameworks and Technology:

PHP:

• Framework: Laravel
• CMS: WordPress

NodeJS:

• Framework: Express

Python:

• Framework: Django
• Package Manager: Python PIP
Ruby:

• Framework: Ruby on Rails

Java:

• Framework: Spring, Hibernate

C#:

• Framework: .NET

Database:
 In web technology, a database is a structured collection of data that is stored electronically and accessed via a
web application.
 It serves as the backend component where data is stored, managed, and retrieved. Databases can be relational (like
MySQL, PostgreSQL) using structured tables and SQL for queries, or non-relational (like MongoDB, CouchDB)
which store data in flexible, document-oriented formats.
 They enable web applications to handle dynamic content, user data, transactions, and more by providing efficient
storage, retrieval, and manipulation capabilities.
 Database management systems (DBMS) are used to interact with the database, ensuring data integrity, security,
and performance.
1. Relation Database:
A relational database stores data in tables, similar to a spreadsheet, where each table has rows and columns.
The rows hold individual records, and the columns define the data attributes. Tables can be linked to each other through
special keys, allowing related data to be connected.
• Postgre SQL: PostgreSQL is a powerful, open-source relational database that supports advanced SQL features
and complex queries. It handles structured data, ensures ACID compliance, and is known for its reliability and
extensibility.
 • MariaDB: MariaDB is an open-source relational database that evolved from MySQL, offering improved
performance, security, and features. It supports SQL queries, ACID compliance, and is highly compatible with
MySQL.
• MySQL: MySQL is an open-source relational database management system that uses SQL for managing
structured data. It’s known for its reliability, ease of use, and performance, widely used in web applications.
2. NoSql Database:
A NoSQL database stores data in a flexible, non-tabular format, unlike traditional relational databases.
Instead of using tables with rows and columns, NoSQL databases might use documents, key-value pairs, wide-columns,
or graphs to store data.
This allows them to handle large amounts of unstructured or semi-structured data efficiently. They are designed to scale
easily and manage big data applications.
 MongoDB: MongoDB is perhaps one of the most popular NoSQL databases in 2022. It was the first document
database management software released way back in 2009. MongoDB was created to tackle the challenges of loading
and accessing data in RDBMS using object-oriented programming languages. It is primarily used to handle document
data.

 Cassandra: Apache Cassandra is an open-source NoSQL database that is used for handling big data. It has the
capability to handle structure, semi-structured, and unstructured data.

• Redis: Redis is an in-memory NoSQL database known for its speed. It supports various data structures like strings,
hashes, and lists, making it ideal for caching, real-time analytics, and messaging.

Data Format

Format of data is used by web applications to communicate with each other. It is light weight text based data
interchange format which means, it is simpler to read and write.
 Below are two common data formats used in web development:

• XML: Extensible Markup Language (XML) is a markup language that defines a set of rules for encoding documents
in a format that is both human-readable and machine-readable.
• JSON: JSON or JavaScript Object Notation is a format for structuring data.

API: API is an abbreviation for Application Programming Interface which is a collection of communication protocols
and subroutines used by various programs to communicate between them.

Web Protocols

Web protocols are set of rules followed by everyone communicating over the web.

• HTTP: The Hypertext Transfer Protocol (HTTP) is designed to enable communications between clients and servers.
HTTP works as a request-response protocol between a client and server. A web browser may be the client, and an
application on a computer that hosts a web site may be the server.
• Other Protocols:
• TCP/IP Model
• UDP
• FTP
• SMTP
• SOAP

Graphics

Graphical elements are one of the key features of any webpage. They can be used to convey important points better
than text does and beautify the webpage.

• Canvas: The HTML “canvas” element is used to draw graphics via JavaScript.
• SVG: SVG stands for Scalable Vector Graphics. It basically defines vector-based graphics in XML format.
 About IIS

IIS stands for Internet Information Services (IIS, formerly known as Internet Information Server) IIS is a web server
software package designed for Windows Server.

IIS Manager console of Internet Information Services 8.5 initial release on May 30, 1995.

IIS provides a redesigned WWW architecture that can help you achieve better performance, scalability, reliability, and
security for our Web sites.

IIS is used to host an application over Web Server and is accessible from client systems via a web browser.

Internet Information Services, also known as IIS, is a Microsoft web server that runs on Windows operating system and is
used to exchange static and dynamic web content with internet users.

IIS can be used to host, deploy, and manage web applications using technologies such as [Link] and PHP.
How Does IIS Server Work?
As a web server, IIS has its own Process Engine, which handles all client-server requests. In essence, a client submits a
request to the server, which is then processed by IIS and returned to the client. IIS's processing architecture is divided into
two main layers:
1. Kernel Mode
Executed code has full access to all linked hardware and can run any command it wants. Kernel Mode is mostly
utilized for trustworthy applications. Kernel Mode crashes are catastrophic for the entire system. [Link] is
located in Kernel Mode.
 2. User Mode
Any code you run in this mode just commands that don't involve accessing hardware or reference memory. This adds
an extra layer of protection against errors and allows for considerably faster recovery. When you run code in user
mode, the APIs are delegated to interface with the hardware and reference memory. Web Admin Service, Virtual
Directory, and Application Pool are all found in User Mode.
• Kernel Mode's job is to take requests from clients and route them to an application pool using [Link]. This
occurs when a client seeks access to a page by clicking or typing the site URL. These requests are captured by
[Link], which creates a queue for each application pool.
• Processing has commenced, as seen by the launch of [Link]. The HttpRuntime process creates
a pool of HttpApplication objects that are subsequently sent over HTTP. HTTP Modules are kept active until the
request reaches the [Link] page's HTTP handler. The page loads after the request has travelled through the HTTP
route.
• The Worker Process and the Application Pool are two important concepts in the world of IIS, as you can see.
• The Application Pool serves as a container. It houses the Worker Process and separates several applications from one
another. This is true whether they are hosted on a single server or a cluster of servers. Multiple websites can be
contained in a single application pool. An application pool, to put it another way, is a collection of URLs that have
been served by worker processes. Separating applications simplifies management and assures that if one application
pool encounters an error, the others are not affected.
Characteristics of IIS
• Componentization: Reducing surface area is one of the most powerful ways to secure a server system.
• Extensibility: Extending IIS enables Web applications to benefit from functionality that in many cases cannot be
easily provided at the application layer.
• Build custom: We can add custom features to extend or replace any existing functionality using your own or third
party server components built on the new extensibility APIs.
 • Database Manager: IIS Database Manager provides the ability to connect to any database on the network.
• Web Platform Installer: The best one for end website users. The web platform installer is a gallery of the popular
software installation.
Features of IIS Server
The IIS server is quite popular and widely used. It has a lot of essential features and is a good tool for a lot of IT admins. IIS
is typically used to host [Link] status websites and web applications, but it may also be used as an FTP server,
host WCF services, and host on other platforms (such as PHP) if extended.
The following are some of IIS's most important features:
• Application Pools
Application pools are a crucial component of the IIS server system. There could be zero or many IIS worker
processes running in a single application pool. These worker processes are in charge of keeping application instances
functioning.
• Authentication
Authentication choices on the IIS server include Windows auth, Basic, and [Link]. Windows auth is especially
beneficial if you use Windows Active Directory because it allows you to sign in to web applications using your
domain account.
• Security
IIS has security capabilities such as TLS certificate management utilities, binding for SFTP and HTTPS, and the
ability to filter requests to effectively whitelist and blacklist traffic. You may set up authorization and permission
rules, log requests, and use a variety of FTP security features.
• IIS is a versatile and highly adaptable web server in general. If you enhance it, it can do far more than just host
[Link] applications. You may develop a stable, adaptable, and successful IIS server by expanding it.
What is an IIS server used for?
• IIS uses various protocols for communication and data exchange with remote clients or computers, such as HTTP,
SMTP, and FTP. As a core Windows product, IIS comes integrated with Windows Server and runs on Windows OS.
• You can use third-party utilities to run IIS over Linux and macOS, but it often offers less stability and poor
performance.
Outlined below are typical ways to use Microsoft IIS server:
• Website hosting: IIS application server can host enterprise web applications, websites, and WCF services. Nearly
30% of the websites run over IIS.
• Logging: IIS server logs contain critical information about your server and website, including usage patterns,
performance issues, etc. Analyzing these log files helps you identify and troubleshoot problems quickly.
• Request Filtering: Microsoft IIS server provides a Request Filtering module to scan and filter potentially dangerous
client requests. You can apply appropriate traffic filtering rules based on parameters such as file extensions, URL
length, and maximum string size.
• Native support: IIS natively supports the Microsoft .NET framework and libraries, allowing developers to quickly
build, deploy, and manage [Link] web applications on IIS.
Benefits of using IIS server
• Robust security: IIS comes with built-in authentication, authorization, and access control features to strengthen your
web application security. You can create system and application administrator accounts individually for granular-level
access. Other security features include request filtering to whitelist/blacklist traffic, dynamic IP blocking, SSL and
TLS encryption, webpage compression, and FTP-specific security controls.
• Application pools: This helps you separate your web applications in IIS for better security and availability. An
application pool has single or multiple applications managed by one or more worker processes in IIS. A worker
 process handles the client requests specific to an application pool. Isolation ensures the crashing or failure of an
application in a particular pool doesn’t affect the applications in other pools.
• Scalability and reliability: You can implement a scalable and reliable web infrastructure with IIS Web Farm, which
allows you to host high-traffic websites on multiple IIS servers with load balancing and application request routing
(ARR). A load balancer distributes traffic among multiple servers in the IIS server farm using sophisticated
algorithms. At the same time, ARR determines the best content server for every request. An IIS server farm also lets
you add or remove servers to dynamically scale your website traffic handling capabilities.
Apache vs IIS

Sr. Apache web server IIS web server

No.

1. Apache web server is useful on both IIS web server is used on Windows platform.
Unix based systems and on
Windows
platform.

2. It is an open-source product. It is a vendor specific product and can be used on windows

products only.

3. The Apache web server can be For IIS server, the behavior is controlled by modifying the
window-based management programs called IIS snap in. We can
controlled by editing the
access IIS snap-in through the
configuration file [Link]
Control-Panel->Administrative Tools.
Advantages of IIS
• Secure the server by reducing the attack surface area.
• Improve performance and reduce memory footprint.
• Empower Web applications.
• Quality enhancements with lots of bug fixes.
• Application Warm-Up tech for best web performance.

Disadvantages of IIS
• Managing large IIS server configurations or multiple servers over the Internet can be slow and cumbersome.
• Not all configuration properties can be accessed in the user interface.
Conclusion
• IIS Server can seem overly complex at times, but once you understand the fundamentals, such as how to configure
your website, you'll be well on your way to mastering the learning curve.
• The key is to stick with it, because learning how to utilize the world's second-largest Windows web server is well
worth the initial learning curve.
 Creating a website
• Website is a collection of Web Pages. Hence for a web site design we need to design the web pages.
• Each Web Page may contain texts, photos, videos, social media buttons and so on.
• Technically, a Web page is a special type of document written in scripting languages such as HTML, CSS,
JavaScript, PHP And so on.
• Web pages are written for web browsers. The web browsers are the programs like internet Explorer, Google Chrome,
and Safari. These browsers have a simple but crucially important job: they read the web page document and display
the perfectly formatted result.
• Definition of Web Site: Web Site is a collection of web pages that are grouped together to achieve certain task under
single domain name.

Why do people visit Web Site?

Generally, people look at website for two primary reasons:
1. The most important reason is to find the required information. This could be anything from a student looking for
images for a school project, to finding the latest stock quotes, for getting the address of the nearest restaurant and so
on.
2. To complete a task. Visitors may want to buy the latest best-seller, download a software program, or participate in
an online discussion about a favorite hobby.
Steps for Creating the Web Site
Following steps are followed for creating a web site –
Suppose you wish to publish some web page on the internet then following steps can be followed –
Step 1: Web Site Creation
• Create a web page using suitable scripting language.
• If any image is associated with this web page then convert this image into appropriate format (JPEG od GIFF format
is preferrable). Embed this image appropriately in this web page.
Step 2: Choose the Web Hosting Service
• Web Hosting company hosts your web pages on web server. Thus your web site will be available to any one who
knows your URL.
• Most web hosting companies offer hosting services for both personal and business use.
• The web host provides you with Internet access, email accounts and space for a personal or business web site.
• If you are building a web site for business use, your web host can register a personalized domain name for your web
site.
• Small Web sites (around 15 – 20 pages contents) do not need much more than 1 or 2 MB of server space that hold all
HTML pages and Graphics. Your web hosting package should provide at least MB of space so your web page has
room to grow.
Step 3: Registering Domain Name
• Domain name is an alias that points to actual location of your web site on Web server. Domain name are managed by
the Internet Corporation for Assigned Names and Numbers (ICANN). ICANN has agreements with a number of
vendors to provide domain name registration services.
Step 4: Planning your web site
When planning your website, you will need to make a number of important decisions :
 • Type: The type of site you need. Is this a news or informational site, a site for a company or service, a non-profit or
cause-driven site, an Ecommerce shop, etc. Each of these kinds of site has a slightly different focus that will
influence its design.
• Navigation design: Navigation means indication that how users will move around your site affects its information
architecture as well as the overall usability of that site. Plan out the pages a site, create a sitemap, and develop a
navigational structure from there.
• Content: The quality of your site’s content will play an important role in it’s success. Content is everything that
your pages will contain, such as text, images, video and more. Before you start designing or building pages, you
should have a clear strategy for the content that those pages will contain.
Step 5: Uploading Files
• To publish a web site on the web, you must send the web pages created by you on the web server using a File
Transfer Protocol (FTP). Using some software such as Microsoft Visual Studio or Adobe Dreamweaver one can
upload the files on the web server.
Testing the Web Site
Testing must be performed throughout the development of web site. Even after creating the web site, it must be tested for as
web pages are present live on the web. Various factors for testing the web site after publishing are –
1. Multiple Browser: It is necessary to display the web site on as many web browsers as possible to ensure that the
contents of the web site are consistently displayed and the work done is portable.
2. Multiple Operating Systems: It is necessary to display the web site on different operating systems.3. Connection
Speed: Do not rely on the same connection speed when testing your web site, specially if you work in a corporate
environment where the connection to the Internet usually is faster than the average user’s. Also test the download
time for different connection speed.
3. Device Types: Test the web site on the computers having different screen size. It is necessary to ensure that pages
are displayed consistently on all screen size.
4. Links: Use a link validation tool to ensure that all of your links connect to a live page. Link validation tools are built
into many HTML editors and are available as stand-alone tools. Many web sites also offer validation, including the
WC’s link validator at [Link]/checklink.
5. Security Testing: This step is necessary to test the security vulnerabilities in application running on the web site.
Security is an important part of any web development plan.