HTML is one of the most basic coding languages that you can learn. Technically, HTML is a markup language, and because of this, it doesn’t take long to get up to speed. In this blog post, I will give you a rundown on how long it takes to learn HTML, based on my personal experience as a beginner coder and some tips for getting started. If you are have recently started or considering starting your coding journey to become a developer, HTML is a great place to get started.
If you are just here looking for the number of hours it takes to learn HTML, it is based on my personal experience. It took me 9 hours to learn HTML from scratch to the point where I felt confident enough to start building sites and exploring CSS.
So yes, you could, in theory, learn HTML in less than a weekend, which is why I recommend it as a great language to learn first on your coding journey, you can find out why here.
Everyone is different, just because it took me 9 hours doesn’t mean it will take you 9 hours. It could take you more, or you could do it even quicker. The rest of this blog post will be dedicated to what I did in those 9 hours, the problems I encountered, and the resources I used.
How I learnt HTML in 9 hours
My 9 hours journey started with the free CS50 Introduction to Computer Science course presented by a Harvard lecturer. The CS50 course was great, and I liked that it assumed no prior knowledge, making it an ideal starting point for beginners. The lecturer was also very engaging. One would expect a lecture about computer science to be boring, but that couldn’t be further from the truth with this lecturer.
When you visit the course page, it says that the course would take approximately 12 weeks to complete. 12 weeks would possibly be true if you spaced it out and were to include the time to complete the final project, which you actually need CSS to complete.
All in all, the course’s video content is approximately 4 hours, which I watched at 1.5X speed. So altogether, it took approximately 3 hours to complete.
At the end of the course, you are given a project to complete. After trying the project for about 10 minutes, I realised I wasn’t confident enough in my skills yet, so I turned to freecodecamp and took the course on responsive web design.
The course duration on this site is very misleading. It lists the course as needing 300 hours to complete. Once again, this could be true if you factor in doing the projects however you can get through the HTML and Basic CSS section in about an hour, which is what I did.
To this point, I was now about 4 hours into learning HTML
What you can expect after taking your first HTML course
After taking your first HTML course, you can expect that you will be able to create basic web pages. You won’t be a master of HTML, but you will have a good foundation to start building on, and you should understand the Basic HTML Document structure. If you don’t know that yet or are unsure, you can click here to learn about it and get code examples.
HTML is a very forgiving language, which makes it a great place to start for beginners. If you make a mistake, the code will most likely still work. So don’t worry if you are making mistakes, as this is completely normal. You can also jump start your HTML journey by understanding these 10 HTML tags every beginner should know.
Another thing you can expect is that it will be difficult to find good resources on HTML. This is because it is seen in the coding community as a very basic language, so it often gets overlooked, but don’t let this put you off.
This lack of resources is a big reason I started this blog. I wanted to help new coders like myself understand how to code in a language that they can understand, that of a beginner coder.
You will quickly realise that HTML does not make pretty websites, I don’t want to call anything ugly, but it is hard to think of a different to describe a purely HTML-based website.
It is at this point that you will realise you will need to learn more than HTML to make the types of website you want to make. Enter CSS.
CSS is a style sheet language, which means that it controls the look and feel of HTML elements. When you learn CSS, you will be able to control the colour, size, font and more of HTML elements.
CSS is not a difficult language to learn; however, it can take a little while to get used to.
So what did I do with the remaining 5 hours to learn HTML?
Practise makes improvement
By this time, I was tired of playing around with the Basic HTML Document structure and wanted to get some practical experience to put my HTML skills to the test, so I searched for a solution. That is when I found out about Frontend Mentor.
Frontend Mentor is a website that provides you with tons of example projects. The benefit here is that you dont need to come up with site designs, you can jump in and start coding. Another benefit is most (95%) of the challenges are free!
One of the best features about Frontend Mentor is the ability to filter the challenges so that you can filter for only HTML (and CSS) challenges at a “Newbie” or “Junior” level. I would suggest mastering these, as you will learn some important CSS concepts that beginners should know
Breakthrough the HTML tutorial wall
Breaking through the tutorial wall is a big step to take. This is where you officially go from student to coder, where you need to learn on the fly and Google as your life depends on it.
As I alluded to above, you can’t really make a website by today’s standard without CSS. So a “disadvantage”, if you want to call it that to Frontend Mentor is that you can only do challenges with HTML and CSS, not HTML on their own. Luckily the CS50 course I mentioned about does touch on CSS, so you at least know a few things.
Personally, I didn’t find this a disadvantage and think it is a good idea to learn HTML and CSS together. I wrote a detailed article on why that you can check out here.
The last 5 hours of the 9 Hours it took me to learn HTML was spent on Frontend Mentor doing challenges. To be specific, one challenge. A challenge that I tried again a few weeks after the first attempt, and it only took me 25 minutes to do on the second attempt. This shows you the learning curve you will face in the beginning, don’t let it deter you – push through it.
If you are interested in getting help from a group of friendly new coders like you click here to join our Discord group!
What did I learn on Frontend Mentor?
One of the first things you will learn is how to read other people’s code. Everyone codes differently. Some people use sematic markup and others don’t. Because people have different skill levels, the code solution vary in length, complexity and accuracy.
The next big thing I learned on Frontend mentor was about Semantic HTML, I probably spent about an hour researching what it was, if you should use semantic HTML, and what the benefits are to Semantic HTML. I have articles on all of these topics that you can click on above.
Conclusion
The last 4 of the 9 hours were spent on my first Frontend Mentor challenge and researching various aspects (admittedly CSS) to complete it. Granted, a lot of the research I was doing related more to CSS than HTML, I did learn valuable things about HTML in the process.
So if you are still wondering how long it will take you to learn HTML, the best advice I can give you is to jump in and try. In hindsight, one of the most important steps I took was breaking through the tutorial wall and getting practical coding experience, so make sure that you don’t just sit and watch people code but that you actually start coding!
And that is the story of how long it took me to learn HTML from scratch!
If you found this article helpful, I would appreciate it if you liked and shared it; if you found it on social media, it really does help. If you want to meet a community of new coders like you, click here to be sent a link to our Discord server and lets get to know each other – we cant wait to meet you!
Happy learning!
