DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

Rohit More
Rohit More

Posted on

The best way to master HTML

My Story :

I, as another newbie to web development, started learning the skeleton of websites, that is HTML, 7 months back. When I first started creating websites using HTML, for a long time I thought it was very easy to describe the structure of the websites and make them look exactly how we wanted. But there are a ton of concepts that you need to understand thoroughly in order to gain the maximum understanding of HTML and how it works. I will include a basic roadmap for you to follow, in a way where you will get a crystal clear understanding of all the important concepts you need to get hold of.

What exactly is HTML?

HTML is nothing but HyperTextMarkupLanguage. It is used to describe the structure of your website and position various elements. You can style your website using various options, one of the best as we all know is CSS (Cascading Style Sheets). There are various HTML elements, like headings, links, tables, etc. You can master them by building side projects where each one of the concepts has some use.

My Mistakes :

-> The number one mistake I did was getting stuck in tutorial hell. Basically, I tried following various tutorials and was busy watching all the tutorials all day and not actually applying the concepts I learned from them. Do watch tutorials, they are good for building a foundation, but also start implementing the concepts used in them itself.

-> My 2nd mistake was that I tried to learn everything at once, let me explain. I was learning about HTML with following a CSS tutorial too, I was so tempted to do new things with CSS, when I didn't even have a good hand at HTML first. Try and get a good grip on one thing first, then and only then move on to the next.

Resources for HTML -

There are various youtube videos and websites for learning HTML, I have shortlisted a few to save your time researching about them.

Websites -

w3schools.com

developer.mozilla.org/en-US

learn-html.org

freecodecamp.org/news/tag/html

Youtube tutorials -

youtube.com/watch?v=BsDoLVMnmZs

youtube.com/watch?v=G3e-cpL7ofc

youtube.com/watch?v=pQN-pnXPaVg

youtube.com/watch?v=kUMe1FH4CHE

A Beginner Roadmap for 7 days -

I am going to guide you through a basic HTML roadmap to get a good grip of all the concepts and moving ahead to CSS.

Day 1 -> Learn how HTML and websites work. Research about http, domains and browser engines about how they load websites.

Day 2 -> Basic HTML Headings and how to use them in different scenarios, also learn about paragraph elements and attributes.

**Day 3 -> **HTML Formatting text and fonts, build a basic website, where you apply these concepts and get hands-on experience.

Day 4,5 -> Learn about HTML tables, images, and links, this will also help you learn about the layout of websites.

Day 6,7 -> Start building a basic Portfolio website, think about how you can use these concepts, and make the website look amazing by only using HTML.

Thank you so much, for taking out time and reading this article. I hope you got some value from this one!

Top comments (1)

Collapse
alohci profile image
Nicholas Stimpson

Basically the right idea, but I'd say don't learn about fonts, or layout, or trying to make your website look amazing with HTML. These are all issues you can and should postpone until you get to CSS. Trying to do them with HTML will lead you down the wrong path. Concentrate on understanding the semantics. Learn about lists, and forms, the main element, alt attributes and the built in aria roles.

It's hard I know, we all have a natural desire to want to make our work look beautiful. I've been there; used tables for layout, blockquotes for indents, spacer gifs and other hacks we had to do back in the day. But now, I strongly recommend just being patient. You'll get on to CSS soon enough, and you'll end up with the right understanding of where the division between semantics and style properly lies.

🌚 Life is too short to browse without dark mode