Whether you are starting a blog or you own a personal blog, HTML is important in every aspect of blogging. Today I’m gonna share with you “HTML Basics every Blogger should know”. These HTML basics are helpful for both WordPress/Blogspot bloggers.
What is HTML?
HTML stands for HyperText Markup Language. We use HTML for creating web pages or websites. Any web page you see on the Internet is written using HTML code. All the HTML elements are represented by HTML tags (e.g. <title>). Browser does not show these HTML tags but by the help of HTML tags, they display the content of the page. Let us move to “HTML basics every blogger should know ?”
Basic HTML Tags & Codes
HTML tags are element name surrounded by angle brackets. While editing your blog post you have seen many HTML tags. Basic HTML tags are:
1. HTML Declaration & Root Element
In order to declare that the document is HTML, we use declaration tag at the start of HTML code. It is represented as <!DOCTYPE html>. You can see a practical example of this tag in the start of HTML code in Blogger theme HTML editor.
The root element of an HTML page is <html>, It’s end tag is </html>. Every element in HTML has a starting tag ( <tagname> ) and an end tag (</tagname>). The root element starts at the start of HTML code and ends at the end of HTML code.
2. The <head> tag
The metadata of any web page or blog post is contained in between the head tags ( i.e. <head> and </head>). It contains meta description, keywords, slug about the web page. Browsers do not display content inside the head tags but, it helps search engines to find your web page.
The head tags are placed after the starting of an <html> tag and before the <body> tag.
3. The <body> tag
This is very important tag as all the data between the body tags (<body> & </body> ) are displayed in the web browser. It contains headings, sub-headings, paragraph, etc. It starts after the end of the head tag. The structure of HTML page is as:
<title>Page Title HERE</title>
<h1>Heading goes here</h1>
<p>Paragraph goes here.</p>
4. HTML Headings & Paragraph
Inside the body tag, while using headings we use <h1> tag for most important heading, <h2> for next important heading & so on <h6> for least important headings.
<h1>Heading 1 goes here </h1>
<h2>Heading 2 goes here </h2>
……..and so on.
In a similar way, we can use HTML tags for paragraphs.The starting tag for a paragraph is <p> and the ending tag is </p>.
<p> Paragraph goes here.</p>
5. Use of Empty Tag
Empty elements are those tags which do not contain any content. We can represent an empty tag as: <br>. It does not have an end tag. You can use it to display space between lines.
6. HTML Links
In order to use links in your text content, you have to define the links using <a> tags as shown below :
<a href=”https://harishjoshi.com“> FullTechHelp </a>
Here the link is shown by Blue color & link text by Red color.
7. HTML Images
The use of tags in HTML images is same as in HTML links. Here we use <img> attribute.
<img src=”image.png” alt=”Image” width=”104” height=”142“>
Here, image address is represented by pink color, alt title by red color, image width by blue color & image height by the orange color.
8. HTML Buttons
HTML buttons are basically used to submit or reset data. The tags used for creating HTML buttons are <button> and </button>.
<button> Click Here </button>
9. HTML Lists
There are two type of lists: i) Unordered List (Bullet List) ii) Ordered List (Numbered List)
In order to create an Unordered list, you have to define the HTML in this way :
Similarly, If we have to create an ordered list we define HTML as :
10. HTML Quotations
In addition to <blockquote> tags for HTML Quotations, you can also use cite attribute to give credit to the original source of the quote. It is best shown by the example below:
If you are born poor it’s not your mistake,
but if you die poor it’s your mistake
Finally, these are the 10 Basics of HTML, every blogger should know.
Other Related Posts :
- Step by Step guide to starting a free blog in Blogger
- Make Money Online Guide for College Students in 2018
- Add PayPal Donate Button to Blogger & make supplementary income
These are the basic tags and HTML codes, you should know before starting a blog. The above guide includes the use of all basic code you use(or need to use) in your blog posts. Let me know your thoughts about this post in the comment box.
In this post, I’ve covered HTML basics every blogger need to know! In my upcoming posts, I’ll discuss other interesting topics on Blogging.
- How to add WhatsApp Share Button in Blogger [Step-by-Step] - October 3, 2020
- How to Remove Powered by Blogger from Your Blog Footer? - September 27, 2020
- Beginners Guide to Keyword Research in 2023 - May 1, 2020