TOP HTML5 Interview Questions and Answers in 2021

HTML5 is the newest and the latest version of the Hyper Text Markup Language in short known as HTML. It is used to create web pages which you see all over the internet, that’s the beauty of HTML. In this page, we will provide you HTML5 Interview Questions and Answers which will help you clear interviews or you can ask these questions to the open position in your company.

html5 interview questions

 

HTML5 Interview Questions

What is HTML5? Brief description.

Answer: HTML 5 is the programming language which stands for Hyper Text Markup Language, it provides the basic structure of any web page which includes new tags like <header>, <section> and <footer>. HTML 5 gives the possibility to add any multimedia content without using flash or any media player with new tags like <audio>, <video> etc. It also provides new features for API’s, XHTML and advanced error handling.

When was HTML5 released?

Answer: HTML5 initial release was on 28 October 2014.

What is the latest version of HTML5?

Answer: The latest version of HTML5 is 5.2

Version Recommendation
5.0 2014
5.1 2016
5.2 2017
5.3 Ye to release

Which browser supports the HTML5?

Answer: Chrome, Firefox, Safari, Edge. Google chrome ranks the highest in supporting HTML 5 and on the other hand internet explorer partially supports HTML5.

What is the difference between HTML and HTML5?

Answer:

HTML HTML 5
Does not support video and audio. Supports both audio and video.
Use cache memory as temporary storage Use application cache, web storage and SQL database.
Compatible with all the browsers Only a few browsers are compatible
Use cookies Use local storage
Not possible to draw shapes You can draw shapes like circles, triangles and rectangles.
Vector graphics is possible to run with help of adobe flash, silver light etc Vector graphics are supported by default.
Cannot handle inaccurate syntax It can handle inaccurate syntax

What are the benefits of using HTML5?

Answer: Below is the list of benefits of using HTML5

  • Cost-effective as can be used for application development
  • Geolocation availability
  • Better user experience
  • SEO
  • Cross-browser supports
  • Support rich media elements
  • Stores offline application cache

What is the file extension we use to save HTML5 file?

Answer: .html and .htm, however .htm is supported by all operating system and .html is not supported by DOS old operating systems.

Share some tags used in HTML5?

Answer: <video>, <audio>, <footer>, <header>, <article>, <base>, <bgsound>, <meter> etc.

Share examples of formatting tags in HTML5?

Answer: HTML5 Formatting tags

  • Marked text: <marks>
  • Deleted text: <del>
  • Emphasized text: <em>
  • Inserted text: <ins>
  • Small text: <small>
  • Superscript text: <sup>
  • Subscript text: <sub>

What do you understand by <!DOCTYPE>?

Answer: Every web page which is designed on HTML5 starts with <!DOCTYPE>, basically it helps the browser to understand that what information it should display and in HTML5 the declaration is very short, and case-insensitive.

Name the types of DOCTYPE available in HTML5?

Answer: There are three types of doctypes in HTML 5

  • Strict Doctype
  • Frameset Doctype
  • Transitional Doctype

What are the semantic tags used in HTML5?

Answer: semnatic elements added in html 5 <article>, <section>, <figure>, <footer>, <header>, <main>, <summary>, <time>, <aside>, <details>, <figcaption>, <mark>, <nav>

What is <svg> tag in html5?

Answer: SVG full form is Scalable Vector Graphics and it is now widely used to make shapes like circles, boxes, graphic images.

Example:

<svg width=”500″ height=”500″>

<circle cx=”70″ cy=”100″ r=”40″ stroke=”red” stroke-width=”10″ fill=”blue” />

Sorry, your browser does not support inline SVG.

</svg>

html5 svg tag

 

How to add a copyright symbol on a HTML page?

Answer:

UNICODE: U+000A9

HEX CODE: &#xa9;

HTML CODE: &#169;

HTML ENTITY: &copy;

CSS CODE: \00A9

Example: <p>I will display &copy;</p>

What is the use of <article> tag?

Answer: <article> tag is the new sematic element which is introduced in HTML 5 and it represents the independent item and it can be a document, page, magazine or new paper article.

What is the use of <aside> tag?

Answer: It can be used as a highlighter and describe the main objects in the web page like author information, links or any related content.

What is the use of <audio> tag?

Answer: It can be used to embed any sound or sound stream to a web page.

For Example:

<audio controls>

<source src=”cat.mp3″ type=”audio/mpeg”>

</audio>

What is the use of <canvas> tag?

Answer: It is used to draw/ design graphics with JavaScript on the web page. So you can use scripting to draw any graphics.

Example:

<canvas id=”canvastag”></canvas>

<script>

var c = document.getElementById(“canvastag”);

var ctx = c.getContext(“2d”);

ctx.fillStyle = “#FF2865”;

ctx.fillRect(0, 0, 80, 100);

</script>

What is the use of <datalist> tag?

Answer: Datalist tag is used to show pre-defined options to fil in the input element. For example, if you are searching for a dress and wants to choose a colour then there are pre-defined colour which can only be filled thus this is how it is used.

 

html5 datalist tag

What is the use of <details> tag?

Answer: It creates a small section or widget, where additional details to a particular page can be provided.

Example

html5 details tag

 

 

What is the use of <embed> tag?

Answer: It is used to embed the any external content, for example, any video etc

What is the use of <figure> tag?

Answer: Figure tag can be used to contain the diagrams, images, illustrations and with help of <figcaption> we can define the caption for the images etc.

What is the use of <footer> tag?

Answer: Earlier to define footer we uses div’s and now we have an element which can be used to define footer of the website independently. It can be used to define contact details, copyright etc.

What is the use of <header> tag?

Answer: The <header> tag is used to define a heading for any section on the webpage.

Example

 

html5 header tag

What is the use of <hgroup> tag?

Answer: The is used to contain the multilevel heading which is widely used for the table of content.

Example

<hgroup>

<h1>Color</h1>

<h2>Red</h2>

<h2>black</h2>

<p>This is the brief intro for the colors</p>

</hgroup>

What is the use of <mark> tag?

Answer: Mark is used to highlighting any text, like the same we do in our books to mark any important line, notes.

Example:

<p>The latest version of HTML5 is <mark>5.2</mark></p>

 

html5 mark tag

What is the use of <meter> and <progress> tag?

Answer: Both are used to indicate the completion of the task or scale some range. We can understand like if we want to show fuel in the car that will be meter and if we want to show the completion of the project then with progress.

As meter has shown the level indicator by red, yellow-green.

What is the use of <output> tag?

Answer: It is used widely in the websites where there is a need for calculation for example if you want to buy 1 item but if you increase the quantity the price also needs to be dynamically calculated.

Example

<form oninput=”result.value=parseInt(a.value)+parseInt(b.value)”>

<input type=”range” id=”b” name=”b” value=”50″ /> +

<input type=”number” id=”a” name=”a” value=”1″ /> =

<output name=”result” for=”a b”>51</output>

</form>

What is the use of <ruby> tag?

Answer: This used for the words where the pronunciation is required. You have seen widely used in Wikipedia website.

Example:

<ruby>

明日 <rp>(</rp><rt>Ashita</rt><rp>)</rp>

</ruby>

html5 mark tag

What is the use of <section> tag?

Answer: Very simple it defines the section in a webpage for example heading h1 h2 are section it can be defined.

What is the use of <time> tag?

Answer: This is used to specify the exact time and date of any event. For example, there is a presentation which you need to give on 20 DEC 2020, by this tag we can use it in a way like

Example

<p>I have a presentation on <time datetime=”2020-12-20 20:00″>20 DEC 2020</time>.</p>

What is the use of <wbr> tag?

Answer: The full form of WBR is word break opportunity, this is used to add a line break in any text/paragraph.

What is the use of Geolocation API in HTML5?

Answer: It helps to determine the current location of the user, it can be used in the website where the location is required to deliver or pick up anything.

Example:

html5 geolocation tag

Name the new types of <input>  in HTML5?

Answer: Below is the list of new input types

  1. date
  2. week
  3. month
  4. time
  5. datetime
  6. datetime-local
  7. email
  8. tel
  9. search
  10. number
  11. url
  12. color
  13. range
  14. placeholder

What are the APIs used in HTML5?

Answer: HTML5 API which can be used with JavaScript

  1. Ambient Light API
  2. Battery Status API
  3. Canvas 2D Context
  4. Clipboard API
  5. Contacts
  6. Drag and Drop
  7. File API
  8. Forms
  9. Fullscreen API
  10. Gamepad API
  11. Geolocation
  12. getUserMedia/Stream API
  13. History API
  14. HTML Microdata
  15. Indexed database
  16. Internationalization API
  17. Offline apps
  18. Proximity API
  19. Screen Orientation
  20. Selection
  21. Server-sent events
  22. User Timing API
  23. Vibration API
  24. Web Audio API
  25. Web Messaging
  26. Web Speech API
  27. Web storage
  28. Web sockets
  29. Web Workers
  30. XMLHttpRequest2

What is server sent events in HTML5?

Answer: Server-side events in HTML5 are those in which server sends some information periodically and webpage gets automatically updated. The best example will be date and time on the web page.

Conclusion

HTML5 is very user and developer-friendly and it can be used in numerous ways, thus the main objective is to make webpages more interactive and a very less addon code for a particular object. Please comment below for any additional HTML5 interview questions.

Additional Resources
HTML Interview Questions Mozilla HTML5

Was this helpful?

2 / 0

Leave a Reply 0

Your email address will not be published. Required fields are marked *


error: Content is protected !!