A Simple and Non-Scary Guide to HTML for Bloggers
Blogging could be a very lucrative business, however, being a blogger requires a lot of specialized knowledge especially as it regards, search engine optimization (SEO), web design, HTML (HyperText Mark-Up Language)and possibly WordPress.
While each of these technologies is important, HTML is probably the crux of it all. In fact, no blogger can do well in the profession without a strong knowledge of HTML.
You don’t need to be an HTML expert to become a blogger or web designer. However, you need to know vital concepts in HTML, especially as it relates to SEO to be a blogger.
The H1 Element is Important
H1 or Heading 1 is an important heading in HTML, usually the biggest heading. For most beginners in HTML, H1 is used to make a text look bigger but it is not always the case. In fact, the meaning of H1 goes deeper than that.
The H1 tag gives special instructions to the search engine. It tells the search engine that the element in question is the main heading of the page. From the SEO point of view, only one H1 element should be on a page.
Putting several H1 elements on a page could hamper your SEO effort and adversely affect your search engine ranking, no blogger wants this.
Like any other HTML tag, the H1 tag is enclosed in an opening and closing tag (<h1></h1>). Within the tags, you can have several attributes such as alt, style, class, title, id, etc.
These tags can be used to define the property of the h1 element and every web designer and blogger should know them.
The H2 Element and Other Headings
The H2 element is also an important HTML element for every web designer and blogger. This element is usually smaller than the H1 element but it can sometimes be made bigger, depending on the styling property you choose.
The H2 element is also important for SEO purposes. The search engine expects major subheadings in a blog post or page to be H2 elements.
In other words, unlike the H1 element, there could be several H2 elements on a page. However, lower subheadings could be H3, H4 and other subheadings.
When building a website or a blog post, you should pay attention to the positioning of the heading elements because of their implications and importance to SEO.
Design, Looks, and Styling
Looks and designs are important in web development and blogging. In fact, statistics show that 94% of all first impressions on a website are related to its design. Moreover, 90% of users say they will continue to shop on a website if it has a great user interface design.
With these statistics, it is apparent that design is important in a website and a blog. Every web designer should understand how to make a website look great. Although this may be related to the HTML element, it falls more into the domain of CSS (Cascading Stylesheet).
As a matter of fact, HTML deals with the structure of the website while the CSS deals with the design and looks of the site. Sadly, CSS has its own syntax and language style.
Many versions of CSS have been released but the current and the most used version is CSS3. Furthermore, it is also possible to write the style in SCSS, LESS and then convert them to CSS.
Most of the styles defined on CSS can also be defined in-line on HTML. However, defining a style on CSS makes things neater as it separates the structure from the design.
The CSS defines the body, heading, titles, paragraphs, etc. The styles are delimited from their properties with a comma. For instance, to set the color, font-size, and background-color for the body, we have:
body{
color: red;
font-size: 14px;
background-color: blue;
}
When defining a style, special attention should be paid to style definition for a “class”, “id”, “element”, etc.
Other Important HTML Elements
The headings are not the only important HTML element in a webpage, several other elements such as links, images, and lists are also important and every web designer and blogger should know how they work.
Links
Links are defined by the anchor tag (<a></a>) in a web page, they can either be dofollow or nofollow links.
Dofollow links pass on link juice to your page, making you rank high in the search engine. The more dofollow links linking to your page, the more backlinks and authority you will have, example <a href=”http://mywebsite.com” ></a>
Furthermore, nofollow links do not pass on link juice to your site and so the links do not allow bots from search engines to follow your links, example <a rel=”nofollow” href “http://mywebsite.com”></a>
Image
The image tag, defined by <img> is a special HTML tag every web designer and blogger should know. Unlike other HTML tags, the image tag does not have a closing tag.
This image tag is important to bloggers because of the importance of image in a blog post, page or a website. Most blog posts that get traffic have at least one image and so it is important to know how to add an image tag to a post.
The image tag is very easy to define. You have to specify the src and probably the alt and title elements. Here is an example <img src=”https://mysite.com/img.jpg” alt=”my image” title=”my image title”>
Lists
Most times when writing a blog, you want to add bullet points and lists to make the article neater and clearer. HTML lists are the ideal elements to do this.
There are two types of lists – ordered and unordered lists. As the name implies, ordered lists are numbered with Arabic or Roman numerals but unordered lists are designed with bullet points.
You can define ordered lists with ol. Example <ol><li>HTML</li><li>CSS</li></ol>. Similarly, unordered lists can be defined with ul. Example <ul><li>HTML</li><li>CSS</li></ul>
In conclusion, every blogger and web designer should understand some basic HTML concepts. Since HTML and CSS are intermarried, it is also important to understand CSS. This will help you to create an attractive website or blog page.
