What we do Resources For talent About us Get Started Login

100 must know HTML

interview questions and
answers in 2024
Are you a senior HTML developer looking to work with top US
companies? Or, are you a company on a hiring spree for
HTML developers? Whatever the case may be, you will benefit
from the following deck of HTML interview questions we have
carefully curated.

Apply as HTML developer

I'm hiring developers I'm looking for jobs

Last updated on Dec 15, 2024 Share this    

Get remote HTML developer jobs with
top U.S. companies!
Hypertext Markup Language (HTML) is used to structure content on
web browsers. HTML elements help create sections, paragraphs, and Work at Fortune 500 companies and fast-scaling
links. It should not be mistaken for a programming language as it startups from the comfort of your home

doesn't offer dynamic functionality. Some of its use cases include web
development, internet navigation, and web documentation. For both
the applicant and the interviewer it is essential to go through the
typical questions revolving around its concepts and use cases to
develop a command over HTML. Apply now

Therefore, we are presenting here a comprehensive list of HTML

interview questions segregated into basic, intermediate, and Apply for the latest remote jobs
advanced that interviewers can use to assess the right candidate. Also,
developers can keep it handy to ace the interview for the HTML
developer role. Back-End Developer
FULL-TIME REMOTE JOB

Table of contents Posted 7 months ago  1-10

 Business Services
Basic HTML interview questions and answers (31)

Intermediate HTML Interview questions and answers (39)

Advanced
This HTML interview
website utilizes questions
technologies such as and answers
cookies (30)
to enable essential site functionality, as well as for
analytics, personalization, and targeted advertising purposes. You may change your settings at any time Save
or accept the default settings. You may close this banner to continue with only essential cookies.
Privacy Policy Accept All
BASIC
Storage HTML INTERVIEW
Preferences QUESTIONS AND ANSWERS
Reject All
Targeted Advertising Personalization Analytics
1. How do you add comments in HTML?

Hide Answer

To insert a comment in HTML you can simply use the lesser than
sign at the beginning and the greater than sign at the end like this:
“<!- comment ->”.

2. Can you compare and contrast physical tags from

logical tags?

Hide Answer

Physical tags format and display the content inserted within the
tags. They add style defined by the parameters while logical tags
define the meaning or structure of the content within the tags.

3. What is the difference between HTML and HTML5?

Hide Answer

HTML5 is the updated version of HTML. What makes this newer

version of HTML better is the added features that support audio,
video, and new styling elements which differ from the old version.

4. How can data be stored in HTML5?

Hide Answer

There are two ways you can store data:

Local storage - It keeps data safe, whenever someone exits the

browser, the data doesn't get deleted.

Session storage - Keeps the data only when someone is using

the browser. As soon as the browser closes, the data is
immediately erased.

5. What are tags?

Hide Answer

Tags are elements in HTML that define and format content properly.

6. Must all HTML tags be closed?

Hide Answer
No, not all tags need to be closed. There are self-closing tags such
as , that don’t require closing tags.

7. How do you make text paragraphs or sections?

Hide Answer

There are two HTML tags you can use to make sections or
paragraphs:
- This is used to create a line to separate text.
- This is used to create a text paragraph

8. What are the different types of lists found in HTML?

Hide Answer

Three types of lists can be found in HTML:

Ordered lists - This type of list displays elements that are in

numerical order or format. is the tag used to define this kind of
list.

Unordered lists - This kind of list display elements in bulleted

form. is the tag used to define this kind of list.

Definition list - This is a kind of list that displays elements in

dictionary form. The tag is used to define definition lists.

9. What is semantics in HTML?

Hide Answer

Semantics in HTML are styles used to define the meaning of content

elements in webpages. It provides meaning to the tags and code
written.

10. How do you align text in HTML?

Hide Answer

There are two ways to align text in HTML:

Indentation - Here you can indent lists further than the parent list.
This will determine the various elements that are contained.
CSS - The CSS text-align property sets the alignment of text
contained inside a block element of the table.

11. How do you underline text in HTML?

Hide Answer
You can underline text by simply using the tag.

12. Define an image map.

Hide Answer

An image map is used for linking multiple web pages using a single
image by using the tag. One can define the kind of shapes one
wants to include in images.

13. Define what is white space?

Hide Answer

White space is an empty sequence of space characters. It helps

the browser merge multiple spaces into one single space and
makes indentation easier.

14. Write a basic HTML template

Hide Answer

A basic HTML structure template looks like this:

<head>
<title>Page title</title>
</head>
<body>Body of contents</body>
</html>```

15. Where can you use hyperlinks?

Hide Answer

You can use hyperlinks in text and images. The “href” attribute is the
most commonly used to define HTML anchor tags.

Example:

16. Define what DOM is

Hide Answer

DOM is short for Document Object Model. DOM defines the following:

HTML elements as objects

Events of all HTML elements

17. How do you insert images into an HTML document?

Hide Answer

You can insert an image by using the tag. Certain parameters are
required for inserting images:

src - used for adding a path to the image

alt - for adding alternate text

width - adds the image width

height - adds the image height

Example:

18. Define the purpose of “ALT” in an image

Hide Answer

Alternative text's sole purpose is to add the definition of what an

image is all about.

19. What is a marquee?

Hide Answer

Marquee is used for scrolling text on a web page. By using the tag,
one can scroll either left, right, down, or up automatically.

20. What is a style sheet?

Hide Answer

A style sheet helps in defining HTML templates. The templates can

be linked to multiple pages, making it easy to maintain and update
the website look.

21. How do you add a button in HTML?

Hide Answer

You can add a button to an HTML page by using the button tag:

22. What are the types of headings you can use for your
HTML doc?
Hide Answer

There are about 5 types of headings that can be used. They can be
defined by the following tags:

23. What is a span tag used for?

Hide Answer

A tag is used for marking up a part of the text or document. It can

also be used to group elements together for styling purposes.

24. Can you change the font color in HTML?

Hide Answer

Yes, you can change the font color by using the tag. For example;

25. List the types of CSS that can be included in an HTML

doc.

Hide Answer

There are three types of CSS elements that can be included. These
are:

Inline CSS - This is used for styling small contents. It is mainly

used for styling attributes inside the HTML elements in the body
section.

Internal CSS - This is used for adding tags in the section of the
document. It is mainly for styling a single page that has a unique
style.

External CSS - This is used when applying to multiple pages.

26. What is the default size for the text field?

Hide Answer

The default size for a text field is about 20 characters long. But if you
include the size attribute one can set the size value to be as low as 1
and as high as the width of the browser width.
27. List the tags used to display data in the tabular form.

Hide Answer

Below are the tags that can be used to display data:

- tag defines the row

- defines a table

- defines the header

- used to define data cell in a table

- used for grouping the content in a table

- used for grouping the header

- used for grouping the footer in a table

28. Explain the typical layout of an HTML.

Hide Answer

Every webpage has a specific layout but the following tags and
elements are used in defining different sections of a webpage:

- used to define the header section

- used to define the document section

- defines the navigation links container

- used to define text aside from the content

- used to define the footer of a document

29. Is a tag?

Hide Answer

No, the is not a tag but a declaration. With it, HTML tags cannot
function properly.

30. What is the advantage of collapsing the white space in

HTML?

Hide Answer

Collapsing whitespaces in HTML is beneficial because it reduces the

time for transmitting information between the server and the client.

31. What color do clicked links appear?

 Hide Answer

The default for any link is blue. Once it has been clicked on, it turns
purple.

Looking for remote developer job

at US companies?
Work at Fortune 500 companies and Apply Now
fast-scaling startups from the comfort
of your home

INTERMEDIATE HTML INTERVIEW QUESTIONS AND

ANSWERS

1. What is the hierarchy of style sheets?

Hide Answer

In style sheets, the style tag takes priority, and external style sheets
take the least priority.

2. What is SVG?

Hide Answer

SVG stands for scalable vector graphics. It is used to describe

visuals in XML language.

3. How do you add a video to an HTML page

Hide Answer

To add a video to your page you can use the tag.

4. What are the media formats supported by HTML?

Hide Answer

HTML supports various media types and formats such as,

Audio: WMA, MIDI, AAC, WAV, MP3, MP4

Video: MPEG, AVI, WMV, WebM, QuickTime, MP4, etc.

Image: jpg, jpeg, png, gif, SVG

5. What is the tag used for?

Hide Answer

The element is used to define and specify content in a document

that is independent of the document. This element is used for
defining blog posts, articles, and long-form posts.

6. How do you open an external CSS file in a browser?

Hide Answer

To open a CSS extension file, one needs to use the tag. This will
reference the CSS file.

7. What is the iframe tag used for?

Hide Answer

The tag is used to define inline frames. It is mainly used to define a

webpage within a webpage. Below is an example of using the tag:

8. Can you create multi-colored text in HTML?

Hide Answer

Yes, you can use the following syntax to create different multi-
colored texts.

9. When do you use frames?

Hide Answer

Frames make page navigation easier. If the links of the page are
placed under frames, they will appear at the top of the page or at
the bottom of the browser.

10. How can you send mail directly from the webpage?

Hide Answer

One can easily create a clickable link text by using the “mailto”
command within the href tag as follows:

11. What is an attribute?

Hide Answer

An attribute in HTML is a property that can be added to an HTML

tag. Attributes can change the way tags are displayed.

12. How does one insert a copyright sign?

Hide Answer

You can insert a copyright symbol by using the &copy to any HTML
document.

13. Can you create links to different sections within the

same document?

Hide Answer

Yes, this can be easily done by using the tag along the referencing
symbol #. This will create different links within the same web page

14. What is the difference between cell padding and

spacing?

Hide Answer

Cell spacing is referred to as the space between two cells of the

same table while cell padding is referred to as the space between
the contents of a cell or cell border.

15. What is an entity?

Hide Answer

An entity is a group of characters that is used to represent special

characters or symbols which can’t be typed using the standard
keyboard. These are strings that start with “&” symbol and end with
a “;” symbol.

16. What happens when you overlap a set of tags?

Hide Answer

When you overlap two or more sets of tags, the first tag will be
recognized. This will cause problems and lead to web browser not
interpreting the page correctly thus causing inconsistencies on the
web page.
17. Define applets

Hide Answer

Applets are small programs that are embedded within web pages.
They perform different functions such as animations,
computations, and information processing.

18. What are the benefits of grouping checkboxes?

Hide Answer

Grouping checkboxes has several advantages including:

Simplified processing

Improved organization

Consistency

Optimized user experience

19. Explain why we need to use doctype in HTML.

Hide Answer

Doctype is used for declaring document-type objects. This also

tells the web browser the type of HTML and version used to build the
page.

20. Differentiate between inline and block elements.

Hide Answer

Inline elements are designed to take very minimal space while

block elements are programmed so that they take up as much
space as needed.

21. What are the ways to insert JavaScript into your

document?

Hide Answer

There are various ways to insert JavaScript into an HTML document.

It can be done either via code embedding, using inline code, or by
linking to an external file.

22. Define what is Canvas.

Hide Answer

Canvas is an element used to create better graphics for web

pages. One can simply write a JavaScript block code that can be
used to create a canvas.

23. What is a script tag used for?

Hide Answer

The tag is used to define the script for the client side.

24. Can text appear outside the browser?

Hide Answer

Yes, this can happen when the width of the defined table is wider
than the browser's width.

25. Can anyone change the color of the bullets?

Hide Answer

Yes, the color for bullets can be changed by customizing them into
a different color using CSS.

26. How do you define colors for table borders?

Hide Answer

You can define the color for table borders in the style sheet. If this is
not supported the text color will be used instead.

27. What is the difference between ruler and border

attributes?

Hide Answer

When the border attribute is set to zero, the default cell borders and
thickness will be applied, whereas if a rule attribute is added to a
tag, the border attribute will not be included. The default one-pixel
border will be shown instead.

28. Create an example that shows nested web pages.

Hide Answer

This is done by using the iframe tag:

<!DOCTYPE html>
<html>
<body>
<h2>Nested example</h2>
<p>Use the height and width attributes to specify the size of
the iframe:</p>
<iframesrc="https://link/"height="500"width="600"></iframe>
</body>
</html>

29. What is an HTML form?

Hide Answer

A form is designed to take a user’s input which will be sent for

processing.

30. How many tags are available in HTML?

Hide Answer

There are more than 100 tags available.

31. What is an application cache?

Hide Answer

An application cache is a function that allows a developer to run

their project offline through caching. This feature is mostly used for
testing features.

32. Define a cite tag.

Hide Answer

A tag is used to mark a certain portion of text. It is mainly used

when you have quoted or referenced something from a different
source.

33. Can you get a geographic location of a user in HTML?

Hide Answer

Yes, but you would need to embed the geolocation API to your HTML
document for accessing the geographic location of a user in HTML.

34. What editor can you use to create HTML pages?

Hide Answer

There are many available editors such as Sublime Text, Notepad

++, and Chrome editor.

35. Define longdesc in HTML.

Hide Answer

Longdesc is an attribute that allows you to provide a link with a

comprehensive description for an image.

36. Define the POST and GET method.

Hide Answer

GET method is used for requesting data from a server, while the
POST method is used to send data to a server.

37. What is WebSockets?

Hide Answer

Websockets provide bi-directional communication between web

applications that operate on a single socket via JavaScript
interfaces in HTML5 browsers.

38. Define what is a Box model.

Hide Answer

A box model provides the description for how elements are sized
and displayed on the page. Each page may have a width, height,
padding, borders, and margins. This is related to the CSS styling
property.

39. Why should you use an Embed tag?

Hide Answer

The tag is used for embedding image, video or audio files inside an
HTML document. This tag requires a closing tag.
 Looking for remote developer job
at US companies?
Work at Fortune 500 companies and Apply Now
fast-scaling startups from the comfort
of your home

ADVANCED HTML INTERVIEW QUESTIONS AND

ANSWERS

1. Create a CSS popup example.

Hide Answer

<div class="popup" onclick="myFunction()">Click me!

<span class="popuptext" id="NewPopup">Your text</span>
</div>

2. Create an example that adds a scroll bar in Html

Hide Answer

<!DOCTYPE html>
<html>
<head>
<style>
div.ex1 {
background-color: light-green;
width: 110px;
height: 110px;
overflow: scroll;
}

</style>
</head>
<body>

<h1>Let’s create a scrollbar</h1>

<h2>scroll:</h2>
<div class="ex1">Congratulations, this is how you create a
scroll bar.</div>
</body>
</html>

3. Demonstrate how to create a box in HTML.

Hide Answer

<!DOCTYPE html>
<html>
<head>
<style>
div {
background-color: lightblue;
width: 300px;
border: 15px green;
padding: 50px;
margin: 20px;
}
</style>
</head>
<body>

<h2>Creating a Box Model</h2>

<p>Welcome.</p>

<div>Congratulations, this is how you create a Box

Model</div>

</body>
</html>

4. What is blink text?

Hide Answer

The tag is a non-standard element used to create enclosed text.

5. Define an anchor tag.

Hide Answer

An anchor tag is used to link two or more web pages together using
the tag.

6. Create an example of a menu in HTML.

Hide Answer

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-
scale=1">
<style>
div {
 width: 35px;
height: 5px;
background-color: black;
margin: 6px 0;
}
</style>
</head>
<body>

<p>Menu:</p>

<div></div>
<div></div>
<div></div>

</body>
</html>

7. What is HTML encoding?

Hide Answer

It is used to forward header information to the server so as to

display text not HTML code. This encoding parses non-ASCII special
characters and replace them with the standard form.

8. Create an HTML form example.

Hide Answer

<!DOCTYPE html>
<html>

<body>
<form>
Username:
<br>
<input type="text"
name="username">
<br>
Email id:
<input type="text"
name="email_id">
<br>
<input type="submit"
value="Submit">
</form>
</body>
</html>

9. Define Void elements.

Hide Answer

Void elements are elements that have only the start tags and don’t
contain any content within them.

10. Create a drop-down list example.

Hide Answer

<label for="Animals">Choose a Pet:</label>

<select name="Animals" id="pets">

<option value="Dog">Dog</option>
<option value="Cat">Cat</option>

</select>

11. Can you change an inline element to a block element?

Hide Answer

Yes, you can change the inline element to a block element by using
the display property and setting the value to block. Example:

12. Define what is MathML.

Hide Answer

MathML stands for Mathematics Markup Language used for

performing mathematical equations in web browsers.

13. What is the lang attribute used for?

Hide Answer

The lang attribute is used to specify the language used to write the
content of a web page. For example: or

14. Define Web Worker in HTML.

Hide Answer

Web worker is a multithread object used for executing JavaScript. It

runs in the background and doesn’t affect the performance of the
webpage or application.
15. What is a manifest file?

Hide Answer

The manifest is a file that instructs the browser to cache certain

web pages so they can be made available for offline mode.

16. How do you handle JavaScript events in HTML?

Hide Answer

Events represent an action or occurrence. Events are typically used

on buttons, hyperlinks, and hovers. This is a syntax example of how
to handle events:

17. What is multipart data?

Hide Answer

Multipart form data is an enctype attribute of the tag that specifies

the method of encoding for form data. It is part of the two ways of
encoding HTML forms.

18. Create a CSS example where you set the background

color of an HTML document to yellow.

Hide Answer

<!DOCTYPE html>
<html>
<head>
<style>
Body {
background-color :yellow;
}

</style>
</head>
<body>

<h1>Yellow Home Page</h1>

</body>
</html>

19. Create an example that defines text inside element.

Hide Answer
<p>Code example:</p>

<pre><code>var person = {
firstName:"John",
lastName:"Doe"
}</code></pre>

20. Create a JavaScript script that changes the text size.

Hide Answer

<body>

<p id="demo">Example.</p>

<script>
document.getElementById("demo").style.fontSize = "60px";
</script>

</body>

21. What is HTML5?

Hide Answer

HTML5 is the 5th or the latest version of Hypertext Markup

Language. It is the standard markup language for creating and
describing the structure of a webpage.

22. What is the difference between HTML and HTML5?

Hide Answer

23. Can you link CSS to HTML5?

Hide Answer

Yes, you can link CSS to HTML5 by using the tag in the header
section.

24. Does HTML5 have a player?

Hide Answer

Yes, HTML5 has a player that has the ability to show engaging
videos on any platform.
25. List the new form elements that are now available in
HTML5.

Hide Answer

These are:

- to display a list of suggestions to a text element

- it passes encrypted data to the server by creating an

encryption key

- this element is used to point numeric values that are within a

range

displays the progress of the task

26. What tags are no longer valid in HTML5?

Hide Answer

- for defining the font, size, and color of the text

- for defining a directory list

- o define a single-line input field

- for defining a set of frames

- for non-framing a section

- used to teletype a text

- to strikethrough a text

27. Why is SVG the most preferred for image formats?

Hide Answer

SVG is easy to scale, can be edited in any text editor, and the image
quality is high no matter what the resolution is.

28. How do you center text in HTML5?

Hide Answer

Since the tag is deprecated, you can use the CSS text-align
property to the desired element.

29. Create a table example in HTML5.

Hide Answer

This is how you create a table in HTML5:

<!DOCTYPE html>
<html>
<head>
<title>Table</title>
</head>
<body>
<table border = "2">
<tr>
<td>row1,cell1</td>
<td>row1,cell2</td>
</tr>
<tr>
<td>row2,cell1</td>
<td>row2,cell2</td>
</tr>
</body>
</html>

30. Create an example of how to use the Geolocation API in

HTML5.

Hide Answer

<!DOCTYPE html>
<html>
<head>
<title> location page</title>
</head>
<body>
<p>Click this button below to get your location.</p>
<button onclick="getLocation()"> My Location </button>
<p id="location"></p>
<script>
var x = document.getElementById("location");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this
browser.";
}
}
function showPosition(position) {
x.innerHTML = "At Latitude: " + position.coords.latitude +
"<br>At Longitude: " + position.coords.longitude;
}
</script>
</body>
</html>

Looking for remote developer job

at US companies?
Work at Fortune 500 companies and Apply Now
 fast-scaling startups from the comfort
of your home

CONCLUSION

To conclude, any HTML developer always needs to be well prepared for

any question that the recruiter asks. The developer interviews come in
different stages and the above-mentioned questions and answers are
meant to address every stage of the interview, specifically the
technical one.

With this comprehensive list of questions, both the interviewers and the
interviewee can have a quick reference to intermediate and advanced
levels of HTML questions.

If you are a new hirer looking for alternative methods of hiring, you can
opt for Turing. The company helps you hire the world’s best talent
remotely. For developers looking for HTML jobs, Turing test is the route
to go!

Job description templates → HTML developer resume tips →

Learn how to write a clear and comprehensive Turing.com lists out the do’s and don’ts behind a
job description to attract highly skilled HTML great resume to help you find a top remote HTML
developers to your organization. developer job.

Check out more interview questions

Search skills... |

Based on your skills

React Node.js Python AWS

JavaScript HTML Java Flutter

 C# SQL Angular iOS

PHP

+ See more skills

Based on your role

Front-end Full Stack Backend Machine Learni…

Data Science AI Cloud DevOps

 Remote Develo…  Software Engin…

+ See more roles

Hire remote developers

Tell us the skills you need and we'll find the best developer for you in days,
not weeks.

Hire Developers

AI & AGI For developers Resources Company

solutions
Browse remote jobs Blog About
LLM training
Get hired More resources Press
Generative AI
Developer reviews Turing careers
AI/Data
Developer
Custom resources Connect
engineering
Tech interview
Contact us
All solutions questions

Help center

On-demand
talent

Technical
professionals and
teams
Sitemap Terms of service Privacy policy Privacy settings

1900 Embarcadero Road Palo Alto, CA, 94303 © 2024 Turing