0% found this document useful (0 votes)
7 views

HTML INTERVIEW QUESTIONS

The document contains a comprehensive list of HTML interview questions covering various topics such as the basics of HTML, structure and syntax, links and navigation, forms and inputs, tables, media elements, HTML5 features, accessibility, performance and SEO, and advanced topics. Each section includes key concepts and examples to illustrate the questions and answers. This resource serves as a guide for individuals preparing for HTML-related interviews.

Uploaded by

priyayadav822005
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
7 views

HTML INTERVIEW QUESTIONS

The document contains a comprehensive list of HTML interview questions covering various topics such as the basics of HTML, structure and syntax, links and navigation, forms and inputs, tables, media elements, HTML5 features, accessibility, performance and SEO, and advanced topics. Each section includes key concepts and examples to illustrate the questions and answers. This resource serves as a guide for individuals preparing for HTML-related interviews.

Uploaded by

priyayadav822005
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 6

HTML INTERVIEW QUESTIONS –

1. Basics of HTML

1. What is HTML, and why is it used?

o HTML (HyperText Markup Language) is a standard language used to create and


design the structure of web pages. It defines elements like headings, paragraphs,
links, and multimedia content.

2. What is the difference between HTML and XHTML?

o HTML is forgiving of errors (e.g., missing tags), while XHTML is stricter and follows
XML rules (e.g., every tag must be properly closed).

3. What is the purpose of the <!DOCTYPE> declaration?

o It informs the browser about the version of HTML being used to ensure proper
rendering.

4. What is the difference between block-level and inline elements?

o Block-level elements (e.g., <div>, <p>) take up the full width and start on a new line.
Inline elements (e.g., <span>, <a>) only take up as much width as necessary and do
not break the line.

5. What are void elements in HTML?

o Void elements are self-closing tags without content, like <img>, <input>, <br>.

2. Structure and Syntax

6. Explain the basic structure of an HTML document.

7. <!DOCTYPE html>

8. <html lang="en">

9. <head>

10. <meta charset="UTF-8">

11. <title>My Website</title>

12. </head>

13. <body>

14. <h1>Welcome!</h1>

15. </body>

16. </html>

17. What is the <head> element used for?


o It contains metadata, external file links (CSS, JavaScript), and the <title> tag.

18. What is the <meta> tag used for?

o Provides metadata, such as character set (<meta charset="UTF-8">) and viewport


settings for responsive design.

19. What is the lang attribute in <html>?

o Specifies the document's language for accessibility and SEO (e.g., <html lang="en">).

20. What is the difference between <strong> and <b>?

o <strong> indicates importance semantically, while <b> just makes text bold visually.

3. Links and Navigation

11. How do you create a hyperlink in HTML?

12. <a href="https://example.com" target="_blank">Visit Example</a>

o href: Specifies the link destination.

o target="_blank": Opens the link in a new tab.

13. What is the purpose of the <nav> element?

o Used to define navigation links in a semantic way.

14. What is the difference between absolute and relative URLs?

o Absolute URLs include the full web address (e.g., https://example.com/page), while
relative URLs depend on the current directory (e.g., page.html).

15. How do you link to an email address?

16. <a href="mailto:example@example.com">Email Us</a>

17. What is the role of the title attribute in a hyperlink?

o Provides additional information as a tooltip when the mouse hovers over the link.

4. Forms and Inputs

16. How do you create a form in HTML?

17. <form action="/submit" method="POST">

18. <input type="text" name="username" required>

19. <button type="submit">Submit</button>

20. </form>

21. What are the differences between GET and POST methods in forms?

o GET: Sends data in the URL query string, used for non-sensitive data.
o POST: Sends data in the HTTP body, suitable for sensitive data.

22. What are the new input types in HTML5?

o Examples include email, date, number, color, and range.

23. How do you make an input field mandatory?

24. <input type="text" name="username" required>

25. What is the placeholder attribute?

o Displays temporary text in an input field as a hint (e.g., <input placeholder="Enter


your name">).

5. Tables

21. How do you create a table in HTML?

22. <table>

23. <tr>

24. <th>Header 1</th>

25. <th>Header 2</th>

26. </tr>

27. <tr>

28. <td>Data 1</td>

29. <td>Data 2</td>

30. </tr>

31. </table>

32. What is the <caption> tag?

o Adds a descriptive title to a table.

33. What is the purpose of rowspan and colspan attributes?

o rowspan merges cells vertically, while colspan merges cells horizontally.

34. How do you style tables in HTML?

o Use CSS to apply styles (e.g., borders, background colors).

35. What is the <thead>, <tbody>, and <tfoot>?

o <thead>: Table header, <tbody>: Body content, <tfoot>: Footer content.

6. Media Elements
26. How do you embed an image in HTML?

27. <img src="image.jpg" alt="Description">

28. What is the purpose of the alt attribute?

o Provides alternative text for accessibility and SEO.

29. What is the <audio> tag?

30. <audio controls>

31. <source src="audio.mp3" type="audio/mpeg">

32. </audio>

33. How do you embed a video?

34. <video controls>

35. <source src="video.mp4" type="video/mp4">

36. </video>

37. What is the <figure> tag?

o Groups media with a caption using <figcaption>.

7. HTML5 Features

31. What is semantic HTML?

o Using tags like <article>, <section>, <header> for meaningful structure.

32. What is the <canvas> element?

o A container for graphics, drawn with JavaScript.

33. What is the <svg> element?

o For scalable vector graphics.

34. What are the <article> and <section> tags?

o <article> is for independent content, <section> is for thematic grouping.

35. What is the <progress> tag?

o Displays progress as a percentage or value.

8. Accessibility

36. What is ARIA in HTML?

o Accessible Rich Internet Applications, used to improve accessibility with attributes


like role.
37. What is the purpose of the <label> tag?

o Associates a label with an input for better accessibility.

38. What is the tabindex attribute?

o Specifies the tab order for elements.

39. What is the role attribute?

o Defines the role of an element (e.g., role="button").

40. What is the importance of semantic tags in accessibility?

o Helps screen readers and search engines understand the document structure.

9. Performance and SEO

41. What is lazy loading in HTML?

o Delays loading images or iframes using loading="lazy" to improve performance.

42. What is the <noscript> tag?

o Provides fallback content when JavaScript is disabled.

43. What is the purpose of the <base> tag?

o Sets a base URL for all relative links.

44. How does the <meta> description help SEO?

o Provides a summary of the page for search engine results.

45. How do you optimize images for performance?

o Use compressed formats like WebP and specify image dimensions.

10. Advanced Topics

46. What are custom data attributes?

47. <div data-id="123" data-name="example"></div>

48. What is the difference between <script> and <noscript>?

o <script> adds JavaScript, while <noscript> shows alternative content if JavaScript is


disabled.

49. How do you include external CSS and JavaScript?

o CSS: <link rel="stylesheet" href="style.css">

o JavaScript: <script src="script.js"></script>

50. What is the difference between inline, internal, and external CSS?
o Inline: Directly within elements; Internal: Within <style>; External: Separate file.

51. What is the purpose of the <template> tag?

o Holds reusable HTML fragments that are hidden until injected with JavaScript.

You might also like