Web Designer interview Questions

Web Designer interview Questions

  1. How do you place two paragraphs next to each other?
    1. Float one or both inner divs with float left and width
  2. What is CSS declaration?
    1. A declaration is made up of a property name and a value, separated by a colon
  3. What are CSS pseudo-classes?
    1. CSS pseudo-classes are used to add special effects to some selectors.
      1. Selector:pseudo-class {property:value;}
      2. selector.class:pseudo-class {property:value;}
      3. Example : a.red:visited {color:#FF0000;}
  4. Can Style Sheets and HTML stylistic elements be used in the same document?
    1. yes
  5. I made a 10px-height div, but IE makes it 20px height how to solve this ?
    1. when you make a div just to contain the bottom border of a box solution is make font size is zero
  6. What is grouping in CSS?
    1. If you want to apply same styles to few properties then grouping is best to use the syntax is below
      1. .copyright, .tagline, .hint {font-style: italic}
  7. What is parent-child selector?
    1. Parent-child selector is a selector representing the direct descendent of a parent element. Parent-child selectors are created by listing two or more tilde (~) separated selectors.BODY ~ P {background: red; color: white} The P element will be declared the specified style only if it directly descends from the BODY element:<BODY> <P>Red and white paragraph </P> </BODY>
  8. What is cascade?
    1. Cascade is a method of defining the weight (importance) of individual styling rules thus allowing conflicting rules to be sorted out should such rules apply to the same selector.
  9. Is Style Sheets case sensitive?
    1. No
  10. How to include comments in Style Sheet?
    1. Syntax: /* This is a CSS-comment */
  11. How do you target a certain browser?
    1. IE can be targetted by preceding your properties with ‘* html’. For example…
      #nav {position:relative;}
      * html #nav { /* this will target IE */
      position:absolute; }

    2. and the second way is
      <!--[if IE]> <link href="ieonly.css" rel="stylesheet" type="text/css"> <![endif]—>
  12. What is !important ?
    1. It will override declarations with normal weight .
  13. Can CSS be used with other than HTML documents?
    1. Yes. CSS can be used with any structured document format.
  14. Which characters can CSS names contain ?
    1. A to Z, a to z, 0 to 9 and Unicode characters 161 to 255
  15. How do you make a tool tip that appears on hover?
  1. <a title="This is some information for our tooltip." class="tooltip">CSS3 Tooltip</a>
    display: inline;
    position: relative;

    .tooltip:hover:after{background: #333;
    background: rgba(0,0,0,.8);
    border-radius: 5px;
    bottom: 26px;
    color: #fff;
    content: attr(title);
    left: 20%;
    padding: 5px 15px;
    position: absolute;
    z-index: 98;
    width: 220px;
Web designer adobe Photoshop,html,css interview questions and answers

Web designer adobe Photoshop,html,css interview questions and answers

  1. What is difference between properties and attributes ?
  1. Every body thinks that property and attributes are same but in real those are different.
    the syntax of property and attributes is
    <property attribute="attributeValue">proopertyValue</property>
    for more details you can visit here
  • write a border radius for all browsers ?
    1. -webkit-border-radius: 5px;
      -moz-border-radius: 5px;
      border-radius: 5px;
  • if you are writing a special css file for ie you will attach  it in head section and we will comment it but how the browser read it ?
    1. it was called as conditional comments. for example
      <!--[if IE ]> <link href="iecss.css" rel="stylesheet" type="text/css"> <![endif]—>
      we will write the code as above we have closed the IE in conditional statement called “if “ in square braces.
      The enclosed HTML content—a <link> tag—will be revealed to all IE browsers that support conditional comments. It links to a style sheet that only IE will see. All browsers other than IE versions 5 and later will see the code above as one simple HTML comment. If we remove the brackets and text for the sake of clarity, we’re basically left with a normal comment structure as follows:
        <link href="iecss.css" rel="stylesheet" type="text/css" >
  • What is the shortcut key for 100% zoom in Photoshop ?
    1. Double click on zoom tool
  • What is CS in adobe version numbers ?
    1. CS means Creative Suit
  • What a lasso tool? For what purposes it can be used?
    1. The lasso tool was an  selection tools (shortcut L). It was used for selection .
  • Can you make gif animations using Photoshop tool?
    1. yeas Photoshop has a small tool called Imgeready to do 2d animations.
  • Which tool(s) will you choose to slice up an image in Adobe Photoshop?
    1. Crop tool
  • What is the use of notes tool(N) in adobe Photoshop ?
    1. To make comments.
  • How do you export the Photoshop file to web ?
    1. Slice the image with Slice tool (k) and press alt+shift+ctrl+f, select the save button in the next dialogue box and save type is Images and HTML.
    Interview Questions and answers for web designers – HTML & CSS

    Interview Questions and answers for web designers – HTML & CSS

    1. How can we submit a form without a submit buttom?
    2. How do I center a table?
    3. Can I include comments in my Style Sheet?
    4. In DHTML what is the difference between “FontSize” and “Font Size”
    5. HTML is a Programming Language or Scripting Language?
    6. How do I quote font names in quoted values of the style attribute?
    7. What are META tags?
    8. How can I check for errors om html?
    9. How do I make my div 100% height?
    10. what can be done with style sheets that can nit be accomplished with regular HTML ?
    11. Is there anything that can’t be replaced by style sheets ?
    12. What browsers support style sheets? To what extent?
    13. Do any WYSIWYG editors support the creation of Style Sheets? Any text-based HTML editors?
    14. Can you use someone else’s Style Sheet without permission?
    15. What does the “Cascading” in “Cascading Style Sheets” mean?
    16. Which style specification method should be used? Why?
    17. What are the advantages/disadvantages of the various style methods?
    18. How do you override the underlining of hyperlinks?
    19. What is the difference between ID and CLASS?
    20. Which characters can CSS-names contain?


    Download the answers file here


    HTML, CSS, JS, Interview Question and answers

    HTML, CSS, JS, Interview Question and answers

    1. What is HTTP ?
      1. HTTP is standards for Hyper Text Transfer Protocol.
    2. What does it mean Small lock on the status bar?
      1. It was a secured connection.
    3. Which is better, gif or jpg format, justify?
      1. Generally JPG is used for High resolution Images, such as artistic images but this takes lot of size in document.  The people who uses slow connections they may face the problems like slow loading but in GIF format it takes low size in 128depth and 256 depth colors and we can also use small animations in GIF format.
    4. Explain HTML Frames (Frames, iFrame, NoFrame, Target controls, Frame Attributes) ?
      1. Frames concept is used to load multiple pages in a single page. We can create frame page by horizontally and vertically if we want to use horizontal frames we use Where Iframe is used.
    5. What is the purpose of an HTML forms?
      1. To get few details from the user.
    6. How Many maximum colors does GIF has ?
      1. 256
    7. Write HTML code to create a INLINE Frame ?
      1. <iframe src=”demo_iframe.htm” width=”200″ height=”200″></iframe>
    8. Why is JavaScript not a programming language but script language? Justify
      1. Write JavaScript code to call multiple function with a single events ?
    9. Write HTML code to control the margins of page?
      1. <body  topmargin=”50”, leftmargin=”50”>
    1.                                                                i.      The above script makes 50px left and top margin
    2. Meta elements are typically used to specify page description, keywords, author of the document, last modified, and other metadata.
    3. The <meta> tag always goes inside the <head> element.
    4. The metadata can be used by browsers (how to display content or reload page), search engines (keywords), or other web services.
    5. The <meta> tag provides metadata about the HTML document. Metadata will not be displayed on the page, but will be machine parsable
    1. Write JavaScript code to call multiple functions with a single event ?
      1. onclick = “f1(); f2”
        or onclick = “funct()”
        function funct() {

    2. Write JavaScript code to change an image when the users mouse points
      1. document.getElementById(“id”).src = “url Value”;
    3. What is META Tags ?
    1. How can i control the tab order in HTML Form elements?
      1.  <form>
        Field 1 (first tab selection):
        <input type=”text” name=”field1″ tabindex=1 /><br />
        Field 2 (third tab selection):
        <input type=”text” name=”field2″ tabindex=3 /><br />
        Field 3 (second tab selection):
        <input type=”text” name=”field3″ tabindex=2 /><br />
    2. How do i get a pop up window to always stay on top using JavaScript ?
      1. <SCRIPT LANGAUGE=”JavaScript”><!–
        function newWindow(file,window) { msgWindow=open(file,window,’resizable=no,width=200,height=400′);
    3. Difference between the DIV and Tables ?
      1. Div generally separates a block of code. It can contain any number of elements, and is controlled by CSS. Think of a table as a block of cells cut into squares. Each cell in the table can be customized and shaped as needed. While both are acceptable for building websites, web developers will tell you that using CSS and divs is the way to go.
    4. Difference between the DIV and SPAN  and  Why Can’t I use only SPAN tag in Document ?
      1. The main difference between the DIV and Span tag is
    5. What is RIA (Rich Internet Application) ?
      1. A rich Internet application (RIA) is a Web application designed to deliver the same features and functions normally associated with deskop applications. RIAs generally split the processing across the Internet/network divide by locating the user interface and related activity and capability on the client side, and the data manipulation and operation on the application side.
    6. What is web 2.0 ?
      1. Web 2.0 is a concept that takes the network as a platform for information sharing, interoperability, user-centered design and collaboration on the World Wide Web. A Web 2.0 site allows users to interact and collaborate with each other in a social media dialogue as creators  of user-generated content in a virtual community, in contrast to websites where users are limited to the passive viewing of content that was created for them.
    7. What is Semantic Web?
      1. The Semantic Web is a collaborative movement lead by the World Wide Web Consortium (W3C). The standard promotes common data formats on the Web. By encouraging the inclusion of semantic content in web pages, the Semantic Web aims at converting the current web dominated by unstructured and semi-structured documents into a “web of data”. The Sematic Web stack builds on the W3C’s Resource Description Framework (RDF).
    8. What are the difference between DIV tag and SECTION element ?
      1. If you need the element simply to add styles to that area of the page, you should use theDIV element.
      2. If that area of the page has a specific meaning, for example it holds all your social media elements or it contains your blogroll, then you should use the SECTION element.