Get to Know the Phrase Elements of HTML

Phrase Elements are very important to know in HTML, as they add meaning to the code.

Introduction 
 
 
Today, we will be learning about some phrase elements, elements which have some purpose in addition to the presentation of the webpage. These may include <em>, <strong>, <blockquote>, <cite>, <q>, <abbr>, <acronym>, <dfn>, <address>.
Here, the <em> tag emphasizes the use of this tag basically introduce emphasis to a certain code where it is utilized for example:
 
<html>
<head>
<title> The Emphasis TAG</title>
</head>
<body>
<p>
<p>You <em>must</em> read Quran in a day. </p>
</p>
</body>
</html>
 
The <strong> element gives emphasis so its content is stronger than that of an emphasis tag <em>. Most browsers using the <strong> emphasis are displayed in bold font, for example:
 
<html>
<head>
<title> The Strong TAG</title>
</head>
<body>
<p>
<p>You <strong>must</strong> wear gloves in ICU of a hospital. </p>
</p>
</body>
</html>
 
The <address> element is used to contain addresses. This is a special tag we used in HTML  to contain addresses in a special format, for example, the representation of an <address> tag may differ from browser to browser.
 
<html>
<head>
<title> The Address TAG</title>
</head>
<body>
<p>
<p>
<address>Online Blogger, Karachi, Pakistan, PKI 46256</address></p>
</p>
</body>
</html>
 
The <abbr> tag is used for abbreviation to be placed between the opening and the closing of the tag. When possible we use a title attribute whose value is the full version of the abbreviation. Let's walk through an example:
 
<html>
<head>
<title> The Abbreviation TAG</title>
</head>
<body>
<p>
<p>
I have a Pakistan currency called <abbr title=” Pakistani Rupees”>PKR</abbr>.
</p>
</body>
</html>
 
An acronym is a word or a name with an abbreviation such as ASCII, NASA, etc. For example, ASAP is the acronym for As Soon As Possible. HTML understands the importance of acronym and has a tag for acronyms to be displayed within the content of a webpage Let's walk through the following example:
 
<html>
<head>
<title> The ACRONYM TAG</title>
</head>
<body>
<p>
<p>This example covers marking up text in <acronym title=” Extensible Hypertext Markup Language”>XHTML</acronym>..
</p>
</body>
</html>
 
Sometimes we find in such a situation that introducing the term may improve content clarity. Therefore, introducing a term can be handled within HTML using the <dfn> tag. This tag is meant for special terms, typically you would use the tag for the first time you introduce some kind of key term to help us understand. Let's walk through an example to have crystal clear understanding for the tag:
 
<html>
<head>
<title> The DFN SPECIAL TERM TAG</title>
</head>
<body>
<p>
<p>
This blog series teaches you how mark up your documents for the Web using <dfn>HTML</dfn>.
</p>
</body>
</html>
 
Coding is a very important part whenever the content is concerned, as it may have several other sources to be quoted. This particular content in HTML has a special tag known as <blockquote>. The <blockquote> element is used for quoting text Let's walk through an example which shows how to use the <blockquote> tag.
 
<html>
<head>
<title> Quoting text using BLOCKQUOTE Tag</title>
</head>
<p>The following description of XHTML is taken from the W3C Web site:</p> <blockquote>XHTML 1.0 is the W3Cs first Recommendation for XHTML, following on from earlier work on HTML 4.01, HTML 4.0, HTML 3.2 and HTML 2.0. </blockquote>.
</p>
</body>
</html>
 
Whenever the quotation is been quoted, the source of the quotation is really important. The source is to be presented in its own way. HTML has introduced a special <blockquote> attribute cite. To better understand the use of cite we may consider the following example:
 
<html>
<head>
<title> Quoting text using BLOCKQUOTE Tag with CITE Attribute</title>
</head>
<body>
<p>
<blockquote cite= "http://www.w3.org/markup/" > XHTML 1.0 is the W3Cs first Recommendation for XHTML, following on from earlier work on HTML 4.01, HTML 4.0, HTML 3.2 and HTML 2.0 </blockquote>
</p>
</body>
</html>
 
For putting a quote within the sentence rather than a block, we used the <q> tag. It is recommended to use the <q> tag when we need to insert short quotations. Let's walk through an example to understand it better:
 
<html>
<head>
<title> The <q> tag</title>
</head>
<body>
<p>As Nasir said, <q>Somebody is boring me. I think it's me myself</q>. </p>
</body>
</html>
 
Today we learned about some of the phrase tags or elements that add purpose with presentation on our webpage. In the next blog of this series, we will be learning some new phrase elements or tags which help us enhance purpose within the content.