Pages

Men

rh

10/27/2014

Top 10 HTML5 Interview Questions

1.What’s new HTML 5 DocType and Charset?

Normally for HTML files first line of code is DocType which basically tells browser about specific version of HTML. HTML5 is now not subset of SGML. As compared to previous version/standards of HTML, DocType is simplified as follows:
                  <!doctype html>
And HTML 5 uses UTF-8 encoding as follows:
                 <meta charset=”UTF-8″>

2.How can we embed Audio in HTML 5?

HTML 5 comes with a standard way of embedding audio files as previously we don’t have any such support on a web page. Supported audio formats are MP3, Wav and Ogg. Below is the most simple way to embed an audio file on a web page.
<audio controls>
    <source src=”jamshed.mp3″ type=”audio/mpeg”>
    Your browser does’nt support audio embedding feature.
</audio>
In above code, src value can be relative as well as absolute URL. We can also use multiple <source>elements pointing to different audio files. There are more new attributes for <audio> tag other than src andcontrol as below:
  • autoplay – it’s a boolean value which specifies that audio will start playing once it’s ready.
  • loop – it’s also a boolean value which specifies looping (means it automatically start playing after it ends).
  • preload  auto, metadata and none are the possible values for this attribute.

3.How can we embed Video in HTML 5?

Same like audio, HTML 5 defined standard way of embedding video files which was not supported in previous versions/standards.Supported video formats are MP4, WebM and Ogg. Please look into below sample code.
<video width=”450″ height=”340″ controls>
  <source src=”jamshed.mp4″ type=”video/mp4″>
   Your browser does’nt support video embedding feature.
</video>

4.What are the new media element in HTML 5 other than audio and video?

HTML 5 has strong support for media. Other than audio and video tags, it comes with the following tags:
  • <embed> acts as a container for external application.
  • <track> defines text track for media.
  • <source> is helpful for multiple media sources for audio and video.

5.What is the usage of canvas Element in HTML 5?

<canvas> is an element in HTML5 which we can use to draw graphics with the help of scripting (which is most probably JavaScript).
This element behaves like a container for graphics and rest of things will be done by scripting. We can draw images, graphs and a bit of animations etc using <canvas> element.
<canvas id=”canvas1″ width=”300″ height=”100″>
</canvas>
As canvas is considered to be the most exciting feature in HTML5, for detailed practical examples on canvas development, you can follow:
  • HTML5 Canvas Tutorials
  • All about Canvas 

    6.What are the different types of storage in HTML 5?

    HTML 5 has the capability to store data locally. Previously it was done with the help of cookies.
    Exciting thing about this storage is that its fast as well as secure.
    There are two different objects which can be used to store data.
  • localStorage object stores data for a longer period of time even if the browser is closed.
  • sessionStorage object stores data for a specific session.

7.What are the new Form Elements introduced in HTML 5?

There are a number of new form elements has been introduced in HTML 5 as follows:
  • datalist
  • datetime
  • output
  • keygen
  • date
  • month
  • week
  • time
  • number
  • range
  • email
  • url

8.What are the deprecated Elements in HTML5 from HTML4?

Elements that are deprecated from HTML 4 to HTML 5 are:
  • frame
  • frameset
  • noframe
  • applet
  • big
  • center
  • basefront

9.What are the new APIs provided by HTML 5 standard?

HTML 5 standard comes with a number of new APIs. Few of it are as follows:
  • Media API
  • Text Track API
  • Application Cache API
  • User Interaction
  • Data Transfer API
  • Command API
  • Constraint Validation API
  • History API
  • and many more….

10.What is the difference between HTML 5 Application Cache and regular HTML Browser Cache?

One of the key feature of HTML 5 is “Application Cache” that enables us to make an offline version of a web application. It allows to fetch few or all of website contents such as HTML files, CSS, images, javascript etc locally. This feature speeds up the site performance. This is achieved with the help of a manifest file defined as follows:
<!doctype html>
<html manifest=”example.appcache”>
…..
</html>
As compared with traditional browser caching, Its not compulsory for the user to visit website
contents to be cached.
Source from :http://www.webdevelopmenthelp.net/2013/04/html5-interview-questions.html

No comments :

Post a Comment