Top 15 HTML5 Interview Questions

Q. What is HTML5?
HTML5 is the latest version of HTML with new features like Animation, Drawing, Video, and Audio, etc. It has been released to improve some common structural problems which were in the old version of HTML now it is a very powerful language and offering great structure for websites.
It gives more flexibility, reliability to users and developers can make their programs more effective. The HTML 5 doctype is recognized by all modern browsers. Q. Tell us something about the new <canvas> element.

• This tag helps in drawing graphics through scripting usually JavaScript.
• It uses the tag <canvas>.

Q. What are the new HTML5 tags for better structure?
Below are some new tangs which can make clean HTML structure:

<header> – This tag is used to define a header for a document if we need header under section we can use it as a section header
<nav> – This tag defines a navigation.
<footer> – defines a footer of HTML page.
<article> – This tag defines an article.
<aside> – It defines content other than the page content.
<figure> – This tag specifies content like illustrations, diagrams, photos, code listings, etc.
<figcaption> – It is used to provide a caption for a <figure> element.
<command> – It defines a command button for forms and other actions.
<details> – It defines additional details(we can use product details and event details under this tag).
<main>- Defines the main content of a document.
<dialog> – Defines a dialog box.
<hgroup> – If we have multiple headings then we can use <hgroup> tag.
<mark>- Defines marked text and highlighted text (we can highlight important things).
<time> – For date and time.
<summary>- Summary can be very short and defines a visible heading for a <details> element.
<progress> -indicate progress of a task.

 

Q. What is SVG?

• SVG stands for Scalable Vector Graphics. It is used to define vector-based graphics for the Website.
• The graphics are defined in XML format.
• SVG is high-quality graphics that can be resized anytime.
• We can animate each element of SVG.

Q. What are the differences between Canvas and SVG.
Below are the differences between Canvas and SVG:

• We can use Canvas for fix resolution while SVG is scalable.
• SVG provides support for event handlers while Canvas does not.
• Canvas is good for graphic-intensive games while SVG is not suitable for gaming.
• Canvas is suitable for small rendering areas while SVG is suitable for large rendering areas like Google maps.

Q. Can HTML5 get the geographical position of a user?

• HTML5 can get the location of a user with the use of Geolocation API.
• Use to get the user’s current position.
• We can get user’s current position through getCurrentPosition()

Q. What is HTML5 Web Storage?

HTML5 can store data locally in the user’s browser. It is possible through web storage, This web storage is much faster and very secured than cookies. Also, a larger amount of data can be stored without causing any effect on the performance of the website. Before HTML5, application data had to be stored in browser cookies, included in every server request.
Below is the type of storage:
localStorage: localStorage object stores data for a longer period of time even if the browser is closed.
sessionStorage:  sessionStorage object stores data for a specific session.

 

Q. What are two types of Web Storage in HTML5?

There are two types of storage in HTML5:
Session Storage: – It stores data of the current session only. It means it will store data for only that particular session and when the browser is closed all data will be cleared automatically.
Local Storage: –In local storage, data is not deleted automatically when the current browser window is closed.

 

Q. Which browsers support HTML5 and which do not?
All the latest browsers support HTML5 because it is language. The latest versions of Google Chrome, Apple Safari, Mozilla Firefox, and Opera all support most of the HTML5 features and new tags.

 

Q. What is <figure> tag in HTML5?
This tag represents a piece of self-contained flow content. It is mostly used as a single unit as a reference the main flow of the document.

 

Q. WHAT are the great advantages of HTML5?

• The clean structure can help you a lot while coding or when you want to modify the page.
• Some new cool tags like <header>, <nav>, and <time>.
• SEO-friendly coding.
• New audio and videos element that makes easy to play video in website.

Q. What are the New Media Elements in HTML5? <audio>For sounds, music or other audio streams.
<video> For video content like movie clip or other video streams.
<source> For media resources for media elements, defined inside video or audio
Elements.
<embed> For embedded content, such as a plug-in.
<track> For text tracks used in mediaplayers. Q.How do you play Video using HTML5?
Below is the code:

<video width="600" height="350" controls>
<source src="test-movie.mp4" type="video/mp4">
<source src="test-movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video> 

Q. What is XHTML?

XHTML will follow XML rules. So it means it is case-sensitive. HTML pages can be changed to XHTML. So during this process, we have to find the images, line breaks, etc. to include the closing tags. XHTML is compatible with XML.
Q. What is DOCTYPE?
In HTML DOCTYPE declaration is very easy, we just need to put <!DOCTYPE html> .