Scribd
Upload
2 views

WebTech_50_Marks_Model_Answers

The document provides model answers for a 50 marks paper on web technology, covering core Internet protocols, HTML5 document structure, comparisons of static and dynamic websites, JavaScript data types, and the CSS box model. It includes medium answers on graphics in HTML5, XML data transformation, responsive design with Bootstrap, and JavaScript error handling. Additionally, it features long answers for creating a personal portfolio site and a user registration form using HTML5 and CSS3.

Uploaded by

Abhishek Shukla
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
2 views

WebTech_50_Marks_Model_Answers

The document provides model answers for a 50 marks paper on web technology, covering core Internet protocols, HTML5 document structure, comparisons of static and dynamic websites, JavaScript data types, and the CSS box model. It includes medium answers on graphics in HTML5, XML data transformation, responsive design with Bootstrap, and JavaScript error handling. Additionally, it features long answers for creating a personal portfolio site and a user registration form using HTML5 and CSS3.

Uploaded by

Abhishek Shukla
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/ 5

Web Technology: Model Answers for 50 Marks Paper

---

Section A: Short Answer (2 marks each)

1. What are the core Internet protocols used in web communication?

Core protocols include:

- HTTP/HTTPS - for transferring web content

- TCP/IP - for reliable data transmission

- DNS - for resolving domain names

- FTP - for file transfer

- SMTP/IMAP/POP3 - for email communication

2. List the key elements of an HTML5 document.

- <!DOCTYPE html> - Declaration

- <html> - Root element

- <head> - Metadata

- <title> - Title of the page

- <body> - Page content

3. Compare static and dynamic websites.

- Static websites show fixed content (HTML/CSS only)

- Dynamic websites change content based on user input or server-side logic (using PHP, JS, etc.)

4. What are JavaScript's data types, and how are they used?
- Primitive types: String, Number, Boolean, Null, Undefined, Symbol

- Non-primitive: Object, Array, Function

- Used to store and manipulate data in JS applications.

5. What is the CSS box model, and what properties does it include?

- It includes: Content, Padding, Border, Margin

- Determines space used by HTML elements and layout.

---

Section B: Medium Answer (5 marks each)

6. Compare the use of Canvas and SVG for graphics in HTML5.

- Canvas: Raster-based, ideal for dynamic graphics, pixel manipulation

- SVG: Vector-based, suitable for static graphics and animations

- Canvas is fast for real-time rendering (e.g., games), but not scalable.

- SVG scales well, better for accessibility and interactivity.

- SVG elements are part of the DOM, Canvas is not.

7. How do XML Schema, DOM, XSL, and XSLT transform XML data?

- XML Schema: Defines structure and data types

- DOM: Allows dynamic access/modification of XML data

- XSL: Styling language for XML

- XSLT: Transformation language to convert XML into HTML/other XML

- Together, they make XML data readable, usable, and displayable.

8. How does the Bootstrap grid system support responsive design?


- Uses a 12-column system

- Breakpoints like col-sm-, col-md-, col-lg-, etc.

- Enables layout adaptation across screen sizes

- Grid classes manage alignment, spacing, and structure

- Promotes mobile-first design

9. Explain JavaScript's try-catch error handling with an example.

It is used to handle runtime errors gracefully:

try {

let x = y + 1; // y is undefined

} catch (error) {

console.log("Error occurred:", error.message);

- try block runs the code

- catch block handles any error

- Prevents script from crashing unexpectedly

---

Section C: Long/Practical Answer (10 marks each)

10. Create a personal portfolio site using HTML5, CSS3, and Bootstrap.

- Use Bootstrap grid to structure sections

- HTML5 semantic tags: <header>, <nav>, <section>, <footer>

- Include About, Projects, Skills, Contact form

- Style with Bootstrap classes like container, row, col-md-4

- Add navigation bar, responsive images, and links


Sample snippet:

<div class="container">

<header class="text-center">

<h1>Abhishek Shukla</h1>

<p>Cybersecurity Enthusiast | Web Developer</p>

</header>

<section id="projects">

<h2>My Projects</h2>

<div class="row">

<div class="col-md-4">Project 1</div>

<div class="col-md-4">Project 2</div>

</div>

</section>

</div>

11. Develop a user registration form with HTML5 form elements and style it using CSS3.

- Use HTML5 inputs: type="text", email, password, date, submit

- Use CSS for spacing and layout

- Add form validation attributes like required, pattern

Example:

<form>

<input type="text" name="name" placeholder="Full Name" required><br>

<input type="email" name="email" placeholder="Email" required><br>

<input type="password" name="password" placeholder="Password" required><br>

<input type="date" name="dob"><br>


<input type="submit" value="Register">

</form>

CSS:

form input {

margin: 10px;

padding: 10px;

width: 250px;

- Adds form functionality, usability, and styling.

You might also like