Top most important Web Design interview questions and answers by Experts:
Here is a list of Top most important Web Design interview questions and answers by Experts.If you want to download Web Design interview questions pdf free ,you can register with RVH techguru. Our experts prepared these Web Design interview questions to accommodate freshers level to most experienced level technical interviews.
If you want to become an expert in Web Design ,Register for Web Design online training here.
1) What do you mean by CSS File? What is the use of this file ?
CSS stands for “Cascading Style Sheets”, and are used to control and manage font styles, font sizes, and web site colour 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 change
2) How do I make a Image as a background on my web pages?
Point the body background to the name of your image you wish to use as the background as shown below. This body line should be the first line after your
< / head> tag.
< body background=”picture.gif” >
You can also have the background image fixed, so it does not move when using the scroll bar in the browser. To do this add the BGPROPERTIES tag as shown below.
< body background=”picture.gif” bgproperties=”fixed” >
3) How to add scrolling text to my page?
Keep in mind not all browsers support scrolling text. however to do this add a tag similar to the below example. < marquee >THIS WOULD SCROLL< /marquee> The above example would create the below scrolling text. If your browser supports scrolling text the below example should be scrolling. More examples can be found on our main HTML page that lists most of the HTML commands.
4) How do I make it so that someone can mail me by just clicking on text with subject?
Use the mailto command in your A HREF link tag as shown below.
< A HREF=”mailto:support@computerhope.com?Subject=Enquiry” “>Click here to mail Computer Hope< / A> .
5) How do I align pictures so that one may be higher or lower than the other?
Use the align statement in your IMG SRC tag as shown below. < IMG SRC=”http://www.computerhope.com/chguy.gif” align=top > Also, instead of align=top you can do align=middle, and align=bottom. .
6) What is external Style Sheet? How to link?
External Style Sheet is a template/document/file containing style information which can be linked with any number of HTML documents. This is a very convenient way of formatting the entire site as well as restyling it by editing just one file. The file is linked with HTML documents via the LINK element inside the HEAD element. Files containing style information must have extension .css, e.g. style.css.
< HEAD > < LINK REL=STYLESHEET HREF=”style.css” TYPE=”text/css”> < / HEAD>
7) Is CSS case sensitive?
Cascading Style Sheets (CSS) is not case sensitive. However, font families, URLs to images, and other direct references with the style sheet may be. The trick is that if you write a document using an XML declaration and an XHTML doctype, then the CSS class names will be case sensitive for some browsers. It is a good idea to avoid naming classes where the only difference is the case, for example: div.myclass { …} div.myClass { … } If the DOCTYPE or XML declaration is ever removed from your pages, even by mistake, the last instance of the style will be used, regardless of case.
8) What are the five possible values for “position”?
Values for position: static, relative, absolute, fixed, inherit
9) What are JavaScript types?
Number, String, Boolean, Function, Object, Null, Undefined.
10) What does is NaN function do?
Return true if the argument is not a number.
11) How do you convert numbers between different bases in JavaScript?
Use the parseInt() function, that takes a string as the first parameter, and the base as a second parameter. So to convert hexadecimal 3F to decimal, use parseInt (“3F”, 16);
12) What is negative infinity?
It’s a number in JavaScript, derived by dividing negative number by zero.
13) What does “1”+2+4 evaluate to?
Since 1 is a string, everything is a string, so the result is 124.
14) What is the difference between an alert box and a confirmation box?
An alert box displays only one button which is the OK button whereas the Confirm box displays two buttons namely OK and cancel.
15) What is a prompt box?
A prompt box allows the user to enter input by providing a text box.
16) 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.
17) 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 backstory that describes your “Aha!” moment.
18) 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.
19) 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.
20) 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.
21) 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.
22) 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’ attribute, being aware of standard font sizes and text direction, and language word length (may affect layout).
23) 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.
24) 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.
25) 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 <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).
26) 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 Quirks Mode. See example:
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>.
27) 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.
28) 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.
29) How many HTML tags are should be used for the most simple of web pages?
8 total. 4 pairs of tags.
<HTML>
<HEAD>
<TITLE>Simplest page ever!</TITLE>
</HEAD>
<BODY>
Doesn’t get simpler than this.
</BODY>
</HTML>
30) 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 “*<!–” and end with ” –>“.
<!– Insert comment here. –>
31) What is 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:send@here.com.” See examples below:
<img src=”HTMLrocks.jpg”></img>
<a href=”skilprelaunch2.wpengine.com”>Skilledup</a>
<a href=”brad@skilledup.com”>Email Me</a>
32) 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.
33) What is the syntax difference between a bulleted list and numbered list?
Bulleted lists use the <ul> tag, which stands for “unordered,” whereas <ol> is used to create an ordered list.
34) What is 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.
35) What is the difference between the application model of 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.
36) what’s the real difference between HTML and HTML5?
There are many. 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 Silverlight, Apache Pivot, and Sun JavaFX are no longer needed, because browsers can now process these elements without additional requirements.
37) What is the 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 <!doctype html>.
38) What are 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>.
39) What are the new media-related elements in HTML5?
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.
40) What are the new image elements in HTML5?
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.
41) What is 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.
42) What are some new input attributes in HTML5?
There are many new form elements including: datalist, datetime, output, keygen, date, month, week, time, number, range, email, and url.
43) What are data- attributes good for?
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.
44) What is 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.
45) What purpose do Work Workers serve and what are some of their benefits?
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.
46) Describe the difference between cookies, sessionStorage, and localStorage.
Cookies are small text files that websites place in a browser for tracking or login purposes. Meanwhile, localStorage and sessionStorage are new objects, both of which are storage specifications but vary in scope and duration. Of the two, localStorage is permanent and website-specific whereas sessionStorage only lasts as long as the duration of the longest open tab.
47) What are some of the major new API’s that come standard with HTML5?
To name a few: Media API, Text Track API, Application Cache API, User Interaction, Data Transfer API, Command API, Constraint Validation API, and the History API.
48) What is the difference in 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.
49) What elements have disappeared?
As mentioned above, <frame> and <frameset> have been eliminated. Other elements that are no longer supported include: <noframe>, <applet>, <bigcenter> and<basefront>.