Frequently Asked Interview Questions And Answers For Web Designing Freshers

50,000+ Students Trained, 19+ Our Offices, 18+ Courses Offered,

Job Guarantee + Job Satisfaction, 2000+ Company Tie Ups For Placements

Web Designing Interview Questions

Web Designing Technical Interview Question

  1. What are the markup language or platform used for web-design?
  Ans. There are many language used in web designing, such as: a)HTML:-HTML stands for hypertext transfer protocol, it is use to make a website layout template, when you creating and website layout with html,the template will be a stagnant.In that we cannot click on any of the buttons. For ex:-if you have created amazon website template with the help of html only then we cannot click on home button or contact us button we have to apply css for clicking on particular button. b)HTML5:-It’s an updated version of HTML.In this we can get a by default syntax. c)CSS:-css stands for cascading style sheet,with the help of css we can click on any button after applying css code. d)css3:-CSS3 makes changes to how some visual elements are implemented and rendered by a browser.  
  1. How can we set an image as a background on web pages?
  Ans We can set image as page background – body { Background-image: URL(‘image path’) }
  1. What is a Dreamweaver Template?
Ans: In a Dreamweaver Template you can create a fixed page layout.When you design a template you have to specify as editable so that content user can edit in a document easily based on the templates.So it’s is termed as Dreamweaver template.  
  1. Explainthe text effects of CSS 3?
Ans.There are many text effects in css3,like:- a)3d text:-In this you can apply hover, magnify and zoom,shadow,overlay are some effect used in 3d text. b)3d text stroke:-you can apply text stroke as per the user requirement. c)3d extrude text effect:-In this you see your text as looking like a double layer. d)break warping text:-It shows a warping effect on the text.  
  1. What is float property inCSS ?
Ans.float property shows that element have to placed either right side or a left side of the can use some keyword values and global values   float: left; float: right; float: inline-start; float: inline-end; float: inherit; float: unset;
  1. What is jQueryfunction ?
Ans. The $(document).ready() method allows us to execute a function when the document is fully loaded.The click() method attaches an event handler function to an HTML element. The function is executed when the user clicks on the HTML element.  
  1. What is HTML?
Ans. HTML(HypertextMarkupLanguage)isthelanguageusedtocreateweb pagedocuments.An HTML file is a text file containing small markup tags The markup tags tell the Web browser how to display the page An HTML file must have an htmor html file extension An HTML file can be created using a simple text editor.  
  1. What is the difference between the application model of HTML and HTML5?
Ans.HTML:-HTML is a simple language for text and images on a webpages. b)HTML can be referred to as the Worldwide Web’s primary language. HTML5:- can be viewed as an application development platform and , including             better support for audio, video, and graphics. b)HTML5 is an updated version of HTML,In this we can get a bydefult syntax.  
  1. Explain the CSS box model ?
Ans.When laying out a document,each element has a rectangular box according to the standard CSS box model. CSS defines the size, position, and properties like color, background, border size and many things for these boxes.   Every box is made up of four parts define by their particular edges like  content edge, padding edge, border edge, and margin edge.  
  1. What are media queries?
Ans.Media Queries is a module allowing content rendering to adapt to conditions such as screen resolution,Inshort it is used to give a perfect size to a perfect device (responsive). It is used to check various things such as height and width of view port and device,orientation and resolution.  
  1. What is the difference between undeclared and undefined variables?
Ans: Undeclared variables:-uncleared variables are that type of variables which are not declared in program, but if it assigned some values then implicit declaration can be possible.undefined variable:-undefined variables are that which does notnot assigned any values but declared in the program is called undefined variables.  
  1. What is jquery?
Ans: jQuery simplifies the syntax for finding, selecting, and manipulating the DOM elements. The jQuery having the following features:   HTML/DOM manipulation CSS manipulation HTML event methods Effects and animations AJAX Utilities  
  1. What Is the Format of an AJAX Request ?
Ans. $.ajax({name:value, name:value, … })  
  1. How can we hide an image on a button click using jQuery different JavaScript types?
Ans. HTML code <img id=”img1″/> <img id=”img2″/> <div id=”div1″/> <div id=”div2″/> <div id=”div3″/> <div id=”div4″/> JQUERY code $(“#img1”).on(‘click’, function() { $(this).hide(); $(“#div2, #div3, #div4”).hide(); $(“#div1”).show(); });  
  1. What is the basic difference between an alert box, Prompt Box and a confirm box?
Ans :Alert:-The alert() dialog box is used to communicate a message to the user. ex:- If you written wrong username an alert dialog box will popup that username              is wrong. Prompt:-The prompt() method asks the user for some small input such as a password,           completion of a form input, or personal information, such as nickname or           title. Confirm box:- In confirm box a question mark will appear in the box with an OK button                 and a Cancel button,if user click on ok then true will return or if user have clicked cancel then false will return.  
  1. How many markup elements do you know used in HTML5?
Ans: There are many element of HTML5 like – <article> Define an article in a document <aside> Defines content aside from the page content <bdi> Isolates a part of text that might be formatted in a different direction from    other text outside it <details> Defines additional details that the user can view or hide <dialog> Defines a dialog box or window <figcaption> Defines a caption for a <figure> element <figure> Defines self-contained content <footer> Defines a footer for a document or section <header> Defines a header for a document or section  
  1. What is the use of local storage in HTML5?
Ans: Local storage is used to store data locally of web applications within the user’s browser. Web storage is more secure, and large amounts of data can be stored locally, without affecting website performance.  
  1. What are the three main ways to add CSS to a webpage? Describe the advantages and disadvantages of each method.
Ans: these are the three ways to use CSS like – 1)Internalstylesheet 2)Externalstylesheet 3)Inlinestlesheet.   Internalstylesheet:-An internal stylesheet holds the CSS code for the webpage in the head section of the particular file.   Externalstylesheet:-The External Stylesheet is a .css file that you link your website.   Inlinestylesheet:-The inline style uses the HTML “style” attribute. This allows CSS properties on a “per tag” basis.
  1. What is a CSS preprocessor?
Ans:A CSS preprocessor means that in one program that take one type of data and converting into another type of data is called csspreprocessor. Let us take a css preprocessor language such as HAML(HTML) & SASS(CSS).  
  1. How to create frames? And Explain What is a frameset?
Ans:We can create frames using – <html> <head> <title>ABCD</title> </head> <frameset rows = “20%,60%”> <frame name =”top”src=”/html/top_frame.html”/> <frame name =”main”src=”/html/main_frame.html”/> <noframes> <body>Your browser does not support frames.</body> </noframes> </html> A frameset is an element in hypertext markup language (HTML) which contains the different frame elements  
  1. What is a Hypertext link?
Ans:Hypertext link means the text between the start and end tag which defines the label for the link. By Selecting the link takes the reader to the document specified by the HREF attribute.  
  1. Does a hyperlink apply only to text?
Ans.No,It can apply also on an image.  
  1. What is the advantage of using frames?
Ans. The main advantage is that it allows you to see multiple document by a single webpage.It is possible to load pages from different servers from one framset.  
  1. How to we can give thereference of .css file in the web page?
Ans. If we have to refer to the .css file in the web page user have to use <link>tag.It can be written inside the <head></head> tag. For ex:-<link href=”/css/mystyle.css”  
  1. How to create nested tables within tables in HTML?
Ans: we can create table within table – <table><tr> <td>first cell</td><td> <table> <tr><td>nested table</td></tr> <tr><td>nested table</td></tr> </table> </td> </tr> </table>
  1. How to we can place any element in center  ofthe  HTML document?
Ans:we can place any element in center using  Center tag  
  1. what is the use of  Cell Padding and Cell Spacing in HTML?
Ans:cell padding:-cell padding means a space which can be given inside the cells and in between the border of the cell and also the text which is written in the cell is known as cell padding. Cell spacing:-cell spacing means the space which is given between the cells is known as cell spacing.  
  1. What is the use of marquee tag in HTML ?
Ans: Firstly marquee tag is used in HTML,it is used to insert a scrolling area front the text.It can be done horizontally as well as vertically when scrolling your websitepage.marquee tag is defined inside the body tag,and its iis defined by its directions.  
  1. What is the Use of SPAN in HTML and give one example?
Ans: Span is much like div tag.span is used for styling and grouping  with the help of their class and id.span tag is used with inline elements. ex:-<html>   <head> <title>Tops</title> </head>   <body> <p>TOPS <span style = “color:#800000;”> Tops</span>Tops</p>   <p><span style = “color:#0000FF;”> Tops</span></p> </body>   </html>    
  1. What is the importance of Doctype in HTML?
Ans: DocType is written by default firstly on the HTML document.Doctype is not any tag,but it is shows to the web browser that which kind of version of markup language is written in the page. The doctype declaration refers to DTD (document type definition).   35.What are the different types of entities in HTML? Ans:There are lots of entities are there in HTML
  • ASCII Characters
  • ISO 8859-1 Characters
  • ISO 8859-1 Symbols
  • Math Symbols
  • Greek Letters
In this also a specific entities are termed inside everyone.  
  1. What is Bootstrap?
Ans: Bootstrap is a one type of frontend framework for web development. Inboostrap HTML & CSS based design templates used for common user interface like button,tables, navigations,alerts,tabs,etc.Bootstrap also used to help  to create a responsive website layout easily. It is compatible with all kinds of browsers.   37.What is the importance of  Bootstrapto building the websites? Ans: Bootstrap is most important to design web sites like – 1)It is easy to use. 2)It is an open source. 3) compatible with all web browsers. 4)Grid system (It is built on 12 column grids,layouts and components). 5) Different elements is  having (code,tables,buttons,navigations,alerts,images,typography) 6)Bundled JavaScript plugins.   38.Key components of Bootstrap? Ans: These are the main key component of Bootstrap –
  • Dropdowns
  • Button Groups
  • Navigation Bar
  • Labels
  • Badges
  • Alerts
  • Progress Bar etc.
This all components are prestyled.  
  1. What are the types of layout available in Bootstrap?
Ans: Types of layout are :- 1)Fixed layout(.container) 2)Fluid layout(.container-fluid) 1)Fixed layout:-It has specific pixel width values that change its width value with the help of media queries. 2)Fluid layout:-It is used when you want to create a app that is 100% wide and use up all the width of the screen.   40.What is Bootstrap Grid System? Ans:Bootstrap’s grid system uses a line of containers,rows,and columns to layout and align content.In a grid layout, content must be placed within the columns. To make the grid responsive,there are five grid breakpoints,one for each responsive breakpoint like  extra small,small,medium,large,andextra large. ex:-<div class=”container”> <div class=”row”> <div class=”col-sm”> TOPS </div> <div class=”col-sm”> TOPS </div> <div class=”col-sm”> TOPS </div> </div> </div>  
  1. What is Offset columns in Bootstrap?
Ans: Offset Columns create gaps between column content via padding.That padding is offset in rows for the first and last column with negative margin on rows. for ex:- <div class=”row”> <div class=”col-md-4″>.col-md-4</div> <div class=”col-md-4 offset-md-4″>.col-md-4 .offset-md-4</div> </div>  
  1. What is the column ordering in Bootstrap?
Ans: Column ordering means that the order of the columns in your html should be display properly on each an every device whether it will be a mobile,tablet or a desktop. It can be based on a grid system which is based on different web browser size.  
  1. What is the difference between Bootstrap and Foundation?
Ans: Bootstrap and Foundation both are framework of responsive design to create a responsive layout.  
  1. In Bootstrap what are the two ways we can display the code?
Ans:  In bootstrap there are two ways:- 1)<code>tag:-If user want to display their code inline then <code> tag is used. 2)<pre>tag:-If user is having a multiple lines then he or she have to use <pre> tag.  
  1. what is Modal plugin used for in Bootstrap?
Ans:The Modal plugin is a dialog box/popup window.The .modal class identifies the content of <div> as a modal and brings focus to it. Modals are widely used to warn users for situations like session time out or to receive their final confirmation before going to perform any critical actions such as saving or deleting important data.  
  1. What is Bootstrap Container?
AnsBootstrap container is used to set content margins of the layout to make a responsive as per the particular devices.The container class is used to create boxed content. Containers are the most important element in Bootstrap it required when using a grid system.

Tips & Tricks

Latest Blog

Which country is better for Indian Students for Study Abroad?17th November, 2018

Canada is one amongst the most effective places to pursue your higher studies and therefore the coun

How to migrate to Canada?17th November, 2018

Have you more experienced necessary facts and options regarding Canada? If no, then you are here at

Study Abroad with Minimum finance17th November, 2018

Some students might wonder how they can study abroad with less money. When they can’t find a spons

How to Become a Good Designer?8th October, 2018

Graphic, Web, Animation, VFX, UI, UX There are plethora of options for a designer to make an amaz

Is Digital Marketing a Right Career For You?2nd October, 2018

Digital Marketing is an industry in itself that is growing rapidly since its inception. And since th

Our Events

Gyanmanjari Institute Of Technology Industrial Visits on 30th June 2018

Gyanmanjari Institute Of Technology Industrial Visits on 30th June at TOPS Technologies TOPS Techno

Android, Laravel, Python, Java and iOS Workshop at TOPS Technology

Android, Laravel, Python, Java and iOS Workshop at TOPS Technology We are happy to share that once

Project Documentation Workshop at TOPS Technologies

Project Documentation Workshop TOPS Technologies have organized “Project documentation” worksho

Final Year Project Documentation Workshop

Final Year Project Documentation Workshop Project Documentation, Project Definition, project Submis

Industrial Visit in the month of March and April at TOPS Technologies

Industrial Visits in the month of March and April at TOPS Technologies TOPS Technologies always bel