Learning Basic HTML: Text and Paragraph Formats In HTML

In Web Designing Skills, Webmaster Skills
Understanding HTML

You’ll frequently find many text format in HTML writing, either in the title writing or the content of a website page. Here are some explanations and examples of text formatting In HTML.

Text Formats In HTML

There are several text formats in HTML that are frequently used, such as;

Bold Text in HTML

To bold a text on a web page view, you can use the following <b> tag. The following HTML syntax is the example of how to create a bold text format on a web page:

<b> this is a bold text </b>

Italic Text in HTML

To make an italic text in HTML, you can use <i> tag. For example: <i> this is an italic text </i>

Underlined Text in HTML

To make an underline under a text on a web page, you can use <u> HTML tag.
For example : <u> this is an underlined text </u>

The following table is the text formats that are often used in HTML.

HTML tagDescription
<b>bold text format
<i>italic format
<u>underlined text format
<small>small text format
<strong>text format similar to bold format
<sub>sub-scripted text format
<sup>super-scripted text format
<ins>underlined text format
<del>a text format with a line in the middle
<mark>colorful text format

Here’s an example of writing tags/text format elements in which have been studied above:

Here are the browser view text format elements above:

Text formats in HTML

Paragraph Format in HTML

To create a paragraph in HTML, use the <p> tag, firstly you have to have understood how to write tags, elements, and attributes in HTML. The paragraph HTML tag is the form to make paragraph view on a web page. There are three paragraph attributes that can be combined directly with paragraph tags (<p> and </p>), such as:

  • To make a paragraph content at the left-side of the web page using <p align=”left”>the paragraph content</p>
  • To make a paragraph content at the a right-side using <p align = “right”>the paragraph content</p>
  • To make a paragraph content at the center on the web page using <p align=”center”>the paragraph content</p>
  • To make both left and right sides of a paragraph content justified using  <p align=”justify”>the paragraph content</p>

Learn the following HTML paragraph format example:

An HTML paragraph format uses <p>. Below is the implementation of <p> in an HTML document:

Paragraph format in HTML

From the example above, you can see that the writing of the first and the second paragraphs re separated. To separate between the first and the second paragraphs is using the <p> tag.

Read also: How to write heading tags in HTML

Types of Paragraph in HTML

Here are some examples of paragraph types in HTML.

Left Paragraph

<p align = “left”> 1. This is a left-side paragraph writing in the HTML document </p>

Right Paragraph

<p align = “right”> 2. This is a right-side paragraph writing in the HTML document </p>

Centered Paragraph

<p align = “center”> 3. This is the a centered paragraph writing in the HTML document </p>

Justified Paragraph

<p align = “justify”> 4. This is a justified paragraph writing in the HTML document </ p>

Here’s a complete example of writing all of HTML paragraph types in an HTML document or web page.

Types of paragraphs in HTML

Web Design Tips

  1. Make sure you have no problem with your HTML structure on your web content. Make your web document HTML structure SEO friendly (indexable content).
  2. Use online tools such as Google’s cache, MozBar, or SEO-browser.com to find out what elements of your content are indexable to the search engine.
  3. After checking using those tools, you may find that your web page is not even showing a particular part of your HTML text on those tools. For most marketers, this is a big problem as their content is not visible on search engines.
  4. If you someday in the future become a professional web designer, you will find that most of your clients must primarily concern on SEO in their web design requirements. So, learn from now on Onpage SEO skill and how you should create a website for them and what people are really most need in their web design. If they really matter on SEO, then, using an SEO-friendly HTML structure is mandatory.

Leave a Reply

Mobile Sliding Menu