Underline Text – What is the Difference between INS and U?
INS and U are inline elements. That means: an automatic linebreak is not generated.
By default, the output of the HTML tags ins (inserted) and U (underline) are displayed identically by the browser. Both underline the text that is marked up in this way. This means that the tags draw a thin horizontal line on the baseline of the text. However, there is a significant difference between these two HTML tags.
Unlike the U tag, the HTML INS tag has a logical meaning. This tag is used for content that is added to text after it has been written. The added text starts with the opening tag <ins> and must be closed with </ins>.
In practice, the INS tag is often combined with the DEL tag. A section of text that is marked up in this way has been subsequently changed or corrected. Added text is generally not tagged with INS, as this would make a web page difficult to use.
The HTML <ins> Tag
ExampleSubsequently inserted Text is generated using the <ins> tag.
The date that is not valid anymore is crossed out and the new date is inserted using the <ins> tag. To make the corrected date more visible, it is highlighted in color and displayed in bold.
The event is scheduled for
<del>Thursday, November 21, 2024
</del> <ins><b><mark>Thursday, December 5, 2024
</mark></b></ins>.
With a protected space is inserted between the two dates to separate them more clearly.
The HTML <u> Tag
The HTML U tag doesn't have any semantic meaning, but is used for visual styling purposes only. Text marked up with U is underlined. The underlined text starts with <u> and must be closed with the end tag </u>.
ExampleCreate subsequently inserted text by using the <u> tag.
The new date is added with the <u> tag. It is also marked in color and displayed bolded.
The event is scheduled for
<s>Thursday, November 21, 2024
</s> <u><b><mark>Thursday, December 5, 2024
</mark></b></u>.
With a protected space is inserted again between the two dates to separate them more clearly.
In practice, the INS tag is rarely used because it would clutter the web page. It provides no additional information to the user.
The two HTML tags <ins> and <u> work very well from a technical point of view, but they are not very practical to use because the only things that should be underlined are links.
Most visitors will automatically assume that any text that is underlined is a link. When they then realize that they have been fooled by the underlining, they will turn away in frustration and leave your site with a negative feeling about it.
If at all possible, you should avoid underlining text if the underlined text could be mistaken for a link.