HTML Tutorial For Beginners

Description

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: https://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: https://www.theodinproject.com/ Full stack Open: https://fullstackopen.com/en/ Learn HTML in 1 hour: https://www.youtube.com/watch?v=HD13eq_Pmp8&t=1540s&ab_channel=BroCode HTML in 5 minutes: https://www.youtube.com/watch?v=salY_Sm6mv4&ab_channel=AaronJack // ALL THE IMAGES I USED FOR GOOGLES HOMEPAGE // Google Logo: https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png The 3 dot icon: https://cdn3.iconfinder.com/data/icons/feather-5/24/more-vertical-512.png The Profile Pic I used: https://i.pinimg.com/1200x/b9/c4/7e/b9c47ef70bff06613d397abfce02c6e7.jpg Search Icon: https://cdn-icons-png.flaticon.com/512/3031/3031293.png Mic Icon: https://www.iconpacks.net/icons/1/free-microphone-icon-342-thumb.png Camera Icon: https://cdn-icons-png.flaticon.com/512/883/883746.png // SOCIALS // Twitter: https://twitter.com/TheCodingSloth1 TikTok: https://www.tiktok.com/@thecodingsloth #html #webdevelopment #htmltutorial #learnhtml #programming #coding #webdesign #VSCode #Tutorial #CodingTutorial