HTML5 interview questions

HTML5 interview questions

HTML5 is the most recent version of the HTML(Hypertext Markup Language). It is a language for structuring and displaying content for the World Wide Web, a core technology of the Internet.

Download HTML5 interview questions PDF

Below are the list of Best HTML5 interview questions and Answers

HTML5 is the most recent version of the HTML(Hypertext Markup Language). It is a language for structuring and displaying content for the World Wide Web, a core technology of the Internet.

WHATWG (Web Hypertext Application Technology Working Group) another gathering of W3C individuals felt that W3C is not giving careful consideration to this present reality improvement needs of dialect, it has begun dealing with the new determination of HTML-HTML5. Consequently, HTML5 is another adaptation of HTML 4.01 and XHTML 1.0 concentrating on the necessities of Web application designers and in addition tending to issues found in the present details.

Specifically, HTML5 includes numerous new syntactical features. New elements , like <section>, <article>, <header>, and <nav>, are the essential parts of semantic substance of documents. These additionally incorporate the <video>, <audio>, and <canvas> tags, as well as the integration of SVG content. These components are intended to make it simple to incorporate and handle interactive media and graphical substance on the web without resorting to restrictive modules and APIs. While a few components and traits have been expelled. A few components, for example, <a>, <cite> and <menu> have been changed, redefined or standardized. The APIs and DOM are no longer reconsideration but are fundamental parts of the HTML5 specification.

The < !DOCTYPE> is an instruction to the web browser about what version of HTML the page is written in. AND The < !DOCTYPE> tag does not have an end tag and It is not case sensitive.

The < !DOCTYPE> declaration must be the very first thing in HTML5 document, before the tag. As In HTML 4.01, all < ! DOCTYPE > declarations require a reference to a Document Type Definition (DTD), because HTML 4.01 was based on Standard Generalized Markup Language (SGML). Where as HTML5 is not based on SGML, and therefore does not require a reference to a Document Type Definition (DTD).

Some of the most interesting new features in HTML5:

  • The <canvas> element for 2D drawing
  • The <video> and <audio> elements for media playback
  • Support for local storage
  • New content-specific elements, like <article>, <footer>, <header>, <nav>, <

The top 5 from some web research would appear to offer the following HTML5 features;

  • Mutuality
  • Cleaner mark-up / Improved Code
  • Improved Semantics
  • Elegant forms and web apps
  • Offline Application cache

Canvas is a element of HTML5 which uses JavaScript to draw graphics on a web page. A canvas is a rectangular area. Each and every pixel of it can be controlled by us. There are several methods for drawing paths, boxes, circles, characters, and adding images by using canvas.

To add canvas tag to our HTML document we need id, width and height. Below is the example how to write a basic canvas tag to your HTML document.

<canvas id="myFirstCanvas" width="100" height="100"> </canvas>

HTML5 nGeolocation is used to locate a user’s position
The HTML5 Geolocation API is used to get the geographical position of a user.
Since this can compromise user privacy, the position is not available unless the user approves it.

Use the getCurrentPosition() method to get the user’s position.
The example below is a simple Geolocation example returning the latitude and longitude of the user’s position:

var x=document.getElementById("demo");
function getLocation()
if (navigator.geolocation)
else{x.innerHTML="Geolocation is not supported by this browser.";}
function showPosition(position)
x.innerHTML="Latitude: " + position.coords.latitude +"
Longitude: " + position.coords.longitude;

Some rules for HTML5 were established:

  • New features should be based on HTML, CSS, DOM, and JavaScript
  • Reduce the need for external plugins (like Flash)
  • Better error handling
  • More markup to replace scripting
  • HTML5 should be device independent
  • The development process should be visible to the public.

The sessionStorage object stores the data for one session. The data is deleted when the user closes the browser window. like below we can create and access a sessionStorage here we created “blogName” as session

<script type="text/javascript">

The new HTML5 specification allows browsers to prefetch some or all of website assets such as HTML files, images, CSS, JavaScript, and so on, while the client is connected. It is not necessary for the user to have accessed this content previously, for fetching this content. In other words, application cache can prefetch pages that have not been visited at all and are thereby unavailable in the regular browser cache. Prefetching files can speed up the site’s performance, though you are of course using bandwidth to download those files initially.

Below are the list of new Api’s provided by the Html 5 standard.

  • Canvas : Canvas consists of a drawable region defined in HTML code with height and width attributes. JavaScript code may access the area through a full set of drawing functions similar to other common 2D APIs, thus allowing for dynamically generated graphics. Some anticipated uses of the canvas include building graphs, animations, games, and image composition.
  • Timed media playback
  • Offline storage database
  • Document editing
  • Drag-and-drop
  • Cross-document messaging
  • Browser history management
  • MIME type and protocol handler registration

Before HTML5 LocalStores was done with cookies. Cookies are not very good for large amounts of data, because they are passed on by every request to the server, so it was very slow and in-effective.
In HTML5, the data is NOT passed on by every server request, but used ONLY when asked for. It is possible to store large amounts of data without affecting the website’s performance.and The data is stored in different areas for different websites, and a website can only access data stored by itself.
And for creating localstores just need to call localStorage object like below we are storing name and address

<script type="text/javascript">"ABC";
localStorage.address="New Delhi India.";

Yes, we can use below new input type Attribute in HTML5

  • tel The input is of type telephone number
  • search The input field is a search field
  • url a URL
  • email One or more email addresses
  • datetime A date and/or time
  • date A date
  • month A month
  • week A week
  • time The input value is of type time
  • datetime-local A local date/time
  • number A number.
  • range A number in a given range.
  • color A hexadecimal color, like #82345c
  • placeholder Specifies a short hint that describes the expected value of an input field.