Web Technologies Interview Questions and Answers

In this article we are going to answer the most frequently asked Interview questions related to the Web Technologies, The questions answered in this article are related to HTML and CSS, JavaScript and PHP.

What is HTML?

HTML, or HyperText Markup Language, is a Universal language which allows an individual to create a frame or structure for a webpage.

What is an HTML tag?

In HTML, a tag tells the browser what to do. When we write an HTML page, we enter tags for many reasons -- to change the appearance of text, to show a graphic, or to make a link to another page.

How do I create frames? What is a frameset?

Frames allow an author to divide a browser window into multiple (rectangular) regions. Multiple documents can be displayed in a single window, each within its own frame. Graphical browsers allow these frames to be scrolled independently of each other, and links can update the document displayed in one frame without affecting the others.
You can't just "add frames" to an existing document. Rather, you must create a frameset document that defines a particular combination of frames, and then display your content documents inside those frames. The frameset document should also include alternative non-framed content in a NOFRAMES element.
The HTML 4 frames model has significant design flaws that cause usability problems for web users. Frames should be used only with great care.

How can I include comments in HTML?

Technically, since HTML is an SGML application, HTML uses SGML comment syntax. However, the full syntax is complex, and browsers don't support it in its entirety anyway. Therefore, use the following simplified rule to create HTML comments that both have valid syntax and work in browsers:
An HTML comment begins with "<!--", ends with "-->", and does not contain "--" or ">" anywhere in the comment.
The following are examples of HTML comments:

* <!-- This is a comment. -->
* <!-- This is another comment,
and it continues onto a second line. -->
* <!---->

What is a Hypertext link?

A hypertext link is a special tag that links one page to another page or resource. If you click the link, the browser jumps to the link's destination.

What is a DOCTYPE? Which one do I use?

According to HTML standards, each HTML document begins with a DOCTYPE declaration that specifies which version of HTML the document uses. Originally, the DOCTYPE declaration was used only by SGML-based tools like HTML validators, which needed to determine which version of HTML a document used (or claimed to use).

Today, many browsers use the document's DOCTYPE declaration to determine whether to use a stricter, more standards-oriented layout mode, or to use a "quirks" layout mode that attempts to emulate older, buggy browsers.

How do I align a table to the right (or left)?

You can use <TABLE ALIGN="right"> to float a table to the right. (Use ALIGN="left" to float it to the left.) Any content that follows the closing </TABLE> tag will flow around the table. Use <BR CLEAR="right"> or <BR CLEAR="all"> to mark the end of the text that is to flow around the table, as shown in this example:
The table in this example will float to the right.
<table align="right">...</table>
This text will wrap to fill the available space to the left of (and if the text is long enough, below) the table.
<br clear="right">
This text will appear below the table, even if there is additional room to its left.

Explain Cell Padding and Cell Spacing.

Cell Padding: it refers to the gap or space between the cell content and cell border or cell wall.
Cell Spacing: It refers to the gap between the two cells of same tables.
In HTML cell spacing and padding both are used with Table Border layout.

<table border cellpadding=2>
<table border cellspacing=2>
<table border cellpadding=2 cellspacing=2>

How to create a button which acts like a link?

To create buttons which act as a hyperlink, there are two ways:

<FORM ACTION="[url]" METHOD=get>
<INPUT TYPE=submit VALUE="Text on button">
<INPUT TYPE="submit" VALUE="Go to my link location" ONCLICK=";" /> 

What is difference between HTML and XHTML?

The differences between HTML and XHTML are:

HTML is application of Standard Generalized Markup Language(SGML) whereas XML is application of Extensible Markup Language(XML).
HTML is a static Web Page whereas XHTML is dynamic Web Page.
HTML allows programmer to perform changes in the tags and use attribute minimization whereas XHTML when user need a new markup tag then user can define it in this.
HTML is about displaying information whereas XHTML is about describing the information
How many types CSS can be include in HTML?

What are the three ways to include  CSS in an HTML file?

Inline CSS: it is used when only small context is need to be styled. To use inline styles add the style attribute in the relevant tag.

<p style="color:red;">Hello world</p>

External Style Sheet: is used when the style is applied to many pages, the CSS rules are defined in a sepreate CSS file. Each page must link to the style sheet using the <link> tag. The <link> tag goes inside the head section:

<link rel="stylesheet" type="text/css" href="mystyle.css" /> 

Internal Style Sheet: is used when a single document has a unique style. Internal styles sheet needs to put in the head section of an HTML page, by using the <style> tag, like this:

<style type="text/css"> 
hr {color:sienna} 
p {margin-left:20px} 
body {background-image:url("images/back40.gif")} 

What are logical and physical tags in HTML?

Logical tags are used to tell the meaning of the enclosed text. The example of the logical tag is <strong> </strong> tag. When we enclosed text in strong tag then it tell the browser that enclosed text is more important than other text.
Physical text are used to tell the browser that how to display the text enclosed in the physical tag.
Some example of the physical tags are: <b> , <big> , <i>

In HTML we can list the element in two ways:

Ordered list: in this list item are marked with numbers.

<li> first item </li>
<li>second item </li> 

Unordered Lists: in this item are marked with bullets.

<li> first item </li>
<li>second item </li> 

What is CSS?

CSS stands for Cascading Style Sheets. By using CSS with HTML we can change the look of the web page by changing the font size and color of the font. CSS plays an important role in building the website. Well written CSS file can be used to change the presentation of each web page. By including only one CSS file. It gives web site developer and user more control over the web pages.

How to insert Javascript in HTML?

To learn more about JavaScript visit : JavaScript Tutorials For Beginners

We can insert JavaScript in HTML using <script> tag. JavaScript can be enclosed in <script type = text/javascript> and ending with </script>.

        <script type="text/javascript"> 
               //JavaScript code

List various font attributes used in a CSS.

  • font-style
  • font-variant
  • font-weight
  • font-size/line-height
  • font-family
  • caption

Explain inline, embedded and external style sheets.

If only a small piece of code has to be styled then inline style sheets can be used.

Embedded style sheets are put between the <head> </head> tags.

If you want to apply a style to all the pages within your website by changing just one style sheet, then external style sheets can be used.

How do I create a link that opens a new window?

<a target="_blank" href=...> opens a new, unnamed window.
<a target="example" href=...> opens a new window named "example", provided that a window or frame by that name does not already exist.
Note that the TARGET attribute is not part of HTML 4 Strict. In HTML 4 Strict, new windows can be created only with JavaScript. links that open new windows can be annoying to your readers if there is not a good reason for them.

What is the difference between the HTML form methods GET and POST?

The method parameter specifies which method the client is using to send information to the WEB server. The method determines which parameter you will find the CGI request data in:
* POST - post_args
* GET - httpargs

What is the DOM?

DOM is a platform independent, World Wide Web Consortium (W3C) standard form of representation of structured documents as an object-oriented model. It is an application programming interface so as to access HTML and XML documents.

Document Object Model (DOM) is used to query, traverse and manipulate documents like XML or HTML documents. DOM is best suited where the document must be accessed repeatedly or out of sequence order. DOM allows accessing the contents of a web page. It also allows dealing with events that allows capturing and responding to user’s actions. There are different levels of DOM standards depending on the compatibility of the browsers. 

What is the HTML DOM? 

The HTML DOM API specializes and adds the functionality to relate to HTML documents and elements. It addresses the issues of backwards compatibility with the Level 0 of DOM and provides mechanisms for common and frequent operations on HTML documents

What is JavaScript?

JavaScript is a platform-independent,event-driven, interpreted client-side scripting language developed by Netscape Communications Corp. and Sun Microsystems.

JavaScript is a general-purpose programming language designed to let programmers of all skill levels control the behavior of software objects. The language is used most widely today in Web browsers whose software objects tend to represent a variety of HTML elements in a document and the document itself.

But the language is used with other kinds of objects in other environments. For example, Adobe Acrobat Forms uses JavaScript as its underlying scripting language to glue together objects that are unique to the forms generated by Adobe Acrobat.

Therefore, it is important to distinguish JavaScript, the language, from the objects it can communicate with in any particular environment.

When used for Web documents, the scripts go directly inside the HTML documents and are downloaded to the browser with the rest of the HTML tags and content.

How is JavaScript different from Java?

Don't be fooled by the term Java in both. Both are quite different technologies.

JavaScript was developed by Brendan Eich of Netscape; Java was developed at Sun Microsystems. While the two languages share some common syntax, they were developed independently of each other and for different audiences. Java is a full-fledged programming language tailored for network computing; it includes hundreds of its own objects, including objects for creating user interfaces that appear in Java applets (in Web browsers) or standalone Java applications. In contrast, JavaScript relies on whatever environment it's operating in for the user interface, such as a Web document's form elements.

JavaScript was initially called LiveScript at Netscape while it was under development. A licensing deal between Netscape and Sun at the last minute let Netscape plug the "Java" name into the name of its scripting language. Programmers use entirely different tools for Java and JavaScript. It is also not uncommon for a programmer of one language to be ignorant of the other. The two languages don't rely on each other and are intended for different purposes. In some ways, the "Java" name on JavaScript has confused the world's understanding of the differences between the two. On the other hand, JavaScript is much easier to learn than Java and can offer a gentle introduction for newcomers who want to graduate to Java and the kinds of applications you can develop with it.

What are JavaScript types? 

Visit following link for the Answer : Variables in JavaScript-JavaScript tutorials for beginners

What is the difference between undefined value and null value? 

(i)Undefined value cannot be explicitly stated that is there is no keyword called undefined whereas null value has keyword called null.

(ii)typeof undefined variable or property returns undefined whereas typeof null value returns an object.

What is event bubbling?

Event bubbling describes the behavior of events in child and parent nodes in the Document Object Model (DOM); that is, all child node events are automatically passed to its parent nodes. The benefit of this method is speed, because the code only needs to traverse the DOM tree once. This is useful when you want to place more than one event listener on a DOM element since you can put just one listener on all of the elements, thus code simplicity and reduction. One application of this is the creation of one event listener on a page’s body element to respond to any click event that occurs within the page’s body.

What is XML?

XML is the Extensible Markup Language. It improves the functionality of the Web by letting you identify your information in a more accurate, flexible, and adaptable way.
It is extensible because it is not a fixed format like HTML (which is a single, predefined markup language). Instead, XML is actually a metalanguage—a language for describing other languages—which lets you design your own markup languages for limitless different types of documents. XML can do this because it's written in SGML, the international standard metalanguage for text document markup (ISO 8879).

What is a markup language?

A markup language is a set of words and symbols for describing the identity of pieces of a document (for example ‘this is a paragraph’, ‘this is a heading’, ‘this is a list’, ‘this is the caption of this figure’, etc). Programs can use this with a style sheet to create output for screen, print, audio, video, Braille, etc.
Some markup languages (e.g. those used in word processors) only describe appearances (‘this is italics’, ‘this is bold’), but this method can only be used for display, and is not normally re-usable for anything else.

What is the difference between XML and HTML?

XML is no way clashes with HTML, since they are for two different purposes.

  • HTML is for displaying purpose whereas XML is for data representation.
  • HTML is used to mark up text so it can be displayed to users.
  • XML is used to mark up data so it can be processed by computers.
  • HTML describes both structure (e.g. <p>, <h2>, <em>) and appearance (e.g. <br>, <font>, <i>)
  • XML describes only content, or “meaning”
  • HTML uses a fixed, unchangeable set of tags
  • In XML, you make up your own tags

What is a well-formed XML document?

If a document is syntactically correct it can be called as well-formed XML documents. A well-formed document conforms to XML's basic rules of syntax:

Every open tag must be closed.
The open tag must exactly match the closing tag: XML is case-sensitive.
All elements must be embedded within a single root element.
Child tags must be closed before parent tags.
A well-formed document has correct XML tag syntax, but the elements might be invalid for the specified document type.

What is a valid XML document?

If a document is structurally correct then it can be called as valid XML documents. A valid document conforms to the predefined rules of a specific type of document:

These rules can be written by the author of the XML document or by someone else.
The rules determine the type of data that each part of a document can contain.

Note:Valid XML document is implicitly well-formed, but well-formed may not be valid

What is XSL?

XSL is a language for expressing style sheets. An XSL style sheet is a file that describes the way to display an XML document.

Using XSL stylesheets, we can separate the XML document content and its styling.

An XSL style sheet begins with the XML declaration:

<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet> defines that the document is an XSLT style sheet document.
The <xsl:template> element defines a template.

Define CSS and XSL.

XSL is a language for expressing style sheets. An XSL style sheet is a file that describes the way to display an XML document.

Cascading Style Sheets is an answer to the limitations of HTML, where the structure of documents was defined and not the display. CSS formats documents for display in browsers that support it.

What's PHP ?

The PHP Hypertext Preprocessor is a programming language that allows web developers to create dynamic content that interacts with databases. PHP is basically used for developing web based software applications.

What Is a Session?

A session is a logical object created by the PHP engine to allow you to preserve data across subsequent HTTP requests.
There is only one session object available to your PHP scripts at any time. Data saved to the session by a script can be retrieved by the same script or another script when requested from the same visitor.
Sessions are commonly used to store temporary data to allow multiple PHP pages to offer a complete functional transaction for the same visitor.


What Is a Persistent Cookie?

A persistent cookie is a cookie which is stored in a cookie file permanently on the browser's computer. By default, cookies are created as temporary cookies which stored only in the browser's memory. When the browser is closed, temporary cookies will be erased. You should decide when to use temporary cookies and when to use persistent cookies based on their differences:
*Temporary cookies can not be used for tracking long-term information.
*Persistent cookies can be used for tracking long-term information.
*Temporary cookies are safer because no programs other than the browser can access them.
*Persistent cookies are less secure because users can open cookie files see the cookie values.

What does a special set of tags <?= and ?> do in PHP?

The output is displayed directly to the browser.  

How do you define a constant?


define("PI",3.14); //using define we can define constants in php
echo PI;


What are the differences between require and include, include_once?

All three are used to an include file into the current page.
If the file is not present, require(), calls a fatal error, while in include() does not.
The include_once() statement includes and evaluates the specified file during the execution of the script. This is a behavior similar to the include() statement, with the only difference being that if the code from a file has already been included, it will not be included again. It des not call a fatal error if file not exists. require_once() does the same as include_once(), but it calls a fatal error if file not exists.

What is the difference between mysql_fetch_object and mysql_fetch_array?

MySQL fetch object will collect first single matching record where mysql_fetch_array will collect all matching records from the table in an array

I am trying to assign a variable the value of 0123, but it keeps coming up with a different number, what’s the problem?

PHP Interpreter treats numbers beginning with 0 as octal. 

What are the different functions in sorting an array?

  • asort()
  • arsort()
  • ksort()
  • krsort()
  • uksort()
  • sort()
  • natsort()
  • rsort()

How can we know the count/number of elements of an array?

a) sizeof($array) - This function is an alias of count()
b) count($urarray) - This function returns the number of elements in an array.

Interestingly if you just pass a simple var instead of an array, count() will return 1.

How many ways we can pass the variable through the navigation between the pages?

At least 3 ways:
1. Put the variable into session in the first page, and get it back from session in the next page.
2. Put the variable into cookie in the first page, and get it back from the cookie in the next page.
3. Put the variable into a hidden form field, and get it back from the form in the next page.

How can we find the number of rows in a table using PHP?

Below php code is according to the MySQLi Object Oriented Standards
$conn = new mysqli(HOST,USER,"",DB);
    $sql = "SELECT row_name FROM table_name";
    $stmt = $conn->stmt_init();

            $totalrecs = $stmt->num_rows();
            echo $totalrecs;

What is the difference between CHAR and VARCHAR data types?

CHAR is a fixed length data type. CHAR(n) will take n characters of storage even if you enter less than n characters to that column. For example, "Hello!" will be stored as "Hello! " in CHAR(10) column.
VARCHAR is a variable length data type. VARCHAR(n) will take only the required storage for the actual number of characters entered to that column. For example, "Hello!" will be stored as "Hello!" in VARCHAR(10) column.

What is the difference between GROUP BY and ORDER BY in SQL?

To sort a result, use an ORDER BY clause.
The most general way to satisfy a GROUP BY clause is to scan the whole table and create a new temporary table where all rows from each group are consecutive, and then use this temporary table to discover groups and apply aggregate functions (if any).
ORDER BY [col1],[col2],...[coln]; Tells DBMS according to what columns it should sort the result. If two rows will have the same value in col1 it will try to sort them according to col2 and so on.
GROUP BY [col1],[col2],...[coln]; Tells DBMS to group (aggregate) results with same value of column col1. You can use COUNT(col1), SUM(col1), AVG(col1) with it, if you want to count all items in group, sum all values or view average.

How can we know that a session is started or not?

A session starts by session_start() function.
This session_start() is always declared in header portion. it always declares first. then we write session_register().

What is a Cookie? Where it is used -

Cookie is a small file which is saved by the server on the client's computer, evrey time the user request the website the cookie is accessed along with the request.

Including external JavaScript in HTML 

<!DOCTYPE html>
<script type="text/javascript" src="file.js"></script>

What is session tracking?

Session can be defined as the timeframe the user navigates through your website, sessions can be tracked by using session_ids

A session id is a unique number which is assigned by the server to the user, session_Id's can be strore in the form of a cookie or in URL.

How to style an Anchor tag ?

<a href="#">Link</a>

What is the use of Meta Tags?

Meta Tags are used to give information about a particular web page to the web crawlers, web crawlers is a tool which is used by the search engines to gather data about a website.

What is AJAX and What is Asynchronous in AJAX?

AJAX is a technique to use the JavaScript's XMLHttpRequest object to send the request to the server Asynchronously or we can say without reloading the webpage.

Elements of a URL

In the above URL

http : Protocol : Host Name : Domain Name

www : Sub Domain

/category/java : Path 

Accessing Data of one Web page on the other using PHP?

Let us write a code for index.php

<!DOCTYPE html>
    <title>Example Form</title>
    <form action="show_data.php" method="post">
            <input type="text" name="name" >
        <input type="submit" value="Submit">
        <input type="reset" value="Reset">


In the below code $_GET is a Super Global Array
<!DOCTYPE html>
    <title> Form</title>
        $name = $_POST['name'];
        echo "<p>".$name."</p>";

What is DOM and BOM?

DOM or Document Object Model is a standard which is used to parse HTML web pages, BOM or Browser Object Model gives a way to the client side scripting langauge to interact with the web browser.

Thank you for reading.

Tweet your queries and feedback to @PsychoCodes or leave a message on our Facebook page. You can also comment your questions below.

Also, don't forget to subscribe to our Newsletter.

If you like this article, then please share it and help us grow.

Share your thoughts