These days there are many blog services that help you to get started with a blog visually and make it easier for you without understanding HTML tags. With the blog services normally what you have to do is just to consider your blogging structures such as thinking about its readability with paragraphs and pictures.
However, sometimes the blog service may create the HTML incorrectly, and your text doesn’t appear as you typed since there is a limit to reflect automatically and accurately all the HTML to the web page format. But in this case, you (the administrator of the web page) are the person who can fix the problems by manually correcting the HTML. If you use only the visual editor and you don’t have knowledge of HTML tags, it might be difficult to check if your HTML is correctly typed and prevent the structure collapse. So it’s better to keep some HTML tags in mind even if you prefer to mainly use a visual editor.
How to use HTML tags
What is HTML?
First of all, if you are not familiar with HTML, it stands for Hyper Text Markup Language which is a programming language that allows you to display your text files and images pictures on the screen of a web page. When you create a web page or blog, it is necessary to use HTML tags for formatting your text functionalities like sizes, colors, and formatting.
How to use HTML?
<b>How to use HTML?</b>
As you can see above, when you want to specify an HTML tag generally you need to “sandwich” the text that you want to format between the start and end tags. The start tag is placed at the beginning and encloses “<>” an “attribution,” and the end tag is placed at the end and encloses “<>” an attribution with a “/” in front of it. By specifying the attribution, it is possible to give a fine role to the HTML tags.
Here’re 25 HTML tags which bloggers should master. We will explain each of them by classifying them by font, layout, link, list, and table related tags.
25 HTML tags every blogger should master
Font related tags
This is a style to make the letters thick (bold letters) and helps to make the content standout.
This tag makes the letters stand out above the rest. Most browsers and software make the letters bold in this case, but some may stand out the letters in another way (i.e., if a software shows all letters in bold by defect, the strong tag can change the color or the shape).
This style is used to make differentiation from other letters by changing the letters to an italic font.
This tag makes the letters different from the rest. Most browsers and software make the letters italic in this case, but some may differentiate the letters in another way (i.e., if a software shows all letters in italic by defect, the em tag can change the color or the thickness).
You can use it when you need letters with an underline.
<s></s> or <strike></strike>
This is used to show that it’s no longer accurate (even though it was correct in the past). Use it when you need a strikethrough.
This tag marks the letters as canceled or deleted. Most browsers and software make a strikethrough of the letters in this case, but some may mark the letters in another way (i.e., a software can change the color or the shape to mark something as deleted).
<h1></h1>, <h2></h2> ~ <h6></h6>
With this heading tags, you can specify the size of the heading letters. You can check the final look with a preview functionality, and you can choose between 6 sizes (heading 1 to heading 6).
This is used when you want to quote or reprint texts.
It makes the font small, and it’s normally used to refer to disclaimers, legal constraints, terms documents, warning, and copyrights. Use it to deviate the attention of the reader to other important contents.
<font color=”(color code)”></font>
Using this HTML tag, it is possible to change text colors. If you don’t know the HTML color codes, you can check them out on http://html-color-codes.info/.
Layout related tags
It is used to treat the content enclosed inside as a paragraph. You can also use it if you want a new line to differentiate between parts of your post to improve the appearance.
This allows you to put a line break when you want to change the paragraph. It is used when the new line is going to be a part of the content, not to adjust with the line break for its look. This tag doesn’t require the end tag.
This HTML tag adds a horizontal line that means a separation between parts of content or paragraphs. The end tag for this is also not required.
It’s used when you want to specify the position of the text to the center.
With this HTML tags, you can align the position of the text to the right/left side. In the “~” part of the formula above for this tag, you will write “right” or “left.”
List related tags
This tag is used for listing of items that do not have an order. It always requires to contain one or more of the <li> element which is explained below.
On the other hand, the <ol> tag is used for listing of items that have an order. Like the <ul> tag, this requires to contain one or more of the <li> element too.
It represents each individual list item in a list and normally it is contained within the <ul> or <ol> tags.
Link related tags
Anchor/link HTML tag allows you to specify a hyperlink to the related information on the web. Mainly you will use this with a hypertext reference “ref” that refers to a destination anchor code or a URL.
This tag is used to add images to your content and needs at least to include the attribute “src” to specify the source of the file. You can also customize your image using attributes for width, height and alt text. This is an example for using it: <img src=”image file name” alt=”alt text for the image” width=”image width” height=”image height”>.
Table related tags
It is used when you want to create a table. It’s the basic structure in the <table> tags and you will need to use it with additional tags to define the horizontal lines with the <tr> tag and the cells with the <th> or <td> tag.
This is used to define a horizontal line of a table.
It is used to create a header cell to define each heading.
It is used to define a data cell which defines each data.
These HTML tags above are very useful to give correct directions to internet browsers on how to display your content exactly as you want. In addition, HTML tags help you to broaden your capacity for expression, increase the readability of your contents and drive your readers to your conversion cycle. We hope this post will help you to manage your blog better and increase the engagement of your readers.
Do you have any other HTML tags that is useful for bloggers?