9 HTML tags to complete before publishing blog post

By: Bluegum Creations
Sunday, 10th December 2017
9 HTML tags to complete before publishing blog post

If you intend to run any blog, you properly need to know about some useful HTML tags. If you are unknown about these tags, then HTML stands for Hyper Text Markup Language. It is a basic code written to build any websites.

Tags start and close with <> and </> respectively.
For example, a paragraph tag starts with <p> and ends like </p>.
You can use HTML tags without understanding the bulky codes. Though, you need to understand some basics if you want to be a good blogger. Some of the important tags are listed below in the article.

  1. Creating Lists

    Creating a list is easy. You just need to use tags like: <ul>, <ol> and <li>
    They create lists of different types know as an unordered list and ordered lists.
    An example of unordered lists (bullet list) is shown below:
    This displays in website like:
    • Goat
    • Hen
    • Cock
    • Deer

To use numbers rather than bullet points, switch <ul> and </ul> with <ol> and </ol> respectively.
This will change everything like
1. Goat
2. Hen
3. Cock
4. Deer
This is an easy way to build a simple list of websites. Also, you can use nested lists.

  1. Image Tags

    Image tags help you insert images on the website. People use “Add Media” button in WordPress instead of writing out image code.
    Image tags are built like <img>.
    For example: <imgsrc=https://image-link/image.png width=”350” height=”360” alt=””>
    src gives the address of image file you want to insert in the website. alt gives description useful for SEO. We recommend using alt in img tags often.
    Width and height help to resize the image on the page.

  2. Links

    Links directly help your search engines. Use them efficiently on your blog. They are also known as anchors.
    An example of this tag is like: <a href= ” https://www.awebsite.com/videos/5 “ target=”atarget” rel=”an example”> Click here </a>
    “a href” creates a hyperlink. You can add links to the word(s), phrases, or images. A link is produced like:
    Click here to go to the page.
    This link takes you to other pages given by ‘href’.

  3. Horizontal lines

    Horizontal lines create a line. This line runs across your webpage. This creates a line of


This breaks up areas of the content.
Horizontal line tag is used like <hr/> and helps you change the topic of. It splits up sections of content. The line runs from the left to right side of the page and is typically a light grey color. Also, changing the width of the line is possible.
<hr width = “40%”>

  1. Blockquotes

    Blockquotes are used when we refer someone to a blog post. Also, remember to cite your source when adding a quote. Blockquote looks like:

<blockquote> “Your quote is given here” – Person name </blockquote>
Blockquote just indents your block.

  1. Heading

    Heading divides topics with its contents. Use it wisely around your website. Heading tags look like:
    <h1>, <h2>, <h3>, <h4> and so on. As, the number increases the size of heading decreases. The size of <h2> is greater than <h3>, <h4> and so on. People want heading large one and sub-heading smaller one. So, you can use title of blog as <h1>, heading as <h2> or <h3> and sub-heading as <h4> or <h5> and so on.

  2.  Formatting fonts

    In blogs keeping text or phrases bolded, italicized and underlines is sometimes essential. They are wise methods to add emphasis to words or phrases.
    Tags for bold and italic are <strong> and <em>.
    To bold text, write code as: <strong> Strong text </strong>
    Italicizing is also quite easy: This is used to <em> italicized </em> the word or phrase.
    Underlining is done as: This is <u> underlined </u>
    Remember not to confuse people underlined text for a hyperlink.

  3. Line Breaks

    Line breaks create a single space between lines of text. Add line breaks with <br/> tag. This tag hs no ending tag. Line break looks like:
    “This is a <br> line break.”
    This makes “This is a” in a line and “line break” in other.

  4. Align elements

    Sometimes you want to manage alignment of your images of text and phrases. Rather than just continuing the ongoing alignment, you want to center an image or align it right or left. They help you make your content look organized.
    For example: To align a line of text centre- <p align= “centre”> This goes to centre</p>
    : To align a line of text left- <p align= “left”> This goes to left </p>

These are some of the basic HTML tags useful for a blogger.