Developer Q&A Portfolio

Demonstrating fundamental concepts through code and clear explanations.

View My Answers

HTML Questions & Answers

Question 1: Explain the basic structure of an HTML page. Why is it important to follow this structure? 

                
 <!DOCTYPE html>

                
This is the document type declaration. It's the very first thing in an HTML document and tells the browser which version of HTML to expect (in this case, HTML5). It is not an HTML tag, but an instruction.


                
<html>

                
This is the root element of the page. All other elements must be descendants of this tag. It typically includes the lang attribute to declare the language of the page content (e.g., <html lang="en">).


                
<head>

                
The header section contains meta-information about the HTML document that is not displayed directly on the page. Essential elements within <head> include:


                
<meta charset="UTF-8">

                
Specifies the character encoding, typically UTF-8, to handle most characters correctly.


                
<meta name="viewport" content="width=device-width, initial-scale=1.0">

                
Important for responsiveness on different devices.


                
<title>

                
Sets the title that appears in the browser tab or window title bar.


                
<link>
 
                
Used to link external resources, most commonly CSS stylesheets.


                
<script>

                
Can be used to include JavaScript (often placed near the closing </body> as well for performance).


                
<body>

                
The body section contains the visible page content. This includes all the text, images, links, tables, and other elements that a user sees and interacts with. This is where you put your main content elements like...
  • headings
  • paragraphs
  • images
  • links
  • divisions
  • script.... many others
Question 2: You’re building a small personal profile page. Which HTML tags will you use to highlight your name as a heading, describe yourself in a paragraph, and emphasize a key skill?

Ali Hossin Paik

To highlight my name as a heading, I would use one of the heading tags, typically <h1> for the main heading.

I'm Ali Hossin Pik, a dedicated learner based in Dakshin Barasat, West Bengal. Having completed my H.S. in 2019, I’m currently focused on mastering the Full Stack Development (FSD) course at PW Skills. My core drive is to continually explore new technologies and skills. While I enjoy diving deep into new things, my true passion and current sole hobby is coding — reflecting my commitment to building a strong technical foundation.

🧠 Key Skills

HTML & CSS Google Apps Script Excel Automation Accounting Systems Problem Solving Self Learning
Question 3: Look at the code below. Can you find and fix the mistake?
<!-- This is an HTML comment-- 

                <h1>Welcome to my website</h1> 

                    
The mistake in the code is in the HTML comment syntax. The correct syntax for an HTML comment is <!-- comment text -->. The closing part of the comment is missing the exclamation mark. Here is the corrected code:

                    <!-- This is an HTML comment -->
Question 4: You’re creating a form that asks the user to enter their name, select their country from a list, and click a button to submit. Write the HTML code for this. 

                        <form action="/submit" method="post">
                            <label for="name">Name:</label>
                            <input type="text" id="name" name="name" placeholder="type your full name" required><br><br>
                            <label for="country">Country:</label>
                            <select id="country" name="country" placeholder="select" required>
                                <option value="" disabled selected>Select your country</option>
                                <option value="usa">United States</option>
                                <option value="uk">United Kingdom</option>
                                <option value="canada">Canada</option>
                                <option value="australia">Australia</option>
                                <option value="india">India</option>
                            </select><br><br>
                            <button type="submit">Submit</button>
                        </form>

form output



Question 5: Write short HTML code to show your favorite fruits in a bulleted list and your top 3 programming languages in a numbered list. 

                    <h2>My Favorite Fruits</h2>
                    <ul>
                    <li>Mango</li>
                    <li>Banana</li>
                    <li>Apple</li>
                    <li>Orange</li>
                    <li>Grapes</li>
                    </ul>

code output

My Favorite Fruits

  • Mango
  • Banana
  • Apple
  • Orange
  • Grapes

code space



                    <h2>Top 3 Programming Languages</h2>
                    <ol>
                    <li>JavaScript</li>
                    <li>Python</li>
                    <li>Java</li>
                    </ol>

code output

Top 3 Programming Languages

  1. JavaScript
  2. Python
  3. Java
Question 6: Ravi wants to leave a note in his HTML file so that only other developers can see it, not the users on the website. How should he do this? Why are such notes useful?

Ravi can leave a note in his HTML file by using HTML comments. HTML comments are not displayed in the browser when the page is rendered, making them ideal for leaving notes for other developers. The syntax for an HTML comment is as follows:

<!-- This is a comment -->

Such notes are useful for several reasons:

  • Code Explanation: Comments can explain the purpose of certain sections of code, making it easier for other developers (or even the original developer at a later time) to understand the logic and functionality.
  • Collaboration: In team environments, comments help communicate ideas, intentions, or reminders to other team members working on the same codebase.
  • Debugging: Developers can use comments to temporarily disable parts of the code during debugging without deleting them.
  • Documentation: Comments can serve as inline documentation, providing context about how certain features are implemented or why specific decisions were made.
Question 7: Here’s a form snippet. Can you spot the error and rewrite the correct version? 

                        <form>
                        <input name="email">
                        <select>
                        <option>India</option>
                        </select>
                        <button>Send</buton>
                        </form>

The errors in the provided form snippet are fixed follows:

Here is the corrected version of the form snippet with the necessary fixes applied:

code space


                        <form>
                        <label for="email">Email:</label>   <!-- Added label for better accessibility -->
                        <input type="email" id="email" name="email" placeholder="your email addres" required> <br>    <!-- Added type attribute and required attribute -->
                        <label for ="country">country:</label>   <!-- Added label for better accessibility -->
                        <select name="country" required>  <!-- Added name attribute and required attribute --> <br>
                        <option value="india">India</option><!-- Added value attribute and it's better to add multiple country-->
                        <option value="usa">usa<option>
                        <option value="chaina">chaina<option>  
                        </select> <br>
                        <button type="submit">Send</button>     <!-- Corrected closing tag -->
                        </form>

code output



View My GitHub