HTML Tutorial For Beginners

In this video, I'll guide you step-by-step through the fundamental elements of HTML, and by the end, you'll be able to recreate Google's iconic homepage. This comprehensive guide is perfect for aspiring software engineers, so dive in and take your first step toward mastering web development
Remember 0 * 10 = 0
VS Code Download: code.visualstudio.com/download
// TIMESTAMPS //
00:00 - Intro
00:51 - Getting Started
01:09 - why index.html??
01:50 - back to HTML
02:12 - What is autocomplete stuff???
03:39 - Time to start writing HTML
04:07 - What are HTML Tags and Elements?
04:48 - Writing our first HTML Element
05:02 - Semantic HTML
05:32 - Basic HTML text elements I recommend you know
05:48 - The div tag (Better know this one)
06:11 - How to make a button
06:26 - How to add links
06:49 - HTML attributes (pretty important)
07:02 - Finishing our first link
07:36 - Absolute Links and Relative Links (also pretty important to know)
09:05 - Organizing our files like a real software engineer
10:20 - Adding images
11:43 - Adding Forms and Inputs
12:59 - Nesting Elements (parent and child)
13:18 - You are now a pro (here's some things you can do now)
13:34 - Making Googles homepage
//ADDITIONAL LEARNING RESOURCES //
If you're feeling motivated and want to move on ahead or wanna learn some of these topics in a more in-depth way, or if I just didn't explain something good, here's some resources I recommend trying out:
The Odin Project: www.theodinproject.com/
Full stack Open: fullstackopen.com/en/
Learn HTML in 1 hour: • Learn HTML in 1 hour 🌎
HTML in 5 minutes: • HTML in 5 minutes
// ALL THE IMAGES I USED FOR GOOGLES HOMEPAGE //
Google Logo: www.google.com/images/brandin...
The 3 dot icon: cdn3.iconfinder.com/data/icon...
The Profile Pic I used: i.pinimg.com/1200x/b9/c4/7e/b...
Search Icon: cdn-icons-png.flaticon.com/51...
Mic Icon: www.iconpacks.net/icons/1/fre...
Camera Icon: cdn-icons-png.flaticon.com/51...
// SOCIALS //
Twitter: / thecodingsloth1
TikTok: / thecodingsloth
#html #webdevelopment #htmltutorial #learnhtml #programming #coding #webdesign #VSCode #Tutorial #CodingTutorial

[@ifeoluwaoladeji7535]

Best editing I've ever seen on a startup channel and audio too💯

[@kristonr6188]

You explained everything so clearly dude, instant sub!

[@yacinebg8582]

Bruh you're the best thank you so much, i just start learning HTML and CSS and i never code before; you helped me a lot keep it up!!!

[@Talvisielu]

Excellent explanation. The best I’ve seen so far without much details. Can you do one for Python?

[@Chick0714]

A subscriber fron India 🇮🇳 💫

[@yenxz2002]

Helped me a lot tbh

[@Sigmosity]

good editing man a entertaining way to teach

[@Zielak99]

i tell u another secret: semantic html is harder than you think. 90% devs dont use it to fully potential. you better be looking out for stuff like or (for key-value pairs) ;)

[@The_Catnip]

Really? But it seems so logical, and easier to know and understand web pages.

[@Wilton24]

Noice and concoise!

[@The_Catnip]

I waited for a Rickroll but it never came. Missed opportunity, man.

[@delofon]

6:40 me seeing copilot suggesting a rickroll 💀💀💀

[@Lofisasddle]

hey bro do you have telegram or something I just need to get some tips about how to manage both web development and CP .by the way love you work keep on the videos specially the daily dose of leetcode

[@TheCodingSloth]

Thanks, I currently don't have a telegram or anything, but I could probably make a discord if any of you guys need more help

[@Lofisasddle]

@@TheCodingSloth sure it would help