HTML <title> title tag
The <title> tag in HTML is used to define the title of an HTML document. It specifies the text that will appear in the browser’s title bar or tab when the page is loaded. This tag is crucial for both user experience and search engine optimization.
Key Features:
- Browser Title: Sets the title of the webpage that appears in the browser’s title bar or tab.
- SEO: Plays a significant role in search engine optimization (SEO) by providing a concise description of the page's content.
- Accessibility: Helps users and assistive technologies understand the page’s purpose or content at a glance.
Basic Syntax:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Page Title</title>
</head>
<body>
<h1>Welcome to My Website</h1>
<p>This is a sample webpage.</p>
</body>
</html>
In this example:
- The
<title>tag is placed within the<head>section of the HTML document. - The content of the
<title>tag, "Page Title", will be displayed in the browser's title bar or tab.
Attributes:
The <title> tag does not have any attributes. The text inside the <title> tag is used to set the document's title.
Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My Awesome Website</title>
</head>
<body>
<h1>Welcome to My Awesome Website</h1>
<p>Here is some interesting content.</p>
</body>
</html>
In this example:
- The title "My Awesome Website" will appear on the browser tab when the page is loaded.
Use Cases:
- Page Identification: Helps users identify and differentiate between multiple open tabs or windows.
- Search Engine Results: The content of the
<title>tag often appears as the clickable title link in search engine results, making it important for attracting users to your site. - Bookmarking: Provides a name for the page that users can see when they bookmark the page.
Best Practices:
- Descriptive and Concise: Keep the title concise yet descriptive enough to provide a clear understanding of the page content. Aim for 50-60 characters to ensure it displays properly in search engine results and browser tabs.
- Unique Titles: Use unique titles for each page on your website to help users and search engines distinguish between them.
- Keywords: Include relevant keywords to improve SEO, but avoid keyword stuffing. The title should read naturally and be relevant to the page content.
Key Points:
- Purpose: The
<title>tag defines the title of an HTML document, appearing in the browser’s title bar or tab. - SEO: It is important for search engine optimization and affects how your page appears in search engine results.
- User Experience: A well-crafted title improves user experience by providing clear context about the page content.
In summary, the <title> tag in HTML is essential for defining the page title that appears in the browser’s title bar or tab. It plays a critical role in SEO, user experience, and page identification, and should be used to provide a concise and descriptive title for each page on your website.