Web Programming
D.A. 1
Name = Alok Maan
Reg. No. = 24BCB0057
Question 1:
DA-1 FOR ODD REGISTER NO - Health Camp Poster +
Contact Form (10 Marks)
Hospital conducts a “Free Health Camp”.
Design an HTML poster page with:
Poster image + caption (2)
Camp services listed using <ul> and timings in a small
<table> (4)
Contact form: name, phone, select “Service”, textarea
“Message” (3)
Footer with location link using <a> and © (1)
Answer :
<!DOCTYPE html>
<html>
<head>
<title>Free Health Camp</title>
</head>
<body>
<center>
<h1>Free Health Camp</h1>
<img src="/Users/alokmaan/Downloads/medical-camp-
logo-designs-health-service-clinic-hospital-
symbols_1093924-[Link]" alt="Health Camp"
width="300">
<p>Hospital is conducting a free health camp.</p>
</center>
<hr>
<h2>Camp Services</h2>
<ul>
<li>General Checkup</li>
<li>Blood Pressure Test</li>
<li>Diabetes Test</li>
<li>Doctor Consultation</li>
</ul>
<h2>Camp Timings</h2>
<table border="1">
<tr>
<th>Day</th>
<th>Time</th>
</tr>
<tr>
<td>Saturday</td>
<td>9:00 AM to 2:00 PM</td>
</tr>
<tr>
<td>Sunday</td>
<td>9:00 AM to 1:00 PM</td>
</tr>
</table>
<hr>
<h2>Contact Form</h2>
<form>
Name:<br>
<input type="text"><br><br>
Phone:<br>
<input type="text"><br><br>
Service:<br>
<select>
<option>General Checkup</option>
<option>BP Test</option>
<option>Diabetes Test</option>
<option>Consultation</option>
</select><br><br>
Message:<br>
<textarea rows="4" cols="25"></textarea><br><br>
<input type="submit" value="Send">
</form>
<hr>
<footer>
<p>
Location:
<a href="[Link] Hospital,
Vellore</a>
</p>
<p>© 2025 City Hospital</p>
</footer>
</body>
</html>
Output :
Question 2:
Workshop Poster + Code Demo Section (10 Marks)
A “Web Development Workshop” poster must show a
sample HTML code block.
Create a poster webpage containing:
Semantic layout: <header>, <nav>, <main>, <footer> (2)
Workshop description in <article> and “Trainer profile” in
<aside> (2)
One sample HTML snippet using <pre><code> (3)
Show a keyboard shortcut using <kbd> (e.g., Ctrl+S) and
output using <samp> (2)
Include < and > in text correctly (1)
Answer :
<!DOCTYPE html>
<html>
<head>
<title>Web Development Workshop</title>
</head>
<body>
<header>
<h1>Web Development Workshop</h1>
</header>
<nav>
<a href="#">Home</a> |
<a href="#">Register</a>
</nav>
<main>
<article>
<h2>Workshop Details</h2>
<p>
This workshop covers basic HTML tags like
<html> and <body>.
</p>
</article>
<aside>
<h3>Trainer</h3>
<p>Mr. Rahul (5 years experience)</p>
</aside>
<h3>Sample Code</h3>
<pre><code>
<html>
<body>
<h1>Hello World</h1>
</body>
</html>
</code></pre>
<p>
Save using <kbd>Ctrl + S</kbd><br>
Output: <samp>Hello World</samp>
</p>
</main>
<footer>
<p>© 2025 Web Workshop</p>
</footer>
</body>
Output :
</html>