What tag should/could I use for underlined text?
First of all, I realize that styling in HTML should be handled by CSS, and I don't want to change that.
I just want a solid tag I can use for underline, a tag that is meant for underlined text, or one that makes sense to use as such. Then I can style it with CSS.
Now where is that tag?
Why is strong, b, em, i etc. perfectly fine (and often auto-styled in browsers), but underlined is the forbidden fruit?
I would hate to write
<span style="blabla: underline">some underlined text</span> OR <span class="underlined">some text</span>
when I can just use
and style it?
The u element was meant for underlining, ever since HTML 3.2. HTML 4.01 frowns upon it by “deprecating” it, and HTML5 proposes to redefine its meaning in an obscure manner. Yet, in reality, it works in all browsers, and will keep working, and has the exact effect of underlining.
Whether you should underline anything but links on web pages is a different issue. So is the question whether you should think in terms of logical structure rather than visual rendering.
Underlining text is generally a bad idea because it should be exclusively reserved for links. Users just generally expect to be able to clock on underlined text and have something happen.
That said, there is one main exception I can think of:
Price: <del>£12.34</del> <ins>£9.87</ins>!
Most, if not all browsers will render the new price there with an underline, and people will understand it to be an insertion.
I think the whole issue is better approached if we try to understand what the HTML spec writers are trying to accomplish.
On the early days, HTML was basically the only tool to create hypertext documents so it tried to provide all the necessary stuff. As the web grew up it soon become obvious that this all-in-one solution did not scale. Mixing content and presentation didn't provide full control on either. So two steps were taken:
- A new language was created to take care of visuals
- HTML itself was cleaned up to focus on content definition
The problem with underline is that it doesn't really have any meaning by itself. It will have a meaning if you assign it one in your app context (you can decide, for instance, that underline text will be used for book authors in your on-line library catalogue). So when the guys at W3C created HTML tags for several content types (titles, abbreviations, dates...) they simply didn't consider underlining: it was deliberately outside the language scope. There's no HTML tag for "underline" for the same reason that there's no tag for "red circle" or "uppercase Comic-Sans text".
Of course, in fact there is a <u> tag but underline is only a serving suggestion because the important part is the semantics—like printing <h1> with a large font.
It is not forbidden , but a better practice not to use it ,as underline tag is deprecated in HTML 4 http://www.w3.org/TR/REC-html40/present/graphics.html#edef-U so won't validate.
Underline an element is more a style quetion. So, it's better to give a class like "underline_style" and in the CSS give the correct rules.