HTML Interview Questions and Answers [Latest]

HTML programming Interview Questions for beginners/experienced professionals from Codingcompiler. These HTML programming interview questions were asked in various interviews conducted by top multinational companies across the globe. We hope that these interview questions  will help you in cracking your next HTML job interview. All the best and happy learning.

HTML Interview Questions

  1. What is HTML?
  2. Write an Example Program of HTML?
  3. Explain about the tags in HTML in brief?
  4. Do all html tags have an end tag?
  5. What is HTML5?
  6. What is Anchor tag and how can you open an URL into a new tab when clicked?
  7. Define Semantic elements in HTML.
  8. Define attributes in HTML tag.
  9. What are Attributes and how do you use them?
  10. When are comments used in HTML?
  11. What are the HTML tags used to display the data in the tabular form?
  12. Name some common lists that are used when designing a page.
  13. What Would Happen If The HTML Document Does Not Contain <!DOCTYPE>?
  14. What Is The Difference Between HTML Elements And Tags?
  15. Explian the new Features included in HTML5?
  16. What Are The Various Elements Provided By HTML5 For Media Content?
  17. What is a physical tag and logical tag in HTML?
  18. What is a nest in HTML?
  19. What is XHTML?
  20. What is Cell Spacing and Cell Padding?
  21. What browsers support HTML5?
  22. How to change the font colour in the HTML page?
  23. What is the Marquee tag?
  24. How to create an email enable text on the web page?
  25. What are applets?
  26. Applets program are written in which language?
  27. What is Longdesc in HTML?
  28. write a html code to build a table?
  29. What is Semantic HTML?
  30. Why are some characters often displayed as boxes?
  31. What’s the difference between ‘block’ and ‘inline’ elements?
  32. What is SVG element?
  33. What is a picture diagram?
  34. How change the font size in html?
  35. Why doesn’t <TABLE WIDTH=”100%”> use the full browser width?
  36. How would you automatically transfer your visitors to a new web page?
  37. What is a <dl> tag in HTML?
  38. What is difference between HTML and HTML5?
  39. What are the different types of entities in HTML?
  40. What are Web Standards?

—-

Basic HTML Interview Questions And Answers

1. What is HTML?
Answer:

HTML stands for Hyper Text Markup Language. It is a language of World Wide Web. It is a standard text formatting language which is used to create and display pages on the Web. It makes the text more interactive and dynamic. It can turn text into images, tables, links.

  • Hyper Text: HyperText simply means “Text within Text.” A text has a link within it, is a hypertext. Whenever you click on a link which brings you to a new webpage, you have clicked on a hypertext. HyperText is a way to link two or more web pages (HTML documents) with each other.
  • Markup language: A markup language is a computer language that is used to apply layout and formatting conventions to a text document. Markup language makes text more interactive and dynamic. It can turn text into images, tables, links, etc.
  • Web Page: A web page is a document which is commonly written in HTML and translated by a web browser. A web page can be identified by entering an URL. A Web page can be of the static or dynamic type. With the help of HTML only, we can create static web pages.

Hence, HTML is a markup language which is used for creating attractive web pages with the help of styling, and which looks in a nice format on a web browser. An HTML document is made of many HTML tags and each HTML tag contains different content.

2. Write an Example Program/basic structure of HTML?

Ans. 

  • <!DOCTYPE>  
  • <html>  
  • <head>  
  • <title>Web page title</title>  
  • </head>  
  • <body>  
  • <h1>Write Your First Heading</h1>  
  • <p>Write Your First Paragraph.</p>  
  • </body>  
  • </html>  

3. Explain about the tags in HTML in brief?

Ans. HTML tags are composed of three things: an opening tag, content and ending tag. Some tags are unclosed tags.

  1. <!DOCTYPE>: It defines the document type or it instruct the browser about the version of HTML.
  2. <html > :This tag informs the browser that it is an HTML document. Text between html tag describes the web document. It is a container for all other elements of HTML except <!DOCTYPE>
  3. <head>: It should be the first element inside the <html> element, which contains the metadata(information about the document). It must be closed before the body tag opens.
  4. <title>: As its name suggested, it is used to add title of that HTML page which appears at the top of the browser window. It must be placed inside the head tag and should close immediately. (Optional)
  5. <body> : Text between body tag describes the body content of the page that is visible to the end user. This tag contains the main content of the HTML document.
  6. <h1> : Text between <h1> tag describes the first level heading of the webpage.
  7. <p> : Text between <p> tag describes the paragraph of the webpage.

4. Do all html tags have an end tag?

Ans. No, Only some tags are having closing tags.

Example: 
1. <image>
2. <br>

5. What is HTML5?

Ans: HTML5 is the latest or updated version of markup language that defines HTML.

6. What is Anchor tag and how can you open an URL into a new tab when clicked?

Ans: Anchor tag in HTML is used for linking between two sections or two different web pages or website templates.

To open an url into a new tab in the browser upon a click, we need to add target attribute equal to blank.

<a href=”#” target=”blank”></a>

# = Link to be Given

blank = text to which hyperlink is given(Anchor text)

[Related Article: 11 The Best HTML Editors 2020]

7. Define Semantic elements in HTML.

Ans: Semantic elements are HTML elements which represent its meaning to the browser and developer about its contents.

For Example – p tag represents a paragraph, a tag represents anchor tag, form tag, table tag, article tag and many more are semantic elements in HTML. Whereas div tag, span tag, bold tag are not semantic elements.

8. Define attributes in HTML tag.

Ans: The HTML tag contains a field inside their tag which is called attributes of that tag.

For Example:

  • <img src=”#”> here in this tag src is img tag attributes.
  • <input type=” text”> here in this tag type is input tag attributes.

9. What are Attributes and how do you use them?

Answer:
Each tag has additional attributes that change the way the tag behaves or is displayed. For example, a <input> tag has a type attribute, which you can use to specify whether it’s a text field, checkbox, radio button or one of many more options.

Attributes are specified directly after the name of the tag, inside the two angled brackets. They should only ever appear in opening tags or in self-closing tags. But, they can never be in closing tags.

Example:

  • <!– Text field –>
  • <input type=”text” />
  • <!– Checkbox –>
  • <input type=”checkbox” />
  • <!– Radio button –>
  • <input type=”radio” value=”on” />

10. When are comments used in HTML?

Ans. To understand the code easily, you can add code comments to your HTML document. These are not displayed in the browser, but they help you in leaving notes for yourself and other developers as to what a section of HTML is for. The start of the comment is denoted by <!– and the end is marked by — >. Anything in the middle will be completely ignored, even if it contains valid HTML.

For example:

  • <!– This is a comment! –>
  • <!– Comments can span multiple lines too –>
  • <!– This part is ignored in the browser →

—-

Advanced HTML Interview Questions and Answers

11. What are the HTML tags used to display the data in the tabular form?

The list of HTML tags used to display data in the tabular form include:

TagDecsription
<table>It defines a table
<tr>This tag defines a row in a table
<th>It defines a header cell in a table
<td>This is used to define a cell in a table
<caption>It defines the table caption
<colgroup>It specifies a group of one or more columns in a table for formatting
<col>This is used with <colgroup> element to specify column properties for each column

12. Name some common lists that are used when designing a page.

Ans. There are many common lists used for design a page. You can choose any or a combination of the following list types:

  • Ordered list – The ordered list displays elements in a numbered format. It is represented by <ol> tag.
  • Unordered list – The unordered list displays elements in a bulleted format. It is represented by <ul> tag.
  • Definition list – The definition list displays elements in definition form like in a dictionary. 

The <dl>, <dt> and <dd> tags are used to define description list.

13. What Would Happen If The HTML Document Does Not Contain <!DOCTYPE>?

Answer.

It instructs the Web Browser about the version of HTML used for creating the Web page.

If the developer misses declaring the DOCTYPE information in the code, then new features and tags provided by HTML5, like <article>, <footer>, and <header> will not be supported. Additionally, the Browser may automatically go into Quirks or Strict Mode.

14. What Is The Difference Between HTML Elements And Tags?

Answer.

HTML elements communicate to the Browser how to represent the text. They become HTML tags when enclosed within angular brackets <>.

15. Explian the new Features included in HTML5?

Ans.
HTML5 introduces a number of new elements and attributes that help in building an attractive webSite, that we see nowadays.

It supports following new features.

  1. New Semantic Elements – These are like <header>, <footer>, and <section>.
  2. Forms 2.0 – It contains improvements to HTML web forms. It has introduced new attributes for the <input> tag.
  3. Persistent Local Storage – With HTML5, it is possible to achieve this, without resorting to third-party plugins.
  4. WebSocket – It facilitates setting up a bidirectional communication for web applications.
  5. Server-Sent Events(SSE) – These events got introduced in HTML5. The direction of the flow of the execution of these events is from the server to the Web Browser.
  6. Canvas – It supports a two-dimensional drawing surface that is programmable using JavaScript.
  7. Audio & Video – It allows embedding audio or video on the web pages without resorting to third-party plugins.
  8. Geolocation – It facilitates the visitors to share their physical location with the web application.
  9. Microdata – It allows building our personal vocabulary beyond HTML5 and extends our web pages with those custom semantics.
  10. Drag and drop – It supports to Drag and drop the items from one location to another location on the same Web page.

16. What Are The Various Elements Provided By HTML5 For Media Content?

Answer.

HTML provides the support of following elements for representing the media content.

  • <audio> – It defines the sound content.
  • <video> – It represents the video content that needs to be attached to a Web page.
  • <source> – This tag defines the source of video and audio.
  • <embed > – It provides a container for an external application.
  • <track> – It defines text tracks for video and audio.

17. What is a physical tag and logical tag in HTML?

Ans:
A Physical tag has physical text which is used to tell the browser how to display the text enclosed in the physical tag.

Example for the physical tags are: <big>, <b>, <i>

Logical tags are used to tell the meaning of the enclosed text in it. The example of the logical tag is <Important>….</Important> tag. When we enclose text in Important tag then it tell the browser that enclosed text is more important than other text.

18. What is a nest in HTML?

If you go and have a look at HTML markup for any webpage today, you will let to know that HTML elements are contained within other HTML elements. These elements which are inside of other are known as nested elements and they had become the essential part of building any web page nowadays. The most expertise way to know more about nesting is just to think about HTML tags in the form of boxes that hold your content which can be in form of text, images,etc.HTML tags are basically the boxes around the content.

19. What is XHTML?

Ans. XHTML stands for EXtensible HyperText Markup Language. eXtensible HyperText Markup Language is part of the family of XML markup languages. It mirrors or extends versions of the widely used HyperText Markup Language, the language in which Web pages are formulated. XHTML is almost identical to HTML. XHTML is stricter than HTML. XHTML is HTML defined as an XML application. XHTML is supported by all major browsers.

20. What is Cell Spacing and Cell Padding?

Cell Spacing is referred to space/gap between the two cells of the same table.

Cell Padding is referred to the gap/space between the content of the cell and cell wall or Cell border.

(or)

Cell spacing is one also used f formatting but there is a major difference between cell padding and cell spacing. It is as follows: Cell padding is used to set extra space which is used to separate cell walls from their contents. But in contrast cell spacing is used to set space between cells.

Example:

  • <table border cellspacing=3>
  • <table border cellpadding=3>
  • <table border cellspacing=3 cellpadding=3>

—-

Most Frequently Asked HTML Interview Questions

21. What browsers support HTML5?

All modern browsers support HTML5, however some older browsers do not. Luckily, most browsers will simply handle the new elements as inline elements. You can then use CSS to change certain elements to be displayed as block-level elements where needed.

22. How to change the font colour in the HTML page?

Answer:

we can give this command for changing the font color

<font color=”color”>…</font>

23. What is the Marquee tag?

Answer:

For the scrolling text, we use a marquee tag. For Eg: <marquee>text</marquee>

24. How to create an email enable text on the web page?

Answer:

For email enable text you have to write the following command in the web page. <a href=”mailto:emailaddress”>text to be clicked</a>

25. What are applets?

Answer:

This is the frequently asked HTML Interview Questions in an HTML Interview. Applets are the small program which can be embedded with the web pages to perform some specific functionality like computation, animation.

24. Applets program are written in which language?

Answer:

Java

25. What is Longdesc in HTML?

Answer:

Longdesc is an attribute that allows you to provide a Link to another page that contains a description of the frame contents. For example longdesc=”framedescription.html”.

26. write a html code to build a table?

Ans:

By using <table> tag we create the table in HTML. For eg. If you want to create the table with 3 rows and 3 columns:

  • <table style=”width:100%”>
  • <tr>
  • <th>Firstname</th>
  • <th>Lastname</th>
  • <th>Age</th>
  • </tr>
  • <tr>
  • <td>Hai</td>
  • <td>Smith</td>
  • <td>50</td>
  • </tr>
  • <tr>
  • <td>Hello</td>
  • <td>Jackson</td>
  • <td>94</td>
  • </tr>
  • <tr>
  • <td>Hmm</td>
  • <td>Doe</td>
  • <td>80</td>
  • </tr>
  • <table>

27. What is Semantic HTML?

Semantic HTML is a coding style where the tags embody what the text is meant to convey. In Semantic HTML, tags like for bold, and for italic should not be used, reason being they just represent formatting, and provide no indication of meaning or structure. The semantically correct thing to do is use and . These tags will have the same bold and italic effects, while demonstrating meaning and structure (emphasis in this case).

28. Why are some characters often displayed as boxes?

This is quite an often occurrence – this happens because some certain characters might not be supported by the web browser that your operating system is running.

29. What’s the difference between ‘block’ and ‘inline’ elements?

Block elements are programmed so that they would take up as much space as possible. As opposed to that, inline elements are designed to take up a very minimal amount of space.

30. What is SVG element?

Answer:

 SVG is followed by the XML format; It has scalable vector graphics used to create vector graphics with interactive and animated support. Resolution is independent of SVG because it does not lose its size or rearrange its quality.

—-

HTML Interview Questions and For Experienced

31. What is a picture diagram?

Answer: Image Map allows you to connect to various web pages using a single image. You can define the forms of images that you want to make part of the map mapping.

32. How change the font size in html?

Ans: 

In HTML, you can change the size of text with the <font> tag using the size attribute. The size attribute specifies how large a font will be displayed in either relative or absolute terms. Close the <font> tag with </font> to return to a normal text size.

33. Why doesn’t <TABLE WIDTH=”100%”> use the full browser width?

Ans: 

  • This is because the graphical browser is designed to leave a margin between the display area and actual content.
  • The navigator also leaves some space for the scroll bar on the right side of the display area. Though, if the page is not long enough, the scroll bar doesn’t appear.

34. How would you automatically transfer your visitors to a new web page?

Ans:

– You can do it with the help of meta tag mentioned below:

<META HTTP-EQUIV=”Refresh” CONTENT=”2″; URL=”https://www.yourname.com”>
– Place this tag between <HEAD></HEAD>
– It will load yousite.com in 2 seconds.

35. What is a <dl> tag in HTML?

Ans:

– <dl> is a definition list tag used in HTML.
– It is used with <dt> and <dd>.
– <dt> list the item while <dd> describes it.

36. What is difference between HTML and HTML5?

The differences between HTML and HTML5 are:

1. Document of HTML is very large as compare to the HTML5.
2. Audio and Video tags are not present in HTML whereas HTML5 contains audio and video tags.
3. Vector technology is not integral part of HTML whereas HTML5 Vector technology is the integral part of it.
4. HTML supported by all old browsers whereas HTML5 is supported by new browser.
5. In HTML web sockets are not available whereas in HTML5 Full duplex communication channel is present.

37. What are the different types of entities in HTML?

The different types of entities that are present in HTML are < (less than) or > (greater then). It allows the special or the reserved characters are matched with the source code and then it is saved.

The sample code is being given by:

&entity_name;
OR
&#entity_number;

There is always a concept associated with it that will create more simpler provision to avoid the spaces that are being coming in between the characters or the text.

38. What are Web Standards?

Answer:

  • Web standards are rules and guidelines established by the World Wide Web Consortium (W3C).
  • Web standards are developed to promote consistency in the design code of a web page.
  • It is the guideline for the mark-up language which determines how a web page displays in a visitor’s browser window.
  • W3C (World Wide Web Consortium) standards promote the use of “Cascading Style Sheets” (CSS) or design code which is attached to the web page rather than embedded in the page.
  • Search Engines are able to access and index pages designed to web standards with greater efficiency.

39. Can I nest tables within tables?

Answer:

Yes, a table can be embedded inside a cell in another table. Here’s a simple example:

<table>
<tr>
<td>this is the first cell of the outer table</td>
<td>this is the second cell of the outer table,
with the inner table embedded in it
<table>
<tr>
<td>this is the first cell of the inner table</td>
<td>this is the second cell of the inner table</td>
</tr>
</table>
</td>
</tr>
</table>

The main caveat about nested tables is that older versions of Netscape Navigator have problems with them if you don’t explicitly close your TR, TD, and TH elements. To avoid problems, include every </tr>, </td>, and </th> tag, even though the HTML specifications don’t require them. Also, older versions of Netscape Navigator have problems with tables that are nested extremely deeply (e.g., tables nested ten deep). To avoid problems, avoid nesting tables more than a few deep. You may be able to use the ROWSPAN and COLSPAN attributes to minimize table nesting. Finally, be especially sure to validate your markup whenever you use nested tables.

40. Do I have to memorize a bunch of tags?

Answer:

No. Most programs that help you write HTML code already know most tags, and create them when you press a button. But you should understand what a tag is, and how it works. That way you can correct errors in your page more easily.

RELATED INTERVIEW QUESTIONS

  1. Core Java Interview Questions
  2. JSF Interview Questions
  3. JSP Interview Questions
  4. JPA Interview Questions
  5. Spring Framework Interview Questions
  6. Spring Boot Interview Questions
  7. Core Java Multiple Choice Questions
  8. 60 Java MCQ Questions And Answers
  9. Aricent Java Interview Questions
  10. Accenture Java Interview Questions
  11. Advanced Java Interview Questions For 5 8 10 Years Experienced
  12. Core Java Interview Questions For Experienced
  13. GIT Interview Questions And Answers
  14. Network Security Interview Questions
  15. CheckPoint Interview Questions
  16. Page Object Model Interview Questions
  17. Apache Pig Interview Questions
  18. Python Interview Questions And Answers
  19. Peoplesoft Integration Broker Interview Questions
  20. PeopleSoft Application Engine Interview Questions


Leave a Comment