How to use the tag to define HTML document title?</h1> <div class="qa_category"> <div id="divCategories"> <a href='https://www.tutorialspoint.com/articles/category/front-end-scripts' target='_blank'><span>Front End Scripts</span></a><a href='https://www.tutorialspoint.com/articles/category/Javascript' target='_blank'><span>Javascript</span></a><a href='https://www.tutorialspoint.com/articles/category/Web-Development' target='_blank'><span>Web Development</span></a></div> <hr/> <div id="adp_top_ads" style="text-align:center !important;overflow: hidden; max-height:99px;min-height:99px"></div> <script> var adPos = document.getElementById('adp_top_ads'); var ad_id_720 = "8014640d-fd34-4b2e-9b1b-cc67234a2325"; var ad_id_650 = "2d1bb2c4-eb72-471d-9c80-1bf5514728c1"; var ad_id_300 = "df94a1a9-ae2f-432d-9a92-d93823ff4503"; var width = window.innerWidth; var ad_id = ad_id_720; if( width <= 768 ){ ad_id = ad_id_300; adPos.style.minHeight = "250px"; adPos.style.maxHeight = "250px"; }else if( width <= 1435 ){ ad_id = ad_id_650; } adPos.innerHTML = '<div id="' + ad_id + '" class="_ap_apex_ad"></div>'; var adpushup = adpushup || {}; adpushup.que = adpushup.que || []; adpushup.que.push(function() { adpushup.triggerAd(ad_id); }); </script> </div> <hr/> <div id="divResources"> </div> <div id="downloadContent"> <p>The <title> HTML element defines the document's title that is shown in a browser's title bar or a page's tab. It gives a brief and exact description of the documents content. It is also the default name used if the user wishes to bookmarks the web page.</p> <h3>Syntax</h3> <pre class="just-code notranslate language-html" data-lang="html" tabindex="0"><div class="code-mirror language-html" contenteditable="plaintext-only" spellcheck="false" style="outline: none; overflow-wrap: break-word; overflow-y: auto; white-space: pre-wrap;"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>title</span><span class="token punctuation">></span></span> Page title content <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>title</span><span class="token punctuation">></span></span> </div></pre> <p>The <title> HTML plays an important role in on-page search engine optimization, it helps the search engine users decide to click to your site rather than another. Badly-formatted title tags can harm your search rankings and make your links less appealing even though it appears on Google's first page, so it's important to get them right in first place.</p><p></p><p>Search engine consider content page title while ranking the page, hence content of a title tag has great importance in SEO (search engine optimization). The longer, descriptive title have an edge over a shorter title. Title content is one of the components that helps search engine algorithms to organize how the web pages are to be displayed in search result. In addition to that title is also the first thing to grab the attention of the user on the search</p> <p>The different purposes of title tags make them important for SEO, usability, and social sharing. To sum up, title tags are used for −</p> <ul class="list"> <li>The brief title and description of a page as appears at the top of a browser window</li> <li>The default name for user-created bookmarks</li> <li>Search engine rankings</li> <li>The clickable headline of a search result</li> <li>The headline of a link when shared on social media</li> </ul> <h2>Tips to Create Great HTML Title Tag</h2> <ul class="list"> <li><b>Character length between 50 </b>− 60 characters - search engine would show only first 55 - 60 characters of a page title, hence try to have title not longer than that. If the title is long, then make sure that important information comes between 55 - 60 characters.</li> <li><b>Meaningful title </b>− Always have a descriptive phrase, or a term-definition pairing for glossary or reference-style pages.</li> <li><b>Include Important Keywords </b>− It always better to have your important keyword first in your title and the brand or company name can come the end. As user is mostly looking out for the products rather than the company or brand. Hence crucial keyword is to be placed first.</li> <li><b>Title related to page </b>− When create a title always bear in mind that the title should be related to the page or else search engine will display a different title in the search results.</li> <li><b>Human readable </b>− Remember that, while search engines rank your pages, human beings are the ones actually reading and using them. A human-readable title tag makes your page clickable on SERPs and memorable in bookmarks.</li> <li><b>Unique title for every page</b> − The title tag should always be appropriate to the page content, so each page needs its own individual title tag to help differentiate it from your other pages. It's also very likely that each page will need a few different keywords, so optimize each title tag accordingly.</li> </ul> <h3>Example 1</h3> <pre class="just-code notranslate language-html" data-lang="html" tabindex="0"><div class="code-mirror language-html" contenteditable="plaintext-only" spellcheck="false" style="outline: none; overflow-wrap: break-word; overflow-y: auto; white-space: pre-wrap;"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>title</span><span class="token punctuation">></span></span>Awesome interesting stuff<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>title</span><span class="token punctuation">></span></span> </div></pre> <h3>Example 2</h3> <pre class="just-code notranslate language-html" data-lang="html" tabindex="0"><div class="code-mirror language-html" contenteditable="plaintext-only" spellcheck="false" style="outline: none; overflow-wrap: break-word; overflow-y: auto; white-space: pre-wrap;"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>title</span><span class="token punctuation">></span></span>Comprehensive DevOps Prime Pack - Tutorialspoint<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>title</span><span class="token punctuation">></span></span> </div></pre> <h3>Example 3</h3> <pre class="just-code notranslate language-html" data-lang="html" tabindex="0"><div class="code-mirror language-html" contenteditable="plaintext-only" spellcheck="false" style="outline: none; overflow-wrap: break-word; overflow-y: auto; white-space: pre-wrap;"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>title</span><span class="token punctuation">></span></span> Shopping Cart details - Tutorialspoint <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>title</span><span class="token punctuation">></span></span> </div></pre> <h2>Accessibility concerns</h2> <p>It is important to provide an accurate and concise title to describe the page's purpose.</p> <p>A common navigation technique for users of assistive technology is to read the page title and infer the content the page contains. This is because navigating into a page to determine its content can be a time consuming and potentially confusing process. Titles should be unique to every page of a website, ideally surfacing the primary purpose of the page first, followed by the name of the website. Following this pattern will help ensure that the primary purpose of the page is announced by a screen reader first. This provides a far better experience than having to listen to the name of a website before the unique page title, for every page a user navigates to in the same website.</p> <h3>Example</h3> <pre class="just-code notranslate language-html" data-lang="html" tabindex="0"><div class="code-mirror language-html" contenteditable="plaintext-only" spellcheck="false" style="outline: none; overflow-wrap: break-word; overflow-y: auto; white-space: pre-wrap;"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>title</span><span class="token punctuation">></span></span>Menu - Blue House Chinese Food - FoodYum: Online takeout today!<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>title</span><span class="token punctuation">></span></span> </div></pre></div> <div class="clear"></div> <div class="qa_widget mui-panel prof-view-artcle"> <div class=""> <a href='https://www.tutorialspoint.com/authors/shakira-thasleem' target='_blank' title="Shakira Thasleem" class="mui--pull-left"> <img class="profile-img1" src='https://www.tutorialspoint.com/assets/profiles/502799/profile/60_2216785-1660721262.png' alt='Shakira Thasleem'/> </a> <div class="qa_author"> <a href='https://www.tutorialspoint.com/authors/shakira-thasleem' target='_blank'><span>Shakira Thasleem</span></a> <p class="prof-desigtn mb-0"><b></b></p> </div> </div> <div class="clear"></div> <hr> <div class="qa_answer_dtm author-profile-post-info" id="divStats" data-qid="3205" data-quid = "502799"> <div class="mt-2">Updated on 17-Aug-2022 13:32:11</div> <p class="views-count" title="Article Views"><b><i class="fal fa-eye"></i> <span id="spanViews">0 Views</span></b></p> <a href="javascript:void(0)" id="print-page" class="like-dislike d-none d-sm-block"><i class="fal fa-print"></i> Print Article</a> <div class="uthor-prof-social-icon mt-2"> <span class="share-options"> <a onclick="copyToClipboard();" title="Copy To Clipboard" class=""><b><i class="fal fa-link"></i></b></a> <a id="ancFBShare" onClick="window.open('http://www.facebook.com/sharer/sharer.php?u=https://www.tutorialspoint.com/how-to-use-the-title-tag-to-define-html-document-title&t=How to use the tag to define HTML document title?&description=How to use the tag to define HTML document title - The HTML element defines the document's title that is shown in a browser's title bar or a page's tab. It gives a brief and exact description of the documents content. It is also the default name used if the user wishes to bookmarks the web page. Syntax Page title content Th','sharer','toolbar=0,status=0,width=580,height=325');" href="javascript: void(0)" title="Share on Facebook"><i class="fab fa-facebook-f ms-2 me-1"></i></a> <a onClick="window.open('http://www.linkedin.com/shareArticle?url=https://www.tutorialspoint.com/how-to-use-the-title-tag-to-define-html-document-title&title=How to use the tag to define HTML document title?&summary=How to use the tag to define HTML document title - The HTML element defines the document's title that is shown in a browser's title bar or a page's tab. It gives a brief and exact description of the documents content. It is also the default name used if the user wishes to bookmarks the web page. Syntax Page title content Th','sharer','toolbar=0,status=0,width=580,height=325');" href="javascript: void(0)" title="Share on LinkedIn"><i class="fab fa-linkedin-in me-2"></i></a> <a onClick="window.open('http://www.twitter.com/intent/tweet?url=https://www.tutorialspoint.com/how-to-use-the-title-tag-to-define-html-document-title&text=How to use the tag to define HTML document title - The HTML element defines the document's title that is shown in a browser's title bar or a page's tab. It gives a brief and exact description of the documents content. It is also the default name used if the user wishes to bookmarks the web page. Syntax Page title content Th','sharer','toolbar=0,status=0,width=580,height=325');" href="javascript: void(0)" title="Share on Twitter"><i class="fab fa-twitter me-1"></i></a> </span> </div> </div> </div> <ul class="toc chapters"> <li class="heading big-font" style="font-size: 25px!important;border: 0px;"><i class="fal fa-money-check-edit me-2"></i> Related Articles</li><li><a href="https://www.tutorialspoint.com/How-to-use-title-tag-in-HTML-Page">How to use title tag in HTML Page?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-use-the-style-tag-to-define-style-information-for-an-HTML-page">How to use the tag to define style information for an HTML page?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-use-the-base-tag-to-define-the-base-URL-for-an-HTML-page">How to use the tag to define the base URL for an HTML page?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-mark-work-title-using-cite-tag-in-HTML">How to mark work title using cite tag in HTML?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-use-the-datalist-tag-in-HTML">How to use the tag in HTML?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-use-the-keygen-tag-in-HTML">How to use the tag in HTML?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-use-the-output-tag-in-HTML">How to use the tag in HTML?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-use-the-script-tag-to-define-client-side-JavaScript">How to use the tag to define client-side JavaScript?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-use-an-HTML-tag-inside-HTML-table">How to use an HTML tag inside HTML table?</a></li> <li><a href="https://www.tutorialspoint.com/How-do-we-add-document-title-in-HTML">How do we add document title in HTML?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-use-the-link-tag-to-define-a-relationship-to-an-external-resource">How to use the tag to define a relationship to an external resource?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-use-Meta-Tag-to-redirect-an-HTML-page">How to use Meta Tag to redirect an HTML page?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-use-the-kbd-tag-for-keyboard-input-formatting-in-HTML">How to use the tag for keyboard input formatting in HTML?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-display-the-title-of-a-document-with-JavaScript">How to display the title of a document with JavaScript?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-add-a-title-in-anchor-tag-using-jQuery">How to add a title in anchor tag using jQuery?</a></li> </ul></ul><div class="print-page-logo-img text-center mt-2 mb-2" > <img class="border-0" src="https://www.tutorialspoint.com/articles/images/tp-print-page-logo.png" alt="Tutorials Point" /> </div> <div class="clear"><p></p></div> <div class="d-flex justify-content-between border-top py-2 border-bottom" id="bottom_navigation"> <a href="/articles/index.php" class="pre-btn"><i class="fal fa-chevron-circle-left"></i> Previous Page</a> <a href="https://www.tutorialspoint.com/How-to-use-the-keygen-tag-in-HTML" class="nxt-btn">Next Page <i class="fal fa-chevron-circle-right"></i> </a> </div> <div class="error-success" id="error-success"></div> <div class="error-warning" id="error-warning"></div> <div class="google-bottom-ads" id="google-bottom-ads"> <div>Advertisements</div> <div> <div id="adp_bottom_ads"></div> <script> var adPos = document.getElementById('adp_bottom_ads'); var mobile_ad_id = "6d621d7e-9531-4f26-810f-68af67dc6366"; var desktop_ad_id = "4951d1d6-24d4-4a31-afb7-2c22c489eae1"; var adpushup = adpushup || {}; adpushup.que = adpushup.que || []; adpushup.que.push(function() { var ad_id = window.innerWidth <= 768 ? mobile_ad_id : desktop_ad_id; adPos.innerHTML = '<div id="' + ad_id + '" class="_ap_apex_ad"></div>'; adpushup.triggerAd(ad_id); }); </script> </div> </div> </div> <!-- Tutorial Content Ends Here --> <!-- Right Column Starts Here --> <div class="col-sm-6 col-md-3 col-xl-3"> <div class="data-sticky" id="google-right-ads"> <div class="google-right-ad" style="margin: 0px auto !important;margin-top:5px;min-height:280px!important"> <div id="2557b9b8-4c1f-4586-a953-f123dbd2ed8e" class="_ap_apex_ad"> <script> if( window.innerWidth > 768 ){ var adpushup = adpushup || {}; adpushup.que = adpushup.que || []; adpushup.que.push(function() { adpushup.triggerAd("2557b9b8-4c1f-4586-a953-f123dbd2ed8e"); }); } </script> </div> </div> <div class="google-right-ad" style="margin-top:16px;min-height:280px!important"> <div id="b078e6a3-e1b7-40fe-b690-11ac441ad2d5" class="_ap_apex_ad"> <script> if( window.innerWidth > 768 ){ var adpushup = adpushup || {}; adpushup.que = adpushup.que || []; adpushup.que.push(function() { adpushup.triggerAd("b078e6a3-e1b7-40fe-b690-11ac441ad2d5"); }); } </script> </div> </div> <div class="google-right-ad" style="margin-top:16px;margin-bottom:15px;min-height:600px!important"> <div id="8f8814c2-d64c-4d26-9cb9-543653c0b48f" class="_ap_apex_ad"> <script> if( window.innerWidth > 768 ){ var adpushup = adpushup || {}; adpushup.que = adpushup.que || []; adpushup.que.push(function() { adpushup.triggerAd("8f8814c2-d64c-4d26-9cb9-543653c0b48f"); }); } </script> </div> </div> <!-- Right Column Ends Here --> </div> </div> </div> </div> </main> <footer class="py-3 card navbar-dark border-top" id="footer"> <!-- ======================= Annual Membership --> <div class="py-4 bg-white"> <div class="container"> <div class="row g-4"> <!-- Action box item --> <div class="col-lg-6 position-relative overflow-hidden"> <a href="https://www.tutorialspoint.com/market/business/subscription.jsp" target="_blank" title="Annual Membership"> <div class="bg-primary bg-opacity-10 rounded-3 p-5 h-100"> <div class="position-absolute bottom-0 end-0 me-3"> <img src="/images/annual-membership-wraps.svg" class="h-100px h-sm-200px" alt=""> </div> <div class="row"> <div class="col-sm-8 position-relative"> <h3 class="mb-1">Annual Membership</h3> <p class="mb-3 h5 fw-light lead">Enjoy unlimited access on 5500+ Hand Picked Quality Video Courses</p> <div class="btn btn-business mb-0"><i class="fal fa-check"></i> Subscribe Now</div> </div> </div> </div> </a> </div> <!-- Action box item --> <div class="col-lg-6 position-relative overflow-hidden"> <a href="https://www.tutorialspoint.com/business/index.asp#demoRequest" target="_blank" title="Business Pack"> <div class="bg-secondary rounded-3 bg-opacity-10 p-5 h-100"> <div class="position-absolute bottom-0 end-0 me-3"> <img src="/images/business-banner-wraps.svg" class="h-100px h-sm-200px" alt=""> </div> <div class="row"> <div class="col-sm-8 position-relative"> <h3 class="mb-1">Training for a Team</h3> <p class="mb-3 h5 fw-light lead">Affordable solution to train a team and make them project ready.</p> <div class="btn btn-warning mb-0"><i class="fal fa-check me-1"></i> Request a Demo</div> </div> </div> </div> </a> </div> </div> </div> </div> <!-- ======================= Annual Membership --> <div class="container"> <div class="row g-4"> <div class="col-lg-12 text-center"> <a class="me-0 pb-4" href="https://www.tutorialspoint.com"> <img class="light-mode-item h-100px" src="/static/images/logo-color-footer.png" alt="Tutorials Point"> <img class="dark-mode-item h-100px" src="/static/images/logo-footer-b.png" alt="Tutorials Point"> </a> <ul class="nav justify-content-center py-3 mt-md-0 "> <li class="nav-item"><a class="nav-link fw-bold" href="/about/index.htm"><i class="fal fa-globe"></i> About us</a></li> <li class="nav-item"><a class="nav-link fw-bold" href="/about/return_refund_policy.htm"> <i class="fal fa-check"></i> Refund Policy</a></li> <li class="nav-item"><a class="nav-link fw-bold" href="/about/about_terms_of_use.htm"><i class="fal fa-check"></i> Terms of use</a></li> <li class="nav-item"><a class="nav-link fw-bold" href="/about/about_privacy.htm"> <i class="fal fa-shield-check"></i> Privacy Policy</a></li> <li class="nav-item"><a class="nav-link fw-bold" href="/about/faq.htm"><i class="fal fa-question-circle"></i> FAQ's</a></li> <li class="nav-item"><a class="nav-link fw-bold" href="/about/contact_us.htm"><i class="fal fa-map-marker-alt"></i> Contact</a></li> </ul> <p class="small">© Copyright 2023. All Rights Reserved.</p> </div> <div id="privacy-banner"> <div> <p>We make use of First and third party cookies to improve our user experience. By using this website, you agree with our Cookies Policy. <a id="banner-accept" href="#">Agree</a> <a id="banner-learn" href="/about/about_cookies.htm" target="_blank">Learn more</a> </p> </div> </div> </div> </div> </footer> <div class="back-top"> <i class="fal fa-angle-up position-absolute top-50 start-50 translate-middle"></i> </div> <script data-cfasync="false">(function(w, d) { var s = d.createElement('script'); s.src = '//cdn.adpushup.com/40046/adpushup.js'; s.type = 'text/javascript'; s.async = true; (d.getElementsByTagName('head')[0] || d.getElementsByTagName('body')[0]).appendChild(s); })(window, document);</script> <script>(function(w,d){var adSlot=d.createElement("div");adSlot.className="ad-slot ad gpt-div-slot",adSlot.style="position: absolute; visibility: hidden;",adSlot.textContent=" ",d.body.appendChild(adSlot),setTimeout((function(){if(0===adSlot.clientHeight){var t=d.createElement("script");t.setAttribute("src","https://delivery.adrecover.com/18107/adRecover.js"),t.setAttribute("type","text/javascript"),t.setAttribute("async",!0),d.head.append(t)}}),0);})(window, document);</script> <script async src="/static/js/script-min.js?v=0.37"></script> <script async src="/articles/js/article.js?v=1.51"></script> <!-- Google tag (gtag.js) --> <script async src="https://www.googletagmanager.com/gtag/js?id=G-E4SW76VCNP"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'G-E4SW76VCNP'); </script> <!-- Global site tag (gtag.js) - Google Ads --> <script async src="https://www.googletagmanager.com/gtag/js?id=AW-664793816"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'AW-664793816'); </script> </body> </html>