HTML INTERVIEW QUESTIONS
1. What does HTML stand for?
● HTML stands for Hypertext Markup Language.
2. What is the use of HTML?
● HTML is the standard markup language it is used for creating Web
pages , HTML is used to create the structure and content of web
pages . It consists of a series of elements. HTML elements tell the
browser how to display the content .
3. What are the different versions of HTML?
● HTML, HTML 4.01, XHTML, HTML5.
4. What is the latest version of HTML?
● HTML5.
5. What are tags in HTML?
● Tags are the fundamental building blocks of HTML. Almost all tags
contain two parts, an opening, and a closing tag.
6. What is an element in HTML?
● An element consists of an opening tag, content, and a closing tag, if
applicable.
7. What is an attribute in HTML?
● An attribute provides additional information about an element and is
defined within the opening tag.
8. What is the purpose of a DOCTYPE declaration?
● It specifies the version of HTML used in the document to the browser.
9. What is the structure of an HTML document?
<!DOCTYPE html>
<html>
<head>
</head>
<body>
</body>
</html>
[Link] is the purpose of the <head> tag in HTML?
● It contains meta-information about the HTML document, such as the
title, character set, and CSS or JavaScript links.
HTML Tags:
[Link] the <div> tag in HTML.
● It is a block-level element used to group content and apply styles.
[Link] the <span> tag in HTML.
● It is an inline element used to apply styles to a specific part of the text.
[Link] is the purpose of the <p> tag?
● It defines a paragraph.
[Link] do you create headings in HTML?
● Using <h1> to <h6> tags.
[Link] the <a> tag and its attributes.
● It creates hyperlinks. Attributes include href, target, and title.
[Link] do you create a hyperlink in HTML?
● Using the <a> tag with the href attribute.
[Link] is the difference between absolute and relative URLs?
● Absolute URLs include the full path, while relative URLs specify the path
relative to the current page.
[Link] do you create an image in HTML?
● Using the <img> tag with the src attribute.
[Link] the <img> tag and its attributes.
● It embeds images. Attributes include src, alt, width, and height.
[Link] is the purpose of the <alt> attribute in the <img> tag?
● It specifies alternative text for the image, which is displayed if the image
fails to load.
[Link] do you create a line break in HTML?
● Using the <br> tag.
[Link] the <br> tag.
● It inserts a line break in the text.
[Link] do you create a horizontal line in HTML?
● Using the <hr> tag.
[Link] the <hr> tag.
● It creates a horizontal rule or line.
[Link] is the purpose of the <strong> and <em> tags?
● <strong> is used to highlight important text, and <em> is used for
emphasizing text.
[Link] is the <blockquote> tag used for?
● It indicates that the enclosed text is a longer quotation.
[Link] do you create a list in HTML?
● Using <ul> for unordered lists and <ol> for ordered lists.
[Link] the <ul> and <ol> tags.
● <ul> creates an unordered list, and <ol> creates an ordered list.
[Link] do you create a table in HTML?
● Using the <table>, <tr>, <td>, and <th> tags.
[Link] the <table>, <tr>, <td>, and <th> tags.
● <table> defines a table, <tr> defines a row, <td> defines a cell, and <th>
defines a header cell.
Forms:
[Link] is the purpose of the <form> tag?
● It defines an HTML form to collect user input.
[Link] do you create a form in HTML?
● Using the <form> tag.
[Link] the <input> tag and its types.
● <input> creates form controls. Types include text, password, checkbox,
radio, etc.
[Link] is the difference between the GET and POST methods?
● GET appends form data to the URL, while POST sends data in the request
body.
[Link] do you create a text input field?
● <input type="text">
[Link] do you create a password input field?
● <input type="password">
[Link] do you create a checkbox?
● <input type="checkbox">
[Link] do you create a radio button?
● <input type="radio">
[Link] do you create a dropdown list?
● Using the <select> and <option> tags.
[Link] do you create a submit button?
● <input type="submit">
[Link] do you create a reset button?
● <input type="reset">
[Link] is the purpose of the <label> tag?
● It defines a label for an input element.
[Link] do you associate a label with an input field?
● By using the for attribute in <label> and the id attribute in the
corresponding input field.
[Link] the <textarea> tag.
● It creates a multiline text input field.
Semantic HTML:
[Link] is semantic HTML?
● It is using HTML tags that convey meaning about the content they
contain.
[Link] is semantic HTML important?
● It improves accessibility, search engine optimization, and code
readability.
[Link] examples of semantic HTML tags.
● <header>, <footer>, <nav>, <article>, <section>, <aside>, <main>.
[Link] the <header> and <footer> tags.
● <header> represents introductory content or a group of navigational
links. <footer> represents a footer for its nearest section.
[Link] the <nav> tag.
● It defines navigation links.
[Link] is the purpose of the <article> tag?
● It defines an independent, self-contained content.
[Link] is the purpose of the <section> tag?
● It defines a thematic grouping of content.
[Link] is the purpose of the <aside> tag?
● It represents content aside from the content it is placed in.
[Link] the <main> tag.
● It represents the main content of the document.
[Link] do you create a semantic HTML5 document structure?
● By using <header>, <nav>, <main>, <section>, <article>, <aside>, and
<footer> tags appropriately.
HTML5 Features:
[Link] are the new features introduced in HTML5?
● Canvas, audio/video elements, local storage, geolocation, semantic
elements, etc.
[Link] the <canvas> tag.
● It is used to draw graphics using JavaScript.
[Link] is the purpose of the <audio> and <video> tags?
● They are used to embed audio and video content, respectively.
[Link] do you embed audio and video in HTML5?
● Using the <audio> and <video> tags with the src attribute.
[Link] is the purpose of the <details> and <summary> tags?
● They are used to create collapsible content sections.
[Link] the <figure> and <figcaption> tags.
● <figure> is used to group media content, and <figcaption> provides a
caption for the content.
[Link] is the purpose of the <progress> tag?
● It represents the progress of a task.
[Link] do you create a progress bar in HTML5?
● Using the <progress> tag with the value attribute.
[Link] is the purpose of the <meter> tag?
● It represents a scalar measurement within a known range.
[Link] do you create a meter in HTML5?
● Using the <meter> tag with the value and min/max attributes.
[Link] is the purpose of the <datalist> tag?
● It provides a list of predefined options for input elements.
[Link] do you create a datalist in HTML5?
● Using the <datalist> tag with <option> child elements.
Accessibility:
[Link] is web accessibility?
● Web accessibility ensures that websites and web applications are usable
by people with disabilities.
[Link] is web accessibility important?
● It ensures equal access to information and services for everyone.
[Link] are some common accessibility features in HTML?
● Providing alt attributes for images, using semantic HTML elements,
creating accessible forms, etc.
[Link] do you create accessible forms?
● By using appropriate labels, providing instructions, and ensuring proper
tab order.
[Link] is the purpose of the alt attribute in the <img> tag?
● It provides alternative text for images for accessibility and when the
image fails to load.
[Link] do you ensure images are accessible to screen readers?
● By providing descriptive alt attributes for images.
[Link] do you create accessible tables?
● By using appropriate table headers (<th>), captions (<caption>), and
summary attributes.
[Link] is the purpose of the <title> tag?
● It defines the title of the HTML document, which appears in the browser's
title bar or tab.
[Link] do you create accessible links?
● By using descriptive link text and avoiding generic phrases like "click
here."
Meta Tags and SEO:
[Link] is the purpose of the <meta> tag?
● It provides metadata about the HTML document, such as character
encoding, viewport settings, and SEO information.
[Link] do you specify the character encoding in HTML?
● By using the charset attribute in the <meta> tag within the <head>
section.
[Link] is the viewport meta tag used for?
● It controls the layout and scaling of the viewport on mobile browsers.
[Link] do you specify keywords and descriptions for SEO?
● By using the keywords and description meta tags.
[Link] is the purpose of the robots meta tag?
● It instructs search engine crawlers on how to index and display the page
content.
[Link] do you specify the canonical URL?
● By using the rel="canonical" attribute in the <link> tag.
[Link] is microdata and how is it used for SEO?
● Microdata is a way to provide additional context about the content on a
web page, which can improve SEO.
[Link] are rich snippets?
● They are enhanced search results displayed by search engines, often
including additional information like ratings and reviews.
Responsive Web Design:
[Link] is responsive web design?
● It is an approach to designing websites that adapt to different screen
sizes and devices.
[Link] do you make a website responsive?
● By using fluid grids, flexible images, and media queries.
[Link] is a media query?
● It is a CSS technique used to apply different styles based on the device's
characteristics.
[Link] do you use media queries in CSS?
● By specifying conditions within @media rules to apply styles based on
viewport size, resolution, etc.
[Link] is a mobile-first approach in responsive design?
● It involves designing for mobile devices first and then scaling up for
larger screens.
[Link] is the purpose of the viewport meta tag in responsive design?
● It controls the layout viewport's dimensions and scaling on mobile
devices.
[Link] do you create flexible layouts using CSS?
● By using percentage-based widths, max-width properties, and flexible
units like ems or rems.
Cross-Browser Compatibility:
[Link] is cross-browser compatibility?
● It ensures that a website or web application works correctly across
different web browsers.
[Link] is cross-browser compatibility important?
● It ensures a consistent user experience for all visitors regardless of the
browser they use.
[Link] are some common issues with cross-browser compatibility?
● Differences in rendering, CSS support, JavaScript behavior, etc.
[Link] do you ensure your website works well in different browsers?
● By testing in multiple browsers, using feature detection, and applying
CSS resets.
[Link] tools can you use to test cross-browser compatibility?
● Browser developer tools, online testing platforms, and virtual machines.
Performance Optimization:
[Link] is website performance optimization?
● It involves improving a website's speed and efficiency.
[Link] do you optimize images for the web?
● By using the appropriate file format, resizing and compressing images,
and lazy loading.
[Link] are CSS sprites?
● They are a technique for combining multiple images into a single image
to reduce HTTP requests.
[Link] is lazy loading?
● It defers the loading of non-essential resources, such as images, until
they are needed.
100. How do you minimize HTTP requests?
- By combining files, using CSS sprites, and reducing unnecessary scripts and
stylesheets.
