You will never succeed as a web developer without learning these HTML fundamentals
Contents
- Why do you need to master HTML ?
- HTML Primer
- Bonus Tips
- Conclusion
Why do you need to master HTML ?
HTML stands for Hyper Text Markup Language. It is the foundation Lego piece you need to get right to create any webpage.
Learning good foundations in HTML can help you in 2 key areas
- SEO(Search Engine Optimization)
- Accessibility
SEO
Before understanding about SEO, we need to understand what happens when you search for something in Google. Here's a great article that summarizes the whole flow. Gist is that when Google crawls the web page, it indexes and ranks them. It serves the webpage when user searches for a specific query. SEO is the process for optimizing the webpage so that it can rank higher. A great way to do this is using Semantic HTML.
Accessibility
Web is for everyone irrespective of their gender, race, caste, disability etc. It is not a place just for the elite. Making website accessible for people with disabilities is a great way to encourage more people to try out your website. Semantic HTML helps in terms of accessibility.
Now that you know about why you need HTML, lets dive into fundamentals
HTML Primer
To describe any piece of content on a webpage you need a tag.
Some of the most commonly used tags are
<h1></h1>
<h2></h2>
<h3></h3>
<div></div>
<a />
<img />
<select />
<input />
<form></form>
<body></body>
<button></button>
You can find the bigger list here
Each tag might have attributes to fine tune it to specific use cases.
An example might be You are developing a website for artists and need a color selector you would use "color" in type attribute
<input type="color" />
Here's a sample html page with some tags
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
Hello, Everyone
</body>
</html>
Bonus Tips
While you can write text inside of div, using appropriate tag like h1/h2 is the best route of take in terms of SEO, as search engines indexes titles for keywords. Writing semantic HTML is very crucial If you want to create a website which many people want to use.
Conclusion
HTML should be seen as a structure/blue print for any webpage you visit. HTML is a way to organize the text on any webpage. If you are building a house at least in the United states you would first set up the structure of the home, and then put in the walls, paint them etc. HTML structures your webpage just like a structure helps you in building the house.
Please comment down If you want me to write any article about How search works. Please like this post If this helped you.
Top comments (0)