0% found this document useful (0 votes)
250 views26 pages

Web Technology BSC 6 Sem

The document provides an overview of web technology for final year BSc Computer Science students, covering key concepts such as the Internet, World Wide Web (WWW), web browsers, web servers, and web design principles. It explains the client-server architecture, client-side and server-side development, and essential web protocols like HTTP. Additionally, it discusses search engines, SEO best practices, and the importance of MIME types in web communication.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
250 views26 pages

Web Technology BSC 6 Sem

The document provides an overview of web technology for final year BSc Computer Science students, covering key concepts such as the Internet, World Wide Web (WWW), web browsers, web servers, and web design principles. It explains the client-server architecture, client-side and server-side development, and essential web protocols like HTTP. Additionally, it discusses search engines, SEO best practices, and the importance of MIME types in web communication.
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 26

WEB TECHNOLOGY

(For BSc Computer Science – Final Year)

UNIT 1: INTRODUCTION AND WEB DESIGN

1. Introduction to Internet

What is the Internet?

The Internet is a global network of connected computers that enables communication,


information sharing, and access to web-based services. It operates using a set of protocols
that allow devices to communicate with each other.

Key Features of the Internet:

✔ Global Connectivity – Connects users across the world.

✔ Data Transmission – Supports various data formats (text, audio, video).

✔ Resource Sharing – Allows access to remote servers, cloud storage, etc.

✔ Decentralized System – No single governing authority.

Major Components of the Internet:


1. Clients: Computers, smartphones, and devices that request information.

2. Servers: Powerful machines that store websites, databases, and applications.

3. Routers and Switches: Direct network traffic to correct destinations.

4. Protocols: Rules that govern communication between computers.

5. ISP (Internet Service Provider): Companies that provide internet access.

How Does the Internet Work?

1. A user types www.google.com in their browser.

2. The browser sends a DNS request to find Google’s IP address.

3. A TCP/IP connection is established between the user and Google’s server.


4. The server responds with an HTML web page, which is displayed in the browser.

2. World Wide Web (WWW) and Web 2.0

What is the World Wide Web (WWW)?

The WWW (World Wide Web) is a system of interlinked documents accessible via the
Internet.

Invented by Tim Berners-Lee in 1989.

Uses Hypertext (HTML), URLs, and HTTP to allow users to browse web pages.
Difference Between the Internet and WWW:

What is Web 2.0?

Web 2.0 is the modern, interactive version of the web that allows user participation.
Examples: Social media (Facebook, Twitter), Blogs (WordPress), Online collaboration
(Google Docs).

Differences Between Web 1.0 and Web 2.0:


3. Web Browsers

What is a Web Browser?

A web browser is software that allows users to access and interact with websites on the
World Wide Web.

✔ Popular Web Browsers:

Google Chrome – Most widely used.

Mozilla Firefox – Open-source and privacy-focused.

Microsoft Edge – Built into Windows.

Apple Safari – Default browser for Apple devices.

Functions of a Web Browser:

✔ Retrieves web pages using HTTP requests.

✔ Renders HTML, CSS, JavaScript to display content.

✔ Stores cookies and cache for better performance.

How a Web Browser Works (Step-by-Step):


1. User enters https://www.example.com in the address bar.

2. The browser sends an HTTP request to the web server.

3. The server sends back an HTML document.

4. The browser renders and displays the webpage.

5. Web Protocols

What are Web Protocols?

Protocols are rules that enable communication over the web.

✔ Common Web Protocols:


✔ Example: HTTP Request

When a user clicks a link, the browser sends an HTTP request:

GET /index.html HTTP/1.1

Host: www.example.com
✔ Example: HTTP Response

The web server responds with an HTML page:

HTTP/1.1 200 OK

Content-Type: text/html

<html><body>Hello, World!</body></html>

6. Web Servers

What is a Web Server?

A Web Server is a system that processes requests and delivers web pages to users.

✔ Types of Web Servers:

Apache HTTP Server (Open-source, widely used).

IIS (Internet Information Services) (Microsoft’s web server).

Nginx (High-performance, used for handling heavy traffic).

✔ Example: How a Web Server Works


1. The user requests a webpage.

2. The web server processes the request.

3. The server sends the webpage back to the browser.

4. The browser displays the webpage.

✔ Example Web Server Configuration (Apache):

<VirtualHost *:80>

ServerName www.example.com

DocumentRoot /var/www/html

</VirtualHost>

5. Web Design Principles

Key Principles for Good Web Design:


✔ Simplicity – Clean layout and minimal clutter.

✔ Navigation – Easy-to-use menus and links.

✔ Responsive Design – Works on desktops, tablets, and mobiles.

✔ Performance – Fast page loading and optimized images.

✔ Accessibility – Supports users with disabilities (screen readers, alt text).

✔ Example: Responsive Web Design Code

@media screen and (max-width: 600px) {

Body { background-color: lightblue; }

6. Website Structure

✔ Main Components of a Website:

Homepage – The main entry page.

Navigation Menu – Links to other pages.

Header – Contains the logo and branding.

Content Area – The main text, images, and multimedia.


Footer – Contains copyright information and contact details.

✔ Example of a Simple Website Layout:

[ Header: Logo, Menu ]

[ Navigation Menu ]

[ Main Content Section ]

[ Sidebar (optional) ]

[ Footer ]

---

8. Client-Server Technologies

What is Client-Server Architecture?

The client-server model is a system where clients (users’ devices) request services, and
servers (web hosting machines) process these requests.

✔ Client: The front-end application (web browser, mobile app).

✔ Server: The back-end system that stores data and processes client requests.

How Client-Server Architecture Works:


1. The client sends a request (e.g., user enters a URL in a browser).

2. The server processes the request and fetches the required data.

3. The server responds with a webpage or data.

4. The client (browser) renders and displays the response.

✔ Diagram of Client-Server Model:

[ Client (Browser) ] → Sends Request → [ Server (Web Server) ]

← Sends Response ←

✔ Examples of Client-Server Systems:

Web Applications: Gmail, Facebook, YouTube.

Online Banking: Client sends login request, server verifies and responds.
9. Client-Side Tools & Technologies

What is Client-Side Development?

Client-side development focuses on building the front-end (user interface) that runs on a
user’s browser.

✔ Common Client-Side Technologies:


✔ Example: JavaScript Button Click Event

Document.getElementById(“myButton”).onclick = function() {

Alert(“Button Clicked!”);

};

✔ Example: CSS Responsive Design


@media screen and (max-width: 600px) {

Body { background-color: lightblue; }

10. Server-Side Scripting

What is Server-Side Scripting?

Server-side scripting is backend development, where requests are processed on the web
server before reaching the client.

✔ Common Server-Side Technologies:


✔ Example: PHP Script for Handling Form Data

<?php

$name = $_POST[‘name’];

Echo “Hello, “ . $name;

?>
✔ Example: Node.js Server Code

Const http = require(‘http’);

http.createServer((req, res) => {

res.writeHead(200, {‘Content-Type’: ‘text/plain’});

res.end(‘Hello, World!’);

}).listen(8080);

11. URL (Uniform Resource Locator)

What is a URL?

A URL (Uniform Resource Locator) is the address of a web page on the internet.

✔ Example of a URL:

https://www.example.com/about.html
✔ Types of URLs:

Absolute URL: https://www.example.com/index.html

Relative URL: /index.html (Used within a website).

12. MIME (Multipurpose Internet Mail Extensions)

What is MIME?

MIME types define what type of data is being transferred over the web.
✔ Common MIME Types:

✔ Example: MIME Type in HTTP Response

HTTP/1.1 200 OK
Content-Type: text/html

13. Search Engines

What is a Search Engine?

A search engine is a web-based tool that helps users find information online.

✔ Popular Search Engines:

Google – Most widely used.

Bing – Microsoft’s search engine.

Yahoo – An older search engine still in use.

Search Engine Optimization (SEO)

SEO improves website ranking in search results by using keywords, backlinks, and fast
page speeds.

✔ SEO Best Practices:


Use keywords in content.

Create mobile-friendly pages.

Improve loading speed with optimized images.

14. Web Server Technologies

What is a Web Server?

A web server stores and delivers web pages to users.


✔ Common Web Servers:

✔ What is a Proxy Server?

A proxy server acts as an intermediary between a client and a web server, improving
security and performance.

15. HTTP Protocol (Hypertext Transfer Protocol)


What is HTTP?

HTTP is a communication protocol used for transferring web pages between browsers and
servers.
✔ HTTP vs HTTPS:
✔ HTTP Request Methods:

✔ Example: HTTP Request for a Web Page

GET /index.html HTTP/1.1

Host: www.example.com

✔ Example: HTTP Response with Web Page

HTTP/1.1 200 OK

Content-Type: text/html

<html><body>Hello, World!</body></html>

---

You might also like