INTERNAL ASSIGNMENT

BACHELOR OF COMPUTER APPLICATIONS (BCA)

SESSION: SEPTEMBER 2024

SEMESTER : 5
SUBJECT CODE: DCA-3101
NAME:M SANTHOSH

ROLL NUMBER: 2214506282

SUBJECT NAME: Web design

 Q.no:1 Set-I

Internet
The Internet is the foundation for global connectivity, supporting multiple services like
email, cloud computing, and messaging.
➢ network of roads, highways, and bridges that connect cities and towns. It's the
physical and digital infrastructure that allows computers and devices to communicate
with each other.

World Wide Web

World Wide Web is just one of these services, allowing users to navigate and interact with
web-based content. While the Internet can exist without the WWW, the WWW cannot
function without the Internet.

➢ system of houses, businesses, and other buildings that exist along those roads. It's a
way to organize and access information and resources on the Internet using web
pages, links, and browsers. Is a service operating on the Internet that allows users to
access web pages and online content through web browsers.

Difference Between the Internet and the World Wide Web (WWW)

1. Definition

• Internet: A vast network of networks that connects millions of devices worldwide

using standard communication protocols.

• World Wide Web (WWW): A system of interlinked web pages and multimedia
content that can be accessed via the Internet.

2. Function

• Internet: Provides various services like email, file sharing, online gaming, and cloud
computing.

• WWW: Uses the HTTP/HTTPS protocol to allow users to browse and interact with
websites and multimedia content.

3. Components

• Internet: Includes hardware (servers, routers, fiber-optic cables) and protocols

(TCP/IP, FTP, DNS, SMTP).

• WWW: Consists of web servers, web browsers, HTML documents, hyperlinks, and
multimedia files.

4. Access Mechanism

• Internet: Accessible via Wi-Fi, Ethernet, mobile networks, or satellite connections

and supports multiple services.
 • WWW: Requires a web browser (Chrome, Firefox, Edge) to access content using
URLs.

5. Example Services

• Internet: Email (Gmail, Outlook), Cloud Storage (Google Drive, Dropbox), Video
Conferencing (Zoom, Skype).

• WWW: Websites (Google, Facebook, Wikipedia), Social Media, E-commerce

(Amazon, Flipkart).

6. Existence and Development

• Internet: Developed in the 1960s as a military project (ARPANET) and later evolved
into a global network.

• WWW: Invented in 1989 by Tim Berners-Lee as a system to share and access

information using hypertext.

7. Dependency

• Internet: Can exist without the WWW, as it supports other services like email and
file transfer.

• WWW: Depends on the Internet to function, as it requires an online network to

deliver web pages.

8. Data Transfer Protocols

• Internet: Uses TCP/IP, FTP, SMTP, and other protocols for data transmission and
communication.

• WWW: Primarily uses HTTP and HTTPS to request and display web pages
securely.

9. Speed and Performance

• Internet: The speed of the Internet depends on the bandwidth, infrastructure, and
network traffic. A faster internet connection allows for quicker data transmission
across all services.

• WWW: The speed of the WWW depends on website optimization, server response
time, and browser efficiency. A slow website does not necessarily mean a slow
internet connection.
10. Usage Scope

• Internet: Used for a wide range of applications including networking, IoT (Internet of
Things), remote work, and global communications.

• WWW: Primarily used for browsing websites, accessing online services, and
retrieving digital content.
 Q.no:2 Set-I

Three Key Services Provided by the Internet and a Common Security Threat

The Internet has revolutionized the way people communicate, work, and entertain
themselves. It offers numerous services that facilitate global connectivity, remote
collaboration, and instant access to information. Below are three essential services provided
by the Internet:

1. Email Communication

• Description: Email is one of the earliest and most widely used Internet services that
allows users to send and receive messages instantly across the world.

• Examples: Gmail, Outlook, Yahoo Mail.

• Usage: Businesses rely on emails for internal communication, customer service, and
marketing. Individuals use email for personal correspondence, subscriptions, and
official documentation.
• Security Concerns: Emails are often targeted by phishing scams, where attackers
send fraudulent messages to trick users into sharing sensitive information.
2. Cloud Computing

• Description: Cloud computing enables users to store, process, and access data
remotely instead of relying on local hardware. This service allows companies and
individuals to use software applications without installing them on their devices.

• Examples: Google Drive, Dropbox, Microsoft OneDrive, AWS (Amazon Web

Services), and Google Cloud.

• Usage: Businesses use cloud services for data storage, software as a service (SaaS),
and scalable computing power. Individuals use cloud services for backup storage, file
sharing, and collaborative work.

• Security Concerns: Cloud misconfigurations and weak access controls can lead to
unauthorized access and data breaches.

3. Online Streaming and Entertainment

• Description: The Internet has transformed how people consume entertainment,

allowing on-demand access to movies, music, and video content through streaming
services.

• Examples: Netflix, YouTube, Spotify, Amazon Prime Video, and Twitch.

• Usage: Online streaming eliminates the need for physical media and enables global
content distribution. Gamers use platforms like Twitch to stream live gameplay.

• Security Concerns: Streaming services can be exploited through piracy, illegal

downloads, and malware-infected streaming links.
Latest Common Threat to Internet Security: AI-Powered Cyberattacks

One of the most emerging cybersecurity threats in 2024 is AI-powered cyberattacks,

where hackers use artificial intelligence to automate and enhance cyberattacks.

➢ AI-Powered Cyberattacks Work

1. AI-Generated Phishing Attacks

• Attackers use AI to craft realistic phishing emails that mimic legitimate

organizations. Unlike traditional phishing scams, these emails contain no
grammatical errors and seem highly credible.

• Hackers also use AI-generated deepfake videos or audio to impersonate

company executives and trick employees into making unauthorized
transactions.

2. Automated Password Cracking

• Cybercriminals use AI-powered tools like PassGAN to guess passwords much

faster than conventional brute-force attacks.

• AI can analyze leaked databases and predict commonly used passwords,

increasing the success rate of attacks.

3. AI-Powered Malware and Ransomware

• AI allows malware to evade traditional detection systems by learning from

security software and adapting in real time.

• Ransomware attacks are becoming more sophisticated, encrypting critical

files and demanding payment in cryptocurrencies.

➢ Preventive Measures Against AI-Powered Cyber Threats

• Multi-Factor Authentication (MFA): Reduces the risk of password-based attacks.

• AI-Enhanced Security Systems: Companies are now using AI to detect and counter
AI-driven cyber threats.

• Employee Awareness Training: Organizations must train employees to recognize AI-

generated phishing scams.

• Regular Software Updates: Keeping software up to date helps protect against

evolving threats.
As AI technology advances, cybersecurity experts must develop proactive defense strategies
to counter increasingly sophisticated cyber threats.
 Q.no:3 Set-I

Purpose of a URI in HTML and How It Is Used to Create Hyperlinks

The Uniform Resource Identifier (URI) in HTML plays a crucial role in identifying and
locating resources on the web. A URI can be a Uniform Resource Locator (URL) or a
Uniform Resource Name (URN).

• URL (Uniform Resource Locator): Specifies the complete address of a resource,

such as https://www.example.com/page.html.
• URN (Uniform Resource Name): Identifies a resource by name without specifying
its location, such as urn:isbn:0451450523.
A URI is essential for creating hyperlinks in HTML, as it allows users to navigate between
web pages, download files, open applications, and more.

➢ Using a URI to Create Hyperlinks in HTML

HTML, the <a> (anchor) tag is used to define hyperlinks, with the href attribute specifying
the URI of the target resource.
1. Basic Hyperlink (Absolute URI)

<a href="https://www.systech.com">Visit systech </a>

• At href contains the absolute URL, directing users to an external website.

2. Relative URI (Internal Link within a Website)

<a href="/about.html">About Us</a>

• The link navigates within the same website without specifying the full URL.

• Relative URIs improve website flexibility and portability.

3. Fragment Identifier (Jumping to a Section on the Same Page)

<a href="#contact">Go to Contact Section</a>

• The #contact identifier refers to an element with id="contact" on the same page.

• Useful for navigation within long pages.

4. Email Link (mailto:)

<a href="mailto:info@ systech.com">Email Us</a>

• Clicking the link opens the user’s default email client with a pre-filled recipient
address.

• This is commonly used for contact links.

5. Telephone Link (tel:)

<a href="tel:+1234567890">Call Us</a>
 • Clicking the link allows mobile users to dial a phone number directly.

6. File Download Link

<a href="documents/report.pdf" download>Download Report</a>

• Enables users to download files instead of opening them in the browser.

7. Linking to an External Application (e.g., WhatsApp Web)

<a href="https://wa.me/1234567890">Chat on WhatsApp</a>

• Redirects users to an external application or service.

Importance of Using URIs in Hyperlinks

1. Seamless Web Navigation: Allows users to move between different pages and
websites effortlessly.

2. Improved User Experience: Enables quick access to resources like documents,

images, and multimedia.

3. Enhanced Website Structure: Helps organize web pages and improve search engine
rankings (SEO).

4. Interactive Features: Supports email, phone calls, and app integration directly from
the browser.
5. Security Considerations: Properly formatted URIs prevent broken links and
potential security vulnerabilities, such as phishing attacks.
URIs are fundamental to the hyperlinked structure of the Internet, making websites more
accessible, interactive, and functional.
 Q.no:4 Set-I

Inserting an Image in an HTML Document and the Significance of the <address> Tag

The <img> tag in HTML allows web developers to display images on a webpage.
Meanwhile, the <address> tag provides a structured way to display contact details related to
the webpage author or organization. Both tags play an essential role in creating well-
structured, visually appealing, and accessible web pages.

Inserting an Image in an HTML Document

The <img> tag is a self-closing HTML element used to embed images. Unlike other
elements, it does not require a closing tag. The most important attribute of the <img> tag is
src, which specifies the source of the image file.
Basic Syntax:

<img src="image.jpg" alt="A description of the image">

• src: Defines the file path (relative or absolute URL) of the image.

• alt: Provides alternative text, which is displayed when the image fails to load and
improves accessibility for visually impaired users.

Examples:

1. Using a Image

<img src="images/photo.jpg" alt="Systech land">

• The image is stored in the images folder within the website's directory.

2. Using an Online Image

<img src="https://www.example.com/image.jpg" alt="An external image">
• Loads an image directly from an external website.

3. Adjusting Image Size

<img src="image.jpg" alt="Resized image" width="400" height="300">

• The width and height attributes adjust the image’s dimensions in pixels.

4. Making an Image Responsive

<img src="image.jpg" alt="Responsive image" style="max-width:100%; height:auto;">

• This ensures the image scales appropriately based on the screen size.

5. Using an Image as a Link

• <a href="https://systech.com">
• <img src="systechc.jpg" alt="Clickable image">
• </a>
 Clicking the image redirects the user to another webpage.

Significance of the <address> Tag

The <address> tag in HTML is used to define contact details for an individual, organization,
or website owner. It helps in structuring and displaying important contact information on a
webpage.

Basic Syntax:

• <address>
• Contact us at: <br>
• <a href="mailto:[email protected]">[email protected]</a><br>
• Phone: +1 234 567 890 <br>
• 123 Web Street, New York, NY, USA
• </address>

1. Semantic Meaning: The <address> tag provides semantic value, making it easier for
search engines and browsers to interpret contact details.

2. Default Styling: Browsers often render the <address> text in italic to indicate that it
contains contact information.

3. SEO Benefits: Search engines can use <address> to identify location and author
details, improving local search rankings.

4. Screen Reader Compatibility: It enhances accessibility by allowing screen readers

to recognize contact-related information easily.

Key Differences Between <img> and <address>

Feature <img> Tag <address> Tag

Purpose Displays images Provides contact information

Attributes src, alt, width, height No required attributes

Closing Tag Self-closing (<img />) Requires closing (</address>)

Semantic Meaning No inherent meaning; used for visuals Provides structured contact details

Both the <img> and <address> tags play a significant role in improving user experience,
accessibility, and SEO. Proper use of these elements helps create well-structured,
professional, and user-friendly web pages.
 Q.no:5 Set-I

Essential Elements of a Basic HTML Web Page and the Importance of the DOCTYPE
Declaration

When creating a basic HTML web page, certain fundamental elements must be included to
ensure proper structure, functionality, and accessibility. Additionally, the DOCTYPE
declaration plays a crucial role in defining how the browser interprets and displays the
content.

Key Elements of a Basic HTML Web Page

1. DOCTYPE Declaration (<!DOCTYPE html>)

The DOCTYPE declaration is the first line of an HTML document, defining the HTML
version being utilized.

<!DOCTYPE html>

This declaration ensures that the page is interpreted according to HTML5 standards, enabling
consistent behavior across different web browsers.
2. <html> Tag (Root Element)

The <html> tag encapsulates all content within the document.

• <html lang="en">

• The lang attribute specifies the language, aiding search engines and accessibility
tools.

3. <head> Section (Metadata & Links)

The <head> section contains essential metadata and links to external resources.

• <head>
• <meta charset="UTF-8">
• <meta name="viewport" content="width=device-width, initial-scale=1.0">
• <title>My First Web Page</title>
• </head>

• <meta charset="UTF-8"> ensures proper text encoding for different languages.

• <meta name="viewport"> makes the webpage mobile-friendly.

• <title> sets the page’s title, which appears in browser tabs and search engine results.

<body> Section (Content & Layout)

• The <body> section houses all visible content, including text, images, and
interactive elements.
• <body>
o <h1>Happy Website</h1>
o <p>is my first HTML page.</p>
o </body>
 • <h1> to <h6> define headings, organizing content hierarchically.

• <p> represents paragraphs, making the text more readable.

4. Hyperlinks & Images (<a> and <img> Tags)

• Hyperlinks allow users to navigate between pages:

• <a href="https://systech.com">Visit Systech</a>

• Images enhance the visual appeal of a webpage:

• <img src="image.jpg" alt=" Systech Image">

5. Semantic Structure (<header>, <main>, <footer>)

Using semantic elements improves webpage clarity and SEO performance.

• <header>
• <h1>My Website</h1>
• </header>
• <main>
• <p>Main content goes here.</p>
• </main>
• <footer>
• <p>Contact: info@ Systech.com</p>
• </footer>

• <header> typically contains branding and navigation links.

• <main> houses the primary content.

• <footer> often includes copyright information and contact details.

Importance of the DOCTYPE Declaration

The DOCTYPE declaration (<!DOCTYPE html>) is essential for web pages to function
properly. It serves the following purposes:

1. Ensures Proper Rendering

Without a DOCTYPE, browsers may switch to quirks mode, leading to inconsistent

rendering and unexpected styling issues.

2. Enables Standards Mode

Using <!DOCTYPE html> ensures that browsers follow W3C (World Wide Web
Consortium) standards, making the page behave consistently across different platforms.

3. Enhances Compatibility Across Browsers

Different browsers process HTML in slightly different ways. A DOCTYPE declaration
ensures that pages appear as intended on Chrome, Firefox, Safari, and Edge.
4. Improves SEO and Accessibility

• Search engines prefer well-structured pages, leading to better search rankings.

• Screen readers and assistive technologies work more effectively with properly
formatted HTML.

A well-structured HTML web page includes fundamental elements such as <!DOCTYPE

html>, <html>, <head>, <body>, and semantic tags like <header>, <main>, and <footer>.
The DOCTYPE declaration is crucial for maintaining consistent rendering across browsers,
preventing quirks mode, and ensuring proper SEO and accessibility. By following best
practices in HTML structure, developers can create efficient, user-friendly, and visually
appealing web pages.
 Q.no:6 Set-I

The Main Advantage of Using CSS in Web Development and Its Role in Separating
Content from Design

Cascading Style Sheets (CSS) is an essential technology in modern web development,

enabling developers to control the appearance and layout of web pages. The primary
advantage of using CSS is its ability to separate content from design, making websites more
maintainable, scalable, and visually appealing.

❖ Main Advantage of Using CSS

The biggest advantage of CSS is that it enhances the presentation and styling of web
pages while ensuring flexibility and reusability. It allows developers to:

1. Maintain Consistency Across Multiple Pages

o By defining styles in a single CSS file, multiple web pages can share the same
design, ensuring a uniform look across an entire website.
o Example: A company’s branding (colors, fonts, and layouts) can be applied
consistently across all pages.

2. Reduce Code Duplication and Improve Efficiency

o Without CSS, developers would need to repeat inline styling in multiple

locations, making code bulky and difficult to manage.

o CSS enables the use of external stylesheets, reducing redundancy and

enhancing efficiency.

3. Enhance User Experience (UX) with Responsive Design

o CSS allows web pages to adapt to different screen sizes using media queries,
ensuring that sites look good on desktops, tablets, and mobile devices.

o Example: A responsive website automatically adjusts fonts and layouts to fit

different screen resolutions.

4. Improve Website Performance and Load Time

o By using external CSS files, the browser can cache styles, reducing the need
to reload the same styling repeatedly, leading to faster page loading times.

❖ CSS Helps in Separating Content from Design

One of the most significant benefits of CSS is that it separates content (HTML) from design
(CSS). This separation is essential for several reasons:
1. Cleaner and More Readable Code

• HTML files focus on the structure and meaning of the content.

• CSS handles styling and layout, making both the HTML and CSS files easier to
manage.

• Example:

• <h1>Welcome Website</h1>

• <p>This is a sample paragraph.</p>

• h1 {

• color: blue;

• font-size: 24px;

• }

• p{

• font-family: Arial, sans-serif;

• line-height: 1.5;
• }

• This method avoids inline styling, making updates faster and more efficient.

2. Better Accessibility and SEO Optimization

• When content is separate from design, screen readers can read HTML without
interference from visual styles.

• Search engines can index content effectively, improving website ranking and
accessibility.

3. Easy Theming and Design Changes

• With CSS, changing the entire website’s look is simple by modifying one stylesheet,
rather than updating every HTML file individually.

• Example: Switching themes from light mode to dark mode can be done by applying
a different CSS file without altering HTML content.

CSS plays a crucial role in modern web development by enhancing design, improving
efficiency, and ensuring responsiveness. Its ability to separate content from design leads to
cleaner code, better maintainability, and greater accessibility. By leveraging CSS,
developers can create visually stunning and user-friendly websites that are easy to update and
scale.