I have had opportunities to participate and even organise programming bootcamps. Some of them had the purpose of just introducing basic knowledge of a given stack to beginners, whereas others were somehow advanced.
In this article, I am going to talk about best practices of enhancing Search Engines Optimisation(SEO) in HTML pages as a "BRIDGE" from being novice to expert.
Why does SEO matters?
For many websites, being ranked on the first page of Google search results is the best thing that can ever happen to them.
Imagine when you own an online platform that teaches how to cook. What can you do to stand out among 14,900,000 million results, therefore, be on the first page. People believe that the real of the content they want is only on the first page? One of the major purposes of your website is to bring visitors. But, remember, a big traffic comes from search engines such as Google, Yahoo and Bing.
The contents that appear on the 250th page of search engines result won't serve anything for your business, right?
What is Search Engine Optimisation?
Search Engine Optimisation is an array of practices of increasing the website's visibility in search engines and high change to be easily found. Most of those practices are done in HTML as a better way of facilitating what the website is about and allows it to show the content to the right people.
The power of HTML Tags in Search Engines
Don't underestimate "tags". Tags tell search engines how to read the content of the website and classify them depending on their types. In fact, you can quintessentially improve search engine visibility by simply adding the right tags in HTML.
When a search engine’s bot crawls a website, it analyses every single HTML tag. Therefore determines what contents are about.
Top HTML tags you shouldn't leave aside
1. <title>
In the <head> tag, you should have <title> because it helps to determine the subject of a particular page.
<title>How to prepare italian sausage</title>2. <meta name="description">
Meta description is used to determine a description of the web page
<meta name="description" content="Know how to cook sausages? So they're not weird and maybe raw in the middle? No? This two-step, simmer-then-sear method is for you.">There is a couple of meta tags you should have in the <head> tag such as Canonical tag, robots tag, open graph tags, etc.
3. Header tags(h1 to h6)
Header tags are very important in the structure of web content. They are not mandatory when designing web pages and it is okay. But, If you consider to avoid discouraging search engine's bot to crawl your website, you will need to have them. These tags play a vital role in the classification of the content in an efficient way. The order of your header tags reveals the level of value and dominance of content in sections.
<h1></h1>: This is reserved for the title of the web page. Usually it should be only "one" on the entire web page
<h2></h2>: H2 highlights the topic of the title.
<h3></h3>: H3 reflects points in regards to the topic and should support sub contents of h2.
<h4></h4>: H4 supports sub contents of <h3>.
<h5></h5>: H5 is not often used and supports sub contents of <h4>.
<h6></h6>: H6 is not often used too and supports sub contents of <h5>.
4. The "alt" attribute in images
One of the most effective ways of engaging the audience is to use images in the web pages. According to Medium.com, when a persons is reading an article, he spends much time viewing images than just reading text. Therefore, it shows how audience is highly interested in viewing photos. However, adding images in your article won't be easy for bots. It is very difficult for search engine's crawlers to determine which type of content in the image with just loading it. "Alt" attribute tells search engines the picture is for a given topic.
Without the "ALT" attribute, search engines would not know what the image is about. Therefore, this could reduce indexing the images in search engine results.
<img src="./path/image.jpg" alt="Italian sausage recipe">Recommendation
My journey to becoming familiar with HTML&CSS wasn't much tough. However, I did not know what to do next after designing fancy pages. I recommend all beginners to also think about how to facilitate search engines optimization in their deliverables.
Conclusion
In this article, I covered a few best practices of increasing search engine optimisation, feel free to add/suggest anything in the comment box.
Thanks for reading.
#Gracias!