Hi everyone,
plz tell me the
Difference between Bold and Strong tag of HTML
Thanks
The b and i element types indicate that the content should be boldfaced or italicised, respectively, normally to adhere to some typographic convention. They don’t imply any sort of emphasis, only a presentational change.
The em and strong element types indicate that the content should be emphasised or strongly emphasised, respectively. They don’t imply any specific presentation, although all contemporary browsers render em in italics and strong in bold by default.
Thus, b and i are presentational, while em and strong are semantic.
Perhaps an easy way to consider the difference is to think about how a web reader will speak the content based on the surrounding tags. With <em> and <strong> the reader can apply emphasis and strong emphasis to the content in the way that it says it. The web reader cannot speak in italic or bold and so there is no obvious way that the web reader should handle those tags - it would all depend on what you had in the style sheet to define how those thags should affect the way their content is spoken.
Being that they are two totally different tags, it is like comparing <font size=“6”>…</font> to a h1 tag.
If you want an element bold, use css to handle the styling. I really wish that the strong tag was not set to bold by default. I think it really confuses a lot of developers.
Listen to Tommy and Stephen.
I to some extent disagree with the B and I tags being purely presentational. There are cases where it is semantically required for text to be italiced (and probably boldfaced as well). In these cases, it would be wrong to use CSS to add the effect.
@C. Ankerstjerne - Could you show an example of when it is ‘proper’ to use a b or i tag?
Yeah… its never appropriate to use b or i in place or strong of em. Bold and italic describe presentation while em and strong outline hierarchy.
Can you give an example? If you’re thinking about typographic conventions, then it doesn’t have to do with semantics. The semantic way to mark up the name of a ship would be <ship>Titanic</ship>, but HTML doesn’t have that semantic richness. Since ship names are traditionally italicised, the correct way to mark it up in HTML would be <i>Titanic</i>.
I’m sorry, but that’s plain wrong. Em and strong denote emphasis. Thus <em>Titanic</em> would be wrong unless you really mean to emphasise the name, whereas <i>Titanic</i> is semantically neutral and only denotes italics. You could use <span class="ship">Titanic</span> and use CSS to make it italic, but you’d gain nothing.
Hierarchy? How so? They denote semantic emphasis, that’s all.
My favorite example is book titles in bibliographical references. As per ISO 690, these has to be italicised, so using CSS would not convey the full meaning.
@C. Ankerstjerne
You might be correct but, would ‘emphasizing’ a title be incorrect?
Could you not replace the <i> with an <em> and actually convey meaning?
Only if you are emphasizing the title of the book. You are not emphasizing a book title in bibliographical references.
As logic_earth says, it isn’t emphasised, only italicised. ISO 690 doesn’t mention anything about emphasis.
If it’s a reference, then it should be marked up with <cite>, which – coincidentally – is rendered in italics by default.
CITE refers to the entire bibliographical reference, not just the title. Marked up properly, it would be styled as such:
<cite>
LOMINADZE, DG.
<i>Cyclotron waves in plasma</i>.
Translated by AN Dellis; edited by SM Hamberger.
1st ed. Oxford : Pergamon Press, 1981.
206 p.
International series in natural philosophy.
Translation of : Ciklotronnye volny v plazme.
0-08-021680-3
</cite>
This can be extended with my proposed microformat:
<cite>
<span class="primary_responsibility">LOMINADZE, DG</span>.
<i><span class="title">Cyclotron waves in plasma</span></i>.
<span class="subordinate_responsibility">
<span class="translator">Translated by AN Dellis</span>;
<span class="editor">edited by SM Hamberger</span>.
</span>
<span class="edition">1st ed.</span>
<span class="publication">
<span class="city">Oxford</span> :
<span class="publisher">Pergamon Press</span>,
<span class="year">1981</span>
</span>.
<span class="extent">206 p.</span>
<span class="series">International series in natural philosophy</span>.
<span class="notes">Translation of : Ciklotronnye volny v plazme</span>.
<span class="standard_number">
<span class="isbn">0-08-021680-3</span>
</span>
</cite>
Your example, by default would make the entire block of text italic. So the <i> tag is kind of useless, since the whole debate is probably with styles turned off. Otherwise, you would use css to style the entire thing correct?
Also, this would not validate unless you wrapped a block level element around the cite tag.
That the entire block is italicised by default is an unfortunate consequence of using the proper semantics. The CITE element isn’t the only case where this is true. Semantics always comes before presentation, and since it is easily corrected with CSS, I don’t consider it a significant concern.
It is true that the CITE element has to be a descendant of a block-level element, but I didn’t want to include this in the example, to avoid cluttering it. Usually, I would place each CITE within an LI of an OL or UL, depending on the type of reference used.
Autistic Cuckoo wrote:
Hierarchy? How so? They denote semantic emphasis, that’s all.
Contrast leads to hierarchy and emphasis is a form of contrast.
How does contrast lead to hierarchy?
A hierarchy (in Greek: Ἱεραρχία, derived from ἱερός — hieros, ‘sacred’, and ἄρχω — arkho, ‘rule’) is a system of ranking and organizing things or people, where each element of the system (except for the top element) is a subordinate to a single other element.
emphasis does not create a hierarchy what it does is gives more weight to a word or parse.
Headers and list create a hierarchy.