The HTML page title is the text displayed in the title bar or tab of a web browser. It is defined using the <title> tag within the <head> section of an HTML document. The title is important for several reasons, including usability, accessibility, and search engine optimization (SEO).
Basic Syntax
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My Web Page</title>
</head>
<body>
<h1>Welcome to My Web Page</h1>
</body>
</html>
In this example, the content of the <title> tag is “My Web Page”. This text will appear in the browser tab and as the title of the page when bookmarked.
Importance of the HTML Page Title
1. Browser Tabs: The title helps users identify and switch between multiple open tabs.
2. Bookmarks/Favorites: When users bookmark a page, the title is used as the default name for the bookmark.
3. Search Engine Optimization (SEO): Search engines use the title to understand the content of the page. A well-crafted title can improve a page’s search ranking and click-through rate.
4. Accessibility: Screen readers announce the title of the page when it loads, helping users understand the page’s content.
HTML Page Title – Interview Questions
Q 1: Which tag defines the page title?
Ans: The tag.</div></div><div class="qa-item"><h5 class="question fw-bold">Q 2: Where is the <title> tag placed?</h5><div class="answer"><b>Ans:</b> Inside the section.</div></div><div class="qa-item"><h5 class="question fw-bold">Q 3: Is the page title visible on the webpage?</h5><div class="answer"><b>Ans:</b> No, it appears in the browser tab.</div></div><div class="qa-item"><h5 class="question fw-bold">Q 4: Why is page title important?</h5><div class="answer"><b>Ans:</b> It helps SEO and user identification.</div></div><div class="qa-item"><h5 class="question fw-bold">Q 5: Can a page have multiple <title> tags?</h5><div class="answer"><b>Ans:</b> No, only one <title> tag is allowed.</div></div></div>
</div>
<h2 class="wp-block-heading">HTML Page Title – Objective Questions (MCQs)</h2>
<div class="quiz-section">
<div class="quiz-box">
<div class="quiz-question" id="quiz_0">
<p><strong>Q1. Which tag is used to set the title of an HTML page?</strong></p>
<label class="quiz-option">
<input type="radio"
name="quiz_0"
value="a"
data-correct-key="b"
data-correct-html="<title>">
<span><heading></span>
</label><br>
<label class="quiz-option">
<input type="radio"
name="quiz_0"
value="b"
data-correct-key="b"
data-correct-html="<title>">
<span><title></span>
</label><br>
<label class="quiz-option">
<input type="radio"
name="quiz_0"
value="c"
data-correct-key="b"
data-correct-html="<title>">
<span><head></span>
</label><br>
<label class="quiz-option">
<input type="radio"
name="quiz_0"
value="d"
data-correct-key="b"
data-correct-html="<title>">
<span><h1></span>
</label><br>
<div id="result_quiz_0" class="quiz-result" style="margin-top:8px;"></div>
<hr>
</div>
<div class="quiz-question" id="quiz_1">
<p><strong>Q2. Where should the tag be placed?</strong></p>
<label class="quiz-option">
<input type="radio"
name="quiz_1"
value="a"
data-correct-key="b"
data-correct-html="Inside <head>">
<span>Inside <body></span>
</label><br>
<label class="quiz-option">
<input type="radio"
name="quiz_1"
value="b"
data-correct-key="b"
data-correct-html="Inside <head>">
<span>Inside <head></span>
</label><br>
<label class="quiz-option">
<input type="radio"
name="quiz_1"
value="c"
data-correct-key="b"
data-correct-html="Inside <head>">
<span>At the bottom of the page</span>
</label><br>
<label class="quiz-option">
<input type="radio"
name="quiz_1"
value="d"
data-correct-key="b"
data-correct-html="Inside <head>">
<span>Outside <html></span>
</label><br>
<div id="result_quiz_1" class="quiz-result" style="margin-top:8px;"></div>
<hr>
</div>
<div class="quiz-question" id="quiz_2">
<p><strong>Q3. How does the title appear in a web browser?</strong></p>
<label class="quiz-option">
<input type="radio"
name="quiz_2"
value="a"
data-correct-key="b"
data-correct-html="On the browser tab">
<span>As the page heading</span>
</label><br>
<label class="quiz-option">
<input type="radio"
name="quiz_2"
value="b"
data-correct-key="b"
data-correct-html="On the browser tab">
<span>On the browser tab</span>
</label><br>
<label class="quiz-option">
<input type="radio"
name="quiz_2"
value="c"
data-correct-key="b"
data-correct-html="On the browser tab">
<span>In the footer</span>
</label><br>
<label class="quiz-option">
<input type="radio"
name="quiz_2"
value="d"
data-correct-key="b"
data-correct-html="On the browser tab">
<span>As an image</span>
</label><br>
<div id="result_quiz_2" class="quiz-result" style="margin-top:8px;"></div>
<hr>
</div>
<div class="quiz-question" id="quiz_3">
<p><strong>Q4. Can you have multiple tags in one HTML document?</strong></p>
<label class="quiz-option">
<input type="radio"
name="quiz_3"
value="a"
data-correct-key="b"
data-correct-html="No">
<span>Yes</span>
</label><br>
<label class="quiz-option">
<input type="radio"
name="quiz_3"
value="b"
data-correct-key="b"
data-correct-html="No">
<span>No</span>
</label><br>
<label class="quiz-option">
<input type="radio"
name="quiz_3"
value="c"
data-correct-key="b"
data-correct-html="No">
<span>Only in HTML5</span>
</label><br>
<label class="quiz-option">
<input type="radio"
name="quiz_3"
value="d"
data-correct-key="b"
data-correct-html="No">
<span>Only with CSS</span>
</label><br>
<div id="result_quiz_3" class="quiz-result" style="margin-top:8px;"></div>
<hr>
</div>
<div class="quiz-question" id="quiz_4">
<p><strong>Q5. Which of the following is correct for setting a page title?</strong></p>
<label class="quiz-option">
<input type="radio"
name="quiz_4"
value="a"
data-correct-key="a"
data-correct-html="<title>My Website</title>">
<span><title>My Website</title></span>
</label><br>
<label class="quiz-option">
<input type="radio"
name="quiz_4"
value="b"
data-correct-key="a"
data-correct-html="<title>My Website</title>">
<span><head title="My Website"></head></span>
</label><br>
<label class="quiz-option">
<input type="radio"
name="quiz_4"
value="c"
data-correct-key="a"
data-correct-html="<title>My Website</title>">
<span><page-title>My Website</page-title></span>
</label><br>
<label class="quiz-option">
<input type="radio"
name="quiz_4"
value="d"
data-correct-key="a"
data-correct-html="<title>My Website</title>">
<span><h1>My Website</h1></span>
</label><br>
<div id="result_quiz_4" class="quiz-result" style="margin-top:8px;"></div>
<hr>
</div>
</div>
</div>
<h2 class="wp-block-heading">Related HTML Page Title Topics</h2>
<div class="related-box">
<ul>
<li><a href="/html-head">HTML Head</a></li>
<li><a href="/html-syntax">HTML Syntax</a></li>
</ul>
</div>
</div><!-- .entry-content -->
<!-----Next and Previous Post Links---->
<div class="post-navigation-bottom mb-2">
<a href="https://www.techfliez.com/html-favicon" class="previous-post-link">Previous</a>
<a href="https://www.techfliez.com/html-tables" class="next-post-link">Next</a>
</div>
<!-----End, Next and Previous Post Links---->
<footer class="entry-footer">
</footer><!-- .entry-footer -->
</article><!-- #post-## -->
<div class="loop-nav">
</div><!-- .loop-nav -->
</main><!-- #main -->
</div><!-- #primary -->
<div id="right-section">
<!--<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>-->
<!-- right-sidebar -->
<!--<ins class="adsbygoogle"-->
<!-- style="display:block"-->
<!-- data-ad-client="ca-pub-8283729590890465"-->
<!-- data-ad-slot="3334646795"-->
<!-- data-ad-format="auto"-->
<!-- data-full-width-responsive="true"></ins>-->
<!--<script>-->
<!-- (adsbygoogle = window.adsbygoogle || []).push({});-->
<!--</script>-->
<!--<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>-->
<!-- right-sidebar2 -->
<!--<ins class="adsbygoogle"-->
<!-- style="display:block"-->
<!-- data-ad-client="ca-pub-8283729590890465"-->
<!-- data-ad-slot="3983166447"-->
<!-- data-ad-format="auto"-->
<!-- data-full-width-responsive="true"></ins>-->
<!--<script>-->
<!-- (adsbygoogle = window.adsbygoogle || []).push({});-->
<!--</script>-->
</div>
</div><!-- #content -->
<footer id="colophon" class="site-footer" role="contentinfo">
<div class="footer-item">
<div class="row col-sm-12">
<div class="col-sm-4">
<div class="footer-heading-label">Why use techfliez.com?</div>
<div>We provide a free online e-learning tutorial portal written in an easy way to teach a programming language for those students who want to learn a programming language with a live example.</div>
<div class="row col-sm-12 mt-3 font-weight-bold mb-3">Follow Us: </div>
<div class="row col-sm-12">
<div class="footer-social-links">
<a href="https://www.facebook.com/techfliez/" target="_blank"><i class="fa fa-facebook social-link" style="padding-right:10px;"></i></a>
<a href="https://www.youtube.com/@techFliez" target="_blank"><i class="fa fa-youtube social-link" style="padding-right:10px;"></i></a>
<a href="https://www.linkedin.com/company/techfliez-academy" target="_blank"><i class="fa fa-linkedin social-link"></i></a>
</div>
</div>
</div>
<div class="col-sm-2">
<div class="footer-heading-label">Tutorials</div>
<ul class="footer-course-list">
<li><a href="/introduction-to-java">Java Tutorial</a></li>
<li><a href="/what-is-python">Python Tutorial</a></li>
<li><a href="/what-is-c">C Tutorial</a></li>
<li><a href="/what-is-cpp">C++ Tutorial</a></li>
<li><a href="/what-is-csharp">C# Tutorial</a></li>
<li><a href="/what-is-Django">Django Tutorial</a></li>
<li><a href="/what-is-html">HTML Tutorial</a></li>
<li><a href="/css-introduction">CSS Tutorial</a></li>
<li><a href="/what-is-javascript">JavaScript Tutorial</a></li>
<li><a href="/what-is-angular">Angular Tutorial</a></li>
<li><a href="/what-is-reactjs">ReactJs Tutorial</a></li>
<li><a href="/what-is-nodejs">Nodejs Tutorial</a></li>
<li><a href="/what-is-typescript">TypeScript Tutorial</a></li>
<li><a href="/what-is-php">PHP Tutorial</a></li>
<li><a href="/what-is-sql">SQL Tutorial</a></li>
<li><a href="/what-is-mongodb">MongoDB Tutorial</a></li>
</ul>
</div>
<div class="col-sm-1">
<div class="footer-heading-label">Editor</div>
<ul class="footer-course-list">
<li><a href="/html/trycode.php">HTML Editor</a></li>
<li><a href="/js/trycode.php">JavaScript Editor</a></li>
<li><a href="/php/trycode.php">PHP Editor</a></li>
</ul>
</div>
<div class="col-sm-3">
<div class="footer-heading-label">Interview Questions</div>
<ul class="footer-course-list">
<li><a href="/html-interview-questions">HTML Interview Questions </a></li>
<li><a href="/css-interview-questions">CSS Interview Questions </a></li>
<li><a href="/angular-interview-questions">Angular Interview Questions </a></li>
<li><a href="/reactjs-interview-questions">Reactjs Interview Questions </a></li>
<li><a href="/nodejs-interview-questions">Nodejs Interview Questions </a></li>
<li><a href="/mongodb-interview-questions">MongoDB Interview Questions </a></li>
<li><a href="/php-interview-questions">PHP Interview Questions </a></li>
<li><a href="/mysql-interview-questions">MySql Interview Questions </a></li>
<li><a href="/python-interview-questions">Python Interview Questions </a></li>
<li><a href="/django-interview-questions">Django Interview Questions </a></li>
</ul>
</div>
<div class="col-sm-2">
<div class="footer-heading-label">Pages</div>
<ul class="footer-course-list">
<li><a href="/about-us">About Us </a></li>
<li><a href="/contact-us">Contact Us </a></li>
</ul>
</div>
</div>
<div class="footer-text">
Copyright ©2026 <a href="https://www.techfliez.com">techfliez.com</a>
</div>
<div class="site-info">
</div><!-- .site-info -->
</div><!-- .footer-item -->
</footer><!-- #colophon -->
</div><!-- #page -->
<script>document.documentElement.className = 'js';</script>
<script type="text/javascript" src="https://www.techfliez.com/wp-content/themes/removeload/assets/js/plugins.min.js" id="delivery-plugins-js"></script>
<script type="text/javascript" src="https://www.techfliez.com/wp-content/themes/removeload/assets/js/main.min.js" id="delivery-main-js"></script>
<script type="text/javascript" src="https://www.techfliez.com/wp-includes/js/comment-reply.min.js?ver=6.7.5" id="comment-reply-js" async="async" data-wp-strategy="async"></script>
<script src="https://www.techfliez.com/wp-content/themes/removeload/assets/js/prism.js"></script>
<script>
document.querySelectorAll(".quiz-box input[type=radio]").forEach(input => {
input.addEventListener("change", function() {
const id = this.name;
const correctKey = this.dataset.correctKey;
const correctHtml = this.dataset.correctHtml;
const resultBox = document.getElementById("result_" + id);
if (!resultBox) return;
const selectedKey = this.value;
const options = document.querySelectorAll(`input[name="${this.name}"]`);
// Reset previous styles and result
resultBox.innerHTML = "";
resultBox.className = "quiz-result";
options.forEach(opt => opt.parentElement.style.color = "");
if (selectedKey === correctKey) {
// ✅ Correct answer selected
resultBox.innerHTML = "✅ <strong>Correct!</strong>";
resultBox.classList.add("correct");
this.parentElement.style.color = "green";
} else {
// ❌ Wrong answer selected
resultBox.classList.add("wrong");
this.parentElement.style.color = "red";
// Find correct answer text
const correctOption = Array.from(options).find(opt => opt.value === correctKey);
const correctText = correctOption ? correctOption.nextElementSibling.innerHTML : "";
// Show wrong + correct answer text after all options
resultBox.innerHTML = "❌ <strong>Wrong!</strong><br><br>✅ <em>Correct Answer:</em> " + correctText;
}
});
});
</script>
</body>
</html>