HTML or Hyper-Text Markup Language is the primary web language to create web pages. All web pages on the internet are created with different elements of HTML.
We can not think about web without HTML because it is an integral part of web pages. With HTML, we can manage many things on web pages like text, images, multimedia, links etc.
So here in this post, we have listed some of the most asked HTML interview questions with answers for beginners and experienced web developers.
Q 1- What is the difference between HTML and HTML5 ?
Ans: There are no major difference between HTML and HTML5 as both are used to create web page. We can say that the HTML5 is not a replacement of HTML but its addition to HTML with more semantic approach with coding to develop web pages. HTML5 features some new elements like audio, video, canvas, placeholder, graphics etc to handle complex things easily.
Q 2- What is <!DOCTYPE> declaration in HTML5 ?
Ans: DOCTYPE declarations is the first thing that declared in HTML page to instruct the web browser about version of HTML page. It is a good practice to add DOCTYPE declaration to HTML to know the bworser about the type of document. The HTML5 DOCTYPE Declarations is HTML.
Q3- What are the new elements in HTML5?
Ans: Following are the new elements in HTML5.
| Tag | Description |
|---|---|
| <article> | The HTML5 article is new element and could be used for news, blog or article. |
| <aside> | The HTML5 aside tag is used to surround content to keep it aside from other content. |
| <bdi> | The HTML5 BDI tags stands for Bi-Directional Isolation. It is used to isolate text part in a different direction from other text outside it. |
| <details> | The details is the awesome HTML5 tag to create interactive widget to allow user’s to open and close to view content within it. |
| <summary> | The summary is the HTML5 tag that define the heading of details element to click to view and hide the details content. |
| <figure> | The figure is the HTML5 element and can be used for illustrations, diagrams, photos, code listings, etc. |
| <figcaption> | The figcaption is the HTML5 element that used to define the caption of figure element. |
| <footer> | The footer is the HTML5 element that is used defines a footer for a document or section |
| <header> | The header is the HTML5 element that is used as container for introductory content or a set of navigational links. |
| <mark> | The mark is the HTML5 element that is used to mark or highlight parts of text. |
| <meter> | The meter is the HTML5 element that is used to measure data within a given range. |
| <nav> | The nav is the HTML5 element that is used to defines a set of navigation link. |
| <progress> | The progress is the HTML5 element that is used to show the progress of a task. |
| <ruby> | The ruby is the HTML5 element that is used to create a ruby annotation. |
| <rt> | The rt is the HTML5 element that is used to explain or pronounce characters in a ruby annotation. |
| <rp> | The rp is the HTML5 element that is used to add parentheses around a ruby text. |
| <section> | The section is the HTML5 element that is used to create sections in a document like chapters, headers, footers etc. |
| <time> | The time is the HTML5 element that is used display date in human-readable format. |
| <wbr> | The wbr is the HTML5 element that is used to specifies to add line break in a text. |
Q4- What are the new Media elements in HTML5?
Ans: Following is the new Media elements in HTML5.
| Tag | Description |
|---|---|
| <audio> | For multimedia content, sounds, music or other audio streams |
| <video> | For video content, such as a 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 |
Q5- What are the new Input Type attribute in HTML5?
Ans: There are following new input type Attribute in HTML5.
| Type | Value |
|---|---|
| tel | This input type is used for telephone number |
| search | The input type is used for search field |
| url | This input type is used for URL |
| This input type is used for email addresses | |
| datetime | This input type is used date and/or time |
| date | This input type is used for date |
| month | This input type is used for month |
| week | This input type is used for week |
| time | This input type is used for time |
| datetime-local | This input type is used for local date/time |
| number | This input type is used for number |
| range | This input type is used for number in a given range |
| color | This input type is used for hexadecimal color, like #82345c |
| placeholder | This input type is used for specifing a short hint that describes the expected value of an input field |
Q6- How we will add video and audio in HTML5?
Ans: The HTML5 video element is used to add and play video. We need to pass video file path to play video.
<video width=“300” height=“200” controls=“controls”> <source src=“mysong.mp4” type=“video/mp4” /> <source src=“mysong.ogg” type=“video/ogg” /> </video>
We will use HTML5 audio element to play audio file.
<audio controls=“controls”> <source src=“mysong.ogg” type=“audio/ogg” /> <source src=“mysong.mp3” type=“audio/mpeg” /> </audio>
Q7- What is localStorage in HTML5?
Ans: Unlike HTML, HTML5 is not passing data on every server request, it stores data in localstores and pass only when it is asked for. So we need to create localstores to store data to use further on request. We will call localStorage object to store them like below
<script type=“text/javascript”> localStorage.name=“PHPZAG”; document.write(localStorage.name); </script> <script type=“text/javascript”> localStorage.address=“Newyork USA”; document.write(localStorage.address); </script>
Q8- What is sessionStorage in html5?
Ans: In HTML5, the sessionStorage object used to store the data for a session. The data remain in sessionStorage until user not closes browser, the data will be deleted when user close the browser. We will create sessionStorage using sessionStorage object like below.
<script type=“text/javascript”> sessionStorage.web=“PHPZAG”; document.write(sessionStorage.web); </script>
Q9- What is Canvas Element in HTML5?
Ans: Canvas is the new element in HTML5 that work as container to draw graphics. To draw graphics with Canvas, we need to use JavaScript to draw graphics. The Canvas has several method for drawing, boxes, circles, text, images etc.
<canvas id=“myCanvas” width=“300” height=“250”> </canvas> <script type=“text/javascript”> var myCanvas=document.getElementById(“myCanvas”); var myText=myCanvas.getContext(“2d”); myText.fillStyle=“#f6789”; myText.fillRect(0,0,100,150); </script>
Q10- What’s advantages of using HTML5?
Ans: There are following advantages of using HTML5.
a) It enables us to write clean markup.
b) It adds additional semantics of new elements like <header>, <footer>, <nav>, and <time>
c) New form input types and attributes.
d) Advanced media elements.
e) Supports offline application Cache.
You may also check:
- PHP Interview Questions and Answers
- CodeIgniter Interview Questions and Answers
- Zend Framework Interview Questions and Answers
- Magento Interview Questions and Answers
- Top WordPress Interview Questions and Answers
- Angular Interview Questions and Answers
- jQuery Interview Questions and Answers
- MySQL Interview Questions and Answers
- Laravel Interview Questions and Answers