Monday 30 June 2014

HTML5 Interview questions with answer.

Introduction
What is the relationship between SGML,HTML , XML and HTML ?
What is HTML 5?
In HTML 5 we do not need DTD why?
If I do not put <! DOCTYPE html> will HTML 5 work?
Which browsers support HTML 5?
How is the page structure of HTML 5 different from HTML 4 or previous HTML?
What is datalist in HTML 5 ?
What are the different new form element types in HTML 5?
What is output element in HTML 5?
What is SVG?
Can we see a simple example of SVG using HTML 5?
What is canvas in HTML 5?
So how can we draw a simple line on Canvas?
What is the difference between Canvas and SVG graphics?
How to draw rectangle using Canvas and SVG using HTML 5 ?
What are selectors in CSS?
How can you apply CSS style using ID value?
What is the use of column layout in CSS?
Can you explain CSS box model?
Can you explain some text effects in CSS 3?
What are web workers and why do we need them ?
What are the restrictions of Web Worker thread ?
So how do we create a worker thread in JavaScript?
How to terminate a web worker
Why do we need HTML 5 server-sent events?
What is local storage concept in HTML 5?
How can we add and remove data from local storage?
What is the lifetime of local storage?
What is the difference between local storage and cookies?
What is session storage and how can you create one?
What is difference between session storage and local storage?
What is WebSQL?
Is WebSQL a part of HTML 5 specification?
So how can we use WebSQL ?
What is application cache in HTML5?
So how do we implement application cache in HTML 5 ?
So how do we refresh the application cache of the browser?
What is fallback in Application cache?
What is network in application cache ?
References for other interview question articles

  1. Have you learned something new or interesting lately?
    • Make sure you know all the relevant news and blogs. You shoud be reading them regardless, but doing so on a daily basis during your job search is important. Be ready to talk casually and fluently about the latest web trends.
  1. Why did you get into coding, programming, etc.?
    • “Because I can make good $,” “I don’t like to dress up or shave,” and“because I loved the movie Hackers,” are not good enough. Well… a comment about Hackers might fly but make sure you have a real backstory that describes your “Aha!” moment.
  1. What is your preferred development environment?
    • This is your chance to talk shop and demonstrate some industry knowledge. Be prepared to talk about your favorite editor, browser, plug-ins, operating system, and other tools. Freshen up on your lingo.
  1. What is the coolest thing you ever coded? Do you have any personal projects you are working on?
    • These two questions are interchangeable. Any developer worth his weight had to practice somewhere or on something before they landed their first gig. If not, how did you get this interview anyway?! Review your past experiences, and even if they were boring to you, figure out a new frame of reference that demonstrates passion and a zest for learning.

General Website Optimization Questions

  1. How do you optimize a website’s assets?
    • There are a number of answers to this question: File concatenation, file compression, CDN Hosting, offloading assets, re-organizing and refining code, etc. Have a few ready.
  1. What are three ways to reduce page load time?
    • Again there are many answers here: Reduce image sizes, remove unnecessary widgets, HTTP compression, put CSS at the top and script references at the bottom or in external files, reduce lookups, minimize redirects, caching, etc.
  1. What kind of things must you be wary of when design or developing for multilingual sites?
    • Another problem with many solutions: setting the default language, using Unicode encoding, using the ‘lang’, being aware of standard font sizes and text direction, and language word length (may affect layout).
    • What is HTML?
        • HTML stands for HyperText Markup Language. It is the dominant markup language for creating websites and anything that can be viewed in a web browser. If you want to get some extra bonus points, you can learn the history of HTML and throw in some obscure facts.
      1. What is the difference between HTML elements and tags?
        • HTML elements communicate to the browser how to render text. When surrounded by angular brackets <> they form HTML tags. For the most part, tags come in pairs and surround text.
      1. What is “Semantic HTML?”
        • Semantic HTML is a coding style where the tags embody what the text is meant to convey. In Semantic HTML, tags like  for bold, and  for italic should not be used, reason being they just represent formatting, and provide no indication of meaning or structure. Thesemantically correct thing to do is use  and . These tags will have the same bold and italic effects, while demonstrating meaning and structure (emphasis in this case).
      1. What does DOCTYPE mean?
        • The term DOCTYPE tells the browser which type of HTML is used on a webpage. In turn, the browsers use DOCTYPE to determine how to render a page. Failing to use DOCTYPE or using a wrong DOCTYPE may load your page in. See example:
      .
      1. What’s the difference between standards mode and quirks mode?
        • Quirks Mode is a default compatibility mode and may be different from browser to browser, which may result to a lack of consistency in appearance from browser to browser.
      1. What are the limitations when serving XHTML pages?
        • Perhaps the biggest issue is the poor browser support XHTML currently enjoys. Internet Explorer and a number of other user agents cannot parse XHTML as XML. Thus, it is not the extensible language it was promised to be. There are many other issues. Take your pick.
      1. How many HTML tags are should be used for the most simple of web pages?
        • 8 total. 4 pairs of tags.
      Simplest page ever!
Doesn’t get simpler than this.
  1. How do you make comments without text being picked up by the browser?
    • Comments are used to explain and clarify code or to prevent code from being recognized by the browser. Comments start with “*“.
  1. What is the difference between linking to an image, a website, and an email address?
    • To link an image, use  tags. You need specify the image in quotes using the source attribute, src in the opening tag. For hyperlinking, the anchor tag, , is used and the link is specified in the href attribute. Text to be hyperlinked should be placed between the anchor tags. Little known fact: href stands for “hypertext reference.” When linking to an email, thehref specification will be “mailto:send@here.com.” See examples below:
parbjotblogspot
.com”>Skilledup
Email Me
  1. My hyperlink or image is not displaying correctly, what is wrong with it?
    • It could be any number of things, but the most common mistakes are leaving out a tag bracket or quote missing for href, src, or alt text may be the issue. You should also verify the link itself.
  1. What is the syntax difference between a bulleted list and numbered list?
    • Bulleted lists use the 
         tag, which stands for “unordered,” whereas 
           is used to create an ordered list.
      1. What is the difference between 
         and ?
        •  is a generic container element for grouping and styling, whereas a creates divisions within a web page and should be used within the  tag. The use of  and  are no longer popular and are now being replaced with the more flexible 

      2 comments:

      1. Great resources, Parbjot!

        Thought I'd give you a heads up that we've also released 12 Essential HTML5 Interview Questions that might be helpful for your readers too :)

        http://www.toptal.com/html5/interview-questions

        ReplyDelete
      2. really wonderful and nice blog.
        thanks for sharing. keep it up.
        Ignite Minds
        Ignite Mind

        ReplyDelete

      Thank to you