The HTML <del> tag is used to represent text that has been deleted or removed from a document. This tag is particularly useful for indicating edits, corrections, or updates to content on a webpage. When text is enclosed within the <del> tag, it is typically displayed with a strikethrough, indicating that the content is no longer relevant or valid. This visual cue helps users understand that the text has been modified or removed.
The <del> tag can also provide additional meaning for search engines, emphasizing that certain content has been explicitly deleted. Additionally, it enhances user accessibility by clearly marking changes in content.
Syntax of the <del> Tag
The <del> tag is simple to use and can be applied to any block of text or inline text that you wish to indicate as deleted. Below is the syntax:
<del>Deleted text</del>
You can also include the datetime attribute in the <del> tag to specify when the text was deleted.
Syntax with datetime attribute:
<del datetime="2024-09-18">Deleted text</del>
The datetime attribute allows developers to specify the exact date and time when the text was removed, which can be useful for tracking document changes.
Attributes of the <del> Tag
The <del> tag supports the following attributes:
| Attribute | Description |
|---|---|
datetime | Specifies the date and time when the text was deleted. This value should be in a valid datetime format (e.g., YYYY-MM-DDThh:mm:ssTZD). |
global attributes | Supports all global attributes like class, id, style, and title for further styling and functionality. |
Using the datetime attribute can enhance the document's meaning and provide a clear historical record of changes made.
Examples of HTML <del> Tag
Example 1: Basic Usage of the <del> Tag
<!DOCTYPE html>
<html>
<head>
<title>Deleted Text Example</title>
</head>
<body>
<p>This sentence contains <del>incorrect information</del> that has been updated.</p>
</body>
</html>
In this example, the text "incorrect information" is displayed with a strikethrough, indicating that it has been removed or replaced.
Example 2: Using the <del> Tag with datetime Attribute
<!DOCTYPE html>
<html>
<head>
<title>Deleted Text with Date Example</title>
</head>
<body>
<p>This version of the article was revised. The previous version was published on <del datetime="2023-05-10">May 10, 2023</del>.</p>
</body>
</html>
In this example, the date of deletion is provided through the datetime attribute, giving users additional context about when the content was removed.
FAQs About HTML <del> Tag
Q1: What is the purpose of the HTML <del> tag?
A: The <del> tag is used to represent deleted text within an HTML document. It visually indicates that the enclosed text has been removed by applying a strikethrough effect.
Q2: Can the <del> tag improve SEO?
A: Yes, the <del> tag can help search engines understand the changes in your content, making it clear that certain information has been updated or removed.
Q3: What is the use of the datetime attribute in the <del> tag?
A: The datetime attribute allows you to specify when the text was deleted, adding a timestamp that provides more detailed information about the content change.
Q4: Is the <del> tag supported in all browsers?
A: Yes, the <del> tag is supported by all modern browsers, including Chrome, Firefox, Safari, and Edge.
Q5: What is the difference between the <del> and <s> tags?
A: The <del> tag semantically indicates that text has been deleted or removed from the document, while the <s> tag simply applies a strikethrough to the text without implying any change or deletion.
