Most Frequently Asked Question HTML5 Interview Questions with Answers

HTML5 is the latest version of the HTML language. HTML is stand for hypertext markup language, it is a universal World Wide Web(www) markup language that allows you to create and design web pages for viewing on the Internet.

HTML5, which was officially published in 2012, supports all existing web pages.

Que. What is HTML5?

HTML5 provides some standard features such as CSS, HTML, JavaScript and DOM, which in turn will reduce the need for external plug-ins. It is more marked to replace scripts, better error handling, etc. HTML5 is device independent.

Que. What is the difference between HTML and HTML5?

HTML5 has high-level video and audio support.High-level video and audio support is not a part of the version and specifications in the previous HTML.
Canvas, SVG and other virtual vector graphics are supported in HTML5.HTML, if we want to implement vector graphics, that was only possible by using third party library like VML, Silver-light
SVG and MathML can be used in text.Not posible in HTML
Web SQL database, application cache and web storage is used as a permanent storage.Browser cache can be used as a temporary storage.
HTML5 is more mobile friendly.HTML is less mobile friendly.
Doctype declaration is simple and easy.Doctype declaration is long and complicated
HTML5 Allows drag and drop effect.HTML Does not allow drag and drop effect.
HTML5 Attributes of Async, charset, and ping are available.HTML attributes are not available.
HTML5 support javascript to run in the background.Its not support javascript to run within the web browser.
In HTML5 We can draw shapes like rectangle, circle, and trianglenot possible to draw shapes like rectangle, circle, triangle etc. in HTML

Top HTML5 Interview Question

Que. What are the new tags in Media Elements in HTML5?

HTML5 new media tag elements:

<audio>: Request multimedia content such as sounds, audio streams or music, embed audio content without the need for any additional add-ons such as a flash player.

<video>: Request video content such as video streams or movie clips, embed video content, etc.

<source>: Request multiple multimedia resources in multimedia elements, such as audio, video, image, etc.

<embed>: Request an external application or embedded content (an add-on).

<track>: Request text clues in multimedia items, such as video or audio. This tag is used for subtitles or subtitle files while the video is playing.

Que. What is the importance of drag and drop in HTML5?

Drag and drop is the most important user interface concept that makes it easy to grab an object and drag it to the place you want with the help of a mouse click.

In this article if you want drag div using elements so you type  <div draggable = “true”>, to make div draggable and set the draggable div attribute to true.

HTML5 Interview Question PDF

Get the latest and most frequent questions and answers about the HTML5 interview for the experience

Que. Please tell HTML5 new Form input types name?

  • Date: It is a Date picker, you can pick a date by using input type = “date”.
  • Week: It is a Week picker,  You can pick a week by using input type = “week”.
  • Month: It is a Month picker, You can pick a month by using input type = “month”.
  • Time: It is a Time picker, You can pick the time by using input type = “time”.
  • Datetime: It is a combined date and time, you can pick the combination of date and time by using input type = “datetime”.
  • Datetime-local: It is a combined local date and time, You can pick the combination of local date and time using input type = “DateTime-local”.
  • Email: its Allow one or more Email Addresses, You can enter multiple email addresses using Input type = “email”.
  • Tel:  its Allow different phone numbers around the world. With a phone number is validated by the client-side. you can enter a phone number using input type = “tel”.
  • Search: it Allow to search your queries by input text. you can enter multiple your queries using input type = “search”.
  • Number: Its Allow inserting a numerical value with additional attributes such as min, max, You can enter multiple numerical values using input type = “number”.
  • Url: it is a url input type, that is used for the web address. In a single url, you can use multiple attributes using input type = “url”.
  • Color: Its Allow to select multiple colors, You can select multiple color using input type = “color”.
  • Range:Its allow to insert a numerical value within a specific range, Range is similar to the number but Range is much specific. you can enter a numerical value within a range using input type = “range”.
  • Placeholder: Its allow to display a short hint (usually in a light color) in the input fields, before we enter the value. you can write a short hint in the input field by using input type = “placeholder”.

HTML5 Questions

Que. What browsers are compatible with HTML5? Or Which browsers support HTML5?

The latest versions of Apple Safari, Google Chrome, Mozilla Firefox and Opera are compatible with many HTML5 features and Internet Explorer 9.0 will also be compatible with some HTML5 features.

Mobile web browsers that are preinstalled on iPhones, iPads and Android phones have excellent support for HTML5.

Que. How to optimize website assets?

Some basic optimization rules, to optimize website assets. Initially, we should decrease the download size and make fewer http requests.

  • File compression
  • File concatenation
  • CDN Hosting
  • Offloading assets
  • Re-organizing
  • Refining code

HTML5 Interview Question PDF Download

Get the latest and most frequent questions and answers about the HTML5 interview for the experience

Que. Why we use HTML5?

HTML5 supports animation, drawing, audio, video, etc. and easily embed a video on the website. It does not require any additional software like Flash to watch videos.

Some of the important reasons to use HTML5 are given below:

  • Legacy and cross-browser support
  • Better interactions
  • Smarter storage
  • Cleaner code

HTML5 Interview Question and Answer

Que. Explain The HTML5 Graphics?

HTML5 supports two types of graphics:

  1. Canvas
  2. SVG

Canvas: The <canvas> element is used to design graphics on the web page, and has several methods available to draw circles, frames, add images and text. 200px X 100px (width X height) is the default pixel size of the canvas.

<canvas id = “mycanvas” width = “100” height = “100”></canvas>

SVG: <svg> Scalable vector graphics are mainly used for graphic applications and scalable vector type diagrams, such as the X, Y coordinate system, two-dimensional graphics and pie charts. This makes it faster and lighter. SVG follows the XML format.

<svg width = “400” height = “150”>
	<rect width = “400” height = “150” style = “fill:rgb(200,220,255);stroke-width:10;stroke:rgb(0,0,0)”/>

Que. What video and audio formats are used to embed the web page?

It is used for embedding on the web page are given below:

  • Video: MPEG4, Ogg, WebM.
  • Audio: WAV, Ogg Vorbis, MP3.

Que. List the HTML5 page structure elements?

HTML5 page structure elements are given below:

<header>: it represents the section of the header and stores the initial information about the web page.
<footer>: it represents the footer section (last part) of the page.
<nav>: it represents the navigation elements of the HTML page.
<article>: it means set of information.
<section>: it means set of instructions that is used within the article block to define the basic structure of a page.
<sidebar>: it contents of the sidebar of the page.

Que. What are the tags migrated from HTML4 to HTML5?

<div class=”header”><header>
<div class=”footer”><footer>
<div class=”menu”><nav>
<div class=”post”><article>
<div class=”content”><section>

Que. Explain the web storage in HTML5?

In this article HTML 5 data storage can be done in two ways:

  • Session storage: the details of the current session (that is, a user browsing the website) are stored. Once the user closes the browser, the storage is deleted.
  • Local storage: data stored in local storage will not be deleted automatically or when the user closes the browser.

Que. What is List the API’s available in HTML5?

They are below:

  • Constraint Validation API
  • Text Track API
  • Media API
  • Command API
  • User Interaction
  • Data Transfer API
  • History API
  • Application Cache API

Que. What are the rules set for HTML5?

Some rules for HTML5:

  • The new functions must be based on HTML, CSS, DOM and JavaScript
  • Reduce the need for external add-ons (such as Flash)
  • Better error handling
  • More brands to replace scripts
  • HTML5 must be device independent
  • The development process must be visible to the public.

Que. What is the difference between SVG and Canvas elements?

SVG is Object Model-based.It is pixel based.
SVG suitable for using large rendering areas.Is suitable for using small rendering areas.
SVG provides any support for event handlers.Canvas does not provide any recourse for event handlers.
Modification is allowed through script and CSS.Modification is allowed through script only.
SVG has Better scalability.Canvas has poor scalability.
SVG is Vector based (composed of shapes).Canvas is Raster based (composed of a pixel).
SVG is not suitable for Games graphics.Canvas is suitable for games graphics.
SVG does not depend on resolution.Canvas is completely dependent on resolution.
SVG is capable for API animation.Canvas has no any API for animation.
SVG is suitable for printing with high quality and any resolution.Canvas is not suitable for printing high quality and high resolution.

Bootstrap Interview Question PDF Download

Get the latest and most frequent questions and answers about the Bootstrap interview for the experience

If we want to represent the same thing in HTML 4 with proper names of the HTML section, we would probably use a DIV tag.

But in HTML 5 they have made it clearer by creating element names for those sections, which makes their HTML more readable.

Below the details of the HTML 5 elements which form the page structure.

  • <header>: Represents header data of HTML.
  • <footer>: Footer section of the page.
  • <nav>: Navigation elements in the page.
  • <article>: Self-contained content.
  • <section>: Used inside article to define sections or group content in to sections.
  • <aside>: Represent side bar contents of a page.

What is HTML5?

In this article HTML 5 of the hypertext markup language (HTML5) is a markup language for the structure and presentation of World Wide Web (www) content. HTML5 supports traditional HTML and XHTML style syntax and other new features in its markup, New APIs, XHTML and error handling.

In this article HTML5 is the latest version of the hypertext markup language, the code that describes web pages. Actually, there are three types of code: HTML, which provides the structure; Cascading style sheets (CSS), which handle the presentation; and JavaScript, which makes things happen.

The new HTML5 features include:

  • New analysis rules that are not based on SGML but are geared towards flexible analysis and compatibility.
  • Support for online scalar vector graphics (SVG) and mathematical markup language (MathML) in text / html.
  • The new elements available include article, apart, audio, bdi, canvas, command, datalist, details, embedding, figcaption, figure, footer, header, hgroup, keygen, mark, meter, nav, output, progress, rp, rt , ruby, section, source, summary, time, video and wbr.
  • The new available types of form controls include dates and times, email, url, search, number, range, phone and color.
  • New attributes available from charset in meta and async in script.
  • Global attributes that can be applied for each element that includes id, tabindex, hidden, data- * or customer data attributes.

Syntax of Doctype:

<!DOCTYPE html>
<title>Page Title</title>

<h1>My First Heading</h1>
<p>My paragraph.</p>


Description of the HTML example …

<!doctype>: defines the type of document or instructs the browser about the HTML version.

<html>: This tag informs the browser that it is an HTML document. The text between the html tag describes the web document. It is a container for all other HTML elements except

<head>: must be the first element within the element, which contains the metadata (information about the document). It must be closed before the body tag is opened.

<title>: As the name suggests, it is used to add the title of that HTML page that appears at the top of the browser window. It must be placed inside the head tag and must be closed immediately. (Optional)

<body>: The text between the 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.

<h1>: The text between the <h1> tag describes the first level header of the web page.

<p>: The text between the <p> tag describes the paragraph on the web page.>

In this article today we are talking difference between “Div” and “Span”

<div> Div is block element are take the full available width of block level. Div tags are used to define section in document block wise element.

Note: Block level elements are <div>, <p>, <img>, <section> and many more.

Example of block level element see below:

<div> full available width of block level </div>

<span> Span Inline elements are only take the width that is required to fit into the box.

span is very similar to the HTML “div” tag, but div is a block-level tag and span is an inline tag. Span element is a generic online container for online elements and content.

Span Inline elements are only take the width that is required to fit into the box.

Example of inline element see below:

<span> required to fit width into the box. </span>

difference between “div” and “span” elements

difference between "div" and "span" elements
difference between div and span
top html interview question

Top HTML / HTML5 Interview Questions

click on button to view and read HTML Interview Questions

Begin writing your HTML tags by creating your document’s basic layout. Copy and paste this code into your text or HTML editor.

<TITLE>Your Page Title</TITLE> </HEAD> 
This area will contain everything that will be visible through a web browser, such as text and graphics. All of the information will be HTML coded.
For a complete list of HTML codes, tags and examples, see the HTML chart below.

<HTML> – Begins your HTML document.

<Head> – Contains information about the page such as the TITLE, META tags for proper Search Engine indexing, STYLE tags, which determine the page layout, and JavaScript coding for special effects.

<Title>– The TITLE of your page. This will be visible in the title bar of the viewers’ browser.

<Body> – This is where you will begin writing your document and placing your HTML codes.

HTML has many versions since it inceptions during 1990’s. HTML version are HTML, HTML+, HTML 2.0, HTML 3.2, HTML 4.0 and the
latest version HTML 5.

  • HTML
  • HTML+
  • HTML 2.0
  • HTML 3.2
  • HTML 4.0
  • HTML 5

HTML stands for Hypertext Markup Language. It is s markup language for World Wide Web. HTML was developed by Tim Berners Lee during 1990’s. It consists of tags which are used to dene content and web page formatting.

  • HTML stands for Hyper Text Markup Language
  • HTML is the standard markup language for Web pages
  • HTML elements are the building blocks of HTML pages
  • HTML elements are represented by <> tags


<!DOCTYPE html>
<html lang="en">

<meta charset="utf-8">
<title>Page Title</title>

   content area


HTML Versions

Since the time HTML was invented there are lots of HTML versions

HTML 1.0: The first version of HTML was 1.0, which was the basic version of the HTML language, and was launched in 1991.

HTML 2.0: This was the next version that was released in 1995, and it was a standard language version for website design. HTML 2.0 was able to support additional functions such as loading files based on forms, form elements such as text box, option button, etc.

HTML 3.2: W3C published the HTML 3.2 version in early 1997. This version was able to create tables and provide support for additional options for form elements. It can also support a web page with complex mathematical equations. It became an official standard for any browser until January 1997. Today it is practically compatible with most browsers.

HTML 4.01: The HTML version 4.01 was released in December 1999, and is a very stable version of the HTML language. This version is the current official standard, and provides additional support for style sheets (CSS) and scripting capabilities for various multimedia elements.

HTML5: HTML5 is the newest version of the hypertext markup language. The first draft of this version was announced in January 2008. There are two main organizations, one is W3C (World Wide Web Consortium) and another is WHATWG (Web Hypertext Application Technology Working Group) involved in the development of the HTML version 5, and is still in development.

What is HTML features are:

1. It is a very easy and simple language. It can be easily understood and modified.

2. It is very easy to make an effective presentation with HTML because it has many formatting tags.

3. It is a markup language, so it provides a flexible way to design web pages along with the text.

4. It makes it easier for programmers to add a link on web pages (using html anchor tag), so that the user’s browsing interest increases.

5. It is platform independent because it can be displayed on any platform such as Windows, Linux and Macintosh, etc.

6. It makes it easy for the programmer to add graphics, videos and sound to web pages, which makes it more attractive and interactive.

7. HTML is a language that is not case sensitive, which means we can use lowercase or uppercase labels.