1. What are the new form element types in HTML 5?

New form elements introduced in HTML 5:
★ Color
★ Date
★ Datetime-local
★ Email
★ Time
★ Url
★ Range
★ Telephone
★ Number
★ Search

2. Described datalist in HTML 5?

Datalist element in HTML 5 helps to provide autocomplete feature in a textbox.

HTML code for DataList feature:
<input list="Country">
<datalist id="Country">
<option value="India">
<option value="Italy">
<option value="Iran">
<option value="Israel">
<option value="Indonesia">
</datalist>

3. How page structure of HTML 5 is different from HTML 4 or previous HTML?

A typical web page has headers, footers, navigation, central area and side bars. Now if we want to represent the same in HTML 4 with proper names to the HTML section we would probably use a DIV tag.
But in HTML 5 they have made it more clear by creating element names for those sections which makes your HTML more readable.
More details:
★ <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.

4. DEFINE selectors in CSS?

Selectors help to select an element to which you want to apply a style. For example below is a simple style called as 'intro" which applies red color to background of a HTML element.
cODE:
<style>
.intro
{
background-color:red;
}
</style>

5. How to use column layout in CSS?

CSS column layout helps you to divide your text in to columns. For example consider the below magazine news which is one big text but we need to divide the same in to 3 columns with a border in between. That's where HTML 5 column layout comes to help.

6. Define SVG?

SVG stands for scalable vector graphics. It's a text based graphic language which draws images using text, lines, dots etc. This makes it lightweight and renders faster.

7. Define w3c?

w3c stands for world web consortium. w3c Standards compliance in web development is where everything is (hopefully?) going. Don't ask them to recite the w3c's mission statement or anything, but they should at least have a general idea of who they are.

8. Can you please explain the difference between cookies, session-Storage, and local-Storage?

Cookies are small text files that websites place in a browser for tracking or login purposes. Meanwhile, local-Storage and session-Storage are new objects, both of which are storage specifications but vary in scope and duration. Of the two, local-Storage is permanent and website-specific whereas session-Storage only lasts as long as the duration of the longest open tab.

9. Can you please explain the difference between SGML and HTML?

SGML (Standard generalized markup language) is a standard which tells how to specify document markup. It's only a Meta language which describes how a document markup should be. HTML is a markup language which is described using SGML.

10. Can you please explain the difference caching between HTML5 and the old HTML?

An important feature of HTML5 is the Application Cache. It creates an offline version of a web application. and stores website files such as HTML files, CSS, images, and JavaScript, locally. It is a feature that speeds up site performance.

Download Interview PDF

11. Suppose if I do not put then will HTML5 work?

No, browser will not be able to identify that it's a HTML document and HTML 5 tags will not function properly.

12. What are the major new API's that come standard with HTML5?

Name of a few one's are:
★ Media API
★ Text Track API
★ Application Cache API
★ User Interaction
★ Data Transfer API
★ Command API
★ Constraint Validation API
★ History API.

13. Define Web workers?

Web Workers are background scripts that do not interfere with the user interface or user interactions on a webpage, allowing HTML to render uninterrupted while JavaScript works in the background.

14. Can you please explain the difference between HTML5 interaction in Sencha and Twitter/Bootstrap?

Sencha and Twitter/Bootstrap are both HTML development frameworks that integrate HTML5, CSS3, and JavaScript. The major difference is that in Sencha, the three languages are all comingled together in code, whereas in Bootstrap, HTML and CSS and decoupled.

15. For what data- attributes are good?

The HTML5 data- attribute is a new addition that assigns custom data to an element. It was built to store sensitive or private data that is exclusive to a page or application, for which there are no other matching attributes or elements.

16. What are some new HTML5 input attributes?

There are many new form elements including: datalist, datetime, output, keygen, date, month, week, time, number, range, email, and url.

17. Can you please explain the difference between SVG and <Canvas>?

<Canvas> is an element that manipulates two-dimensional (2D) pixels while Scalable Vector Graphics works in 2D and three-dimensional (3D) vectors. Essentially, <Canvas> is to SVG as Photoshop is to Illustrator.

18. What are the HTML5 image elements?

Canvas and WebGL. <Canvas> is a new element that acts as a container for graphical elements like images and graphics. Coupled with JavaScript, it supports 2D graphics. WebGL stands for Web Graphics Language, a free cross-platform API that is used for generating 3D graphics in web browsers.

19. What are new HTML5 media-related elements?

HTML5 has strong support for media. There are now special <audio> and <video> tags. There are additional A/V support tags as well: <embed> is a container for 3rd party applications. <track> is for adding text tracks to media. <source> is useful for A/V media from multiple sources.

20. What elements have disappeared in HTML5?

<frame> and <frameset> have been eliminated. Other elements that are no longer supported include: <noframe>, <applet>, <bigcenter> and <basefront>.

21. List some new HTML5 markup elements?

There are several:
<article>, <aside>, <bdi>,
<command>, <details>, <figure>,
<figcaption>, <summary>, <header>,
<footer>, <hgroup>, <mark>,
<meter>, <nav>, <progress>,
<ruby>, <rt>, <section>,
<time>, and <wpr>.

22. Define new DOCTYPE?

Instead of typing out a ridiculously long DOCTYPE statement to tell the browser how to render your webpage, this long line of code has been truncated to .

23. Can you please explain the real difference between HTML and HTML5?

A lot of. From a broader perspective, HTML was a simple language for laying out text and images on a webpage, whereas HTML5 can be viewed as an application development platform that does what HTML does that and more, including better support for audio, video, and interactive graphics. It has a number of new elements, supports offline data storage for applications, and has more robust exchange protocols. Thus, proprietary plug-in technologies like Adobe Flash, Microsoft Silver-light, Apache Pivot, and Sun JavaFX are no longer needed, because browsers can now process these elements without additional requirements.

24. Can you please explain the difference between HTML and HTML5?

Trick question, there is no difference. HTML5 is a continuum of HTML and just a souped up version of the original HTML. There has been no major paradigm shift.

25. Can you please explain the difference between <div> and <frame>?

A <div> is a generic container element for grouping and styling, whereas a <frame> creates divisions within a web page and should be used within the <frameset> tag. The use of <frame> and <frameset> are no longer popular and are now being replaced with the more flexible <iframe>, which has become popular for embedding foreign elements (ie. Youtube videos) into a page.

Download Interview PDF

26. Can you please explain the syntax difference between bulleted list and numbered list?

Bulleted lists use the <ul> tag, which stands for "unordered," whereas <ol> is used to create an ordered list.

27. What is wrong when hyperlink or image is not displaying correctly?

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.

28. Can you please explain the difference between linking to an image, a website, and an email address?

To link an image, use <img> tags. You need specify the image in quotes using the source attribute, src in the opening tag. For hyperlinking, the anchor tag, <a>, 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, the href specification will be "mailto:sendmemail@here.com."
Example:
<img src="HTMLrocks.jpg"></img>
<a href="skillprelaunch2.globalguideline.com">globalguideline</a>
<a href="brad@globalguideline.com">Email Me</a>

29. How to 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 "*<!--" and end with " -->".
Example:
<!-- Insert comment here. -->

30. How many HTML tags are used for the most simple of web pages?

8 total. 4 pairs of tags.
<HTML>
<HEAD>
<TITLE>Simplest page!</TITLE>
</HEAD>
<BODY>
Doesn't get simpler more than this.
</BODY>
</HTML>

31. When serving XHTML pages what are the limitations?

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.

32. Can you please explain 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.

33. Define Semantic HTML?

Semantic HTML is a coding style where the tags embody what the text is meant to convey. In Semantic HTML, tags like <b></b> for bold, and <i></i> for italic should not be used, reason being they just represent formatting, and provide no indication of meaning or structure. The semantically correct thing to do is use <strong></strong> and <em></em>. These tags will have the same bold and italic effects, while demonstrating meaning and structure (emphasis in this case).

34. What is DOCTYPE?

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 Quirks Mode. See example:
.

35. What things must 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' attribute, being aware of standard font sizes and text direction, and language word length (may affect layout).

36. Can you please explain 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.

37. How to 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.

38. How to reduce page load time?

Reduce image sizes, remove unnecessary widgets, HTTP compression, put CSS at the top and script references at the bottom or in external files, reduce look-ups, minimize redirects, caching, etc.

39. Do you have any personal projects you are working on? What is the coolest thing that you ever coded?

Interchangeable questions. 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.

40. Define 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.

Download Interview PDF

41. 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 answers. Well a comment about hackers might fly but make sure you have a real back-story that describes your "Aha!" moment.

42. Tell me have you learned something new or interesting lately?

Make sure you know all the relevant news and blogs. You should 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.

43. Can you please explain the difference between custom design and essentials design?

The main difference between the programs is that with Essentials, the designs are ready-to-go. The site is complete in a week because the majority of the work is done already. Custom sites are ready in two to three months, as we spend hundreds of hours researching, planning, designing and building a company's unique web presence. As a result, there is also a significant price difference. For firms on a tight budget, or looking for a simple practice area site, Essentials is the quick and easy solution.

44. What not included in custom Web Design?

We can help you write content on an hourly rate, but text content is not included. Anything you send to us we will include on the website (text, audio, video and photos). We also do not include long, boring Flash introductions (which no one watches anyway), although we will animate the home page graphics.

45. What included in custom Web Design?

Just about everything. All the pages you can handle, all the design time, a integrated blog, various contact forms, custom graphics, stock photography (1,000,000+ images), basic search engine optimization, and more.

46. Can you please explain the difference between Dynamic and Static Web Pages?

A "Dynamic" web page is one that is automatically created "on the fly" as it is presented, while a "Static" web page is pre-configured and not interactive.
Dynamic web pages will often pull information from somewhere else before displaying the page, so the page content is ever-changing. The information on a Dynamic webpage often results from a database query, such as "search" results.
Dynamic page simply pulls information from another source, such as a web page that displays an RSS feed it's "Dynamic" because the page content changes each time the RSS feed is updated. The information contained in a Static page is considered "flat", and never changes until the webmaster re-codes it.

47. What does HTML stand for?

HTML stands for "Hyper Text Markup Language". HTML is the markup language that typically resides behind the web page. Information related to the website design is indicated by "tags". HTML is what is considered a simple markup language.

48. Do one should must have to know HTML to design a Website?

Knowing HTML is certainly helpful in website design, especially when very minor tweaks and adjustments are necessary, but it is not absolutely required for website design. There are a number of WYSIWYG editors and web templates available, which can assist new webmasters with the design process. Using a web template and a WYSIWYG editor, new webmasters are able to create a web page by simply cutting and pasting content into a web template.

49. How much does a Website cost?

It depends on many variables. Custom website design can range from $500-$3000 for a single web template. The price varies, depending on the complexity of the design. Webmasters can also use a stock web template, which can cost as little as $15.00, or as much as several hundreds of dollars. Some stock templates are available for exclusive use, and exclusive designs tend to be more expensive. Website content development and Search Engine Optimization can be even more expensive, and are ongoing expenses.

50. Within a designed site what website functions can you create?

Sometimes web designers need to include or add functions to existing websites. Functions include message boards, guest books, games, quizzes, etc.

51. What is "WYSIWYG" editor?

WYSIWYG stands for "What You See Is What You Get", so if you are using a WYSIWYG editor to design and create your web page, you have a pretty good idea of how the page will look in a web browser. Think of Microsoft Word when you change a font, you see the font change immediately in the MS Word document. The same is true in a WYSIWYG Editor, in that you see changes immediately within the editor itself, as opposed to having to save the page and then separately load and view it in a web browser.

52. What is more important SEO or Web design?

Web Design and SEO (Search Engine Optimization) are not mutually exclusive. The best webmasters are familiar with Search Engine Optimization techniques, as well as Website and Graphical Design. It is difficult to have a successful website if you neglect either SEO or Design. The two are intricately woven, and really must coexist to achieve website success.

53. What is Dreamweaver template?

Dreamweaver templates allow webmasters to define "editable" and "non-editable" regions of a webpage. The "non-editable" regions can only be edited in the Dreamweaver Template. Any changes made to the Dreamweaver Template update any HTML pages that use the template.

54. Do you have any experience delegating tasks to subordinates, or do you work alone?

Some web designers work in teams or even companies. The head designer might be responsible for only part of the tasks, like client communication, research, coding, etc., while the others do graphics and copying.

55. Which areas of web design you work?

Design does not only mean graphics. Web designers are computer specialists. They write codes and use code programs (JavaScript, PHP, etc.).

Download Interview PDF

56. What is CSS file?

CSS stands for "Cascading Style Sheets", and are used to control and manage font styles, font sizes, and web site color combinations that are used in a web page. In order to retain continuity of "look and feel" throughout a website, all pages within a website will often refer to a single CSS file. The CSS file is typically contained in a separate file from the website, and the various web pages retrieve the CSS file each time a web page is displayed. CSS files make global appearance changes easy a single change in a CSS file will mean that any pages using that CSS file will automatically display the changes.

57. Define web template?

A website template is a ready-made HTML layout for webmasters. Typically, webmasters need to only edit the text and links in the HTML page, and they can then have a website up and running in a very short amount of time. Web templates make the creation of a website easier and faster. Web templates are easy to edit and customize using an HTML editor.

58. Tell me what artistic education or expertise can you bring to the job of a web designer in our company?

Web designers are visual artists. They usually combine computer education with web design coursework, but a degree or course in art is also valued. A special challenge for designers of websites is to create an aesthetically pleasing interactive environment - the site should not only look beautiful, but be easy and interesting to navigate.

59. As a web designer what market areas do you specialize in?

Web designers can work in multiple sectors, but over time they usually begin to specialize. If you don't yet have much experience, you have probably done different jobs in different sectors. You might still say what you feel most expert at, like business sites or personal sites. And if you do specialize already, then say so with confidence. But you might also want to mention your creative adaptability.