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: 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: • Learn HTML in 1 hour 🌎
HTML in 5 minutes: • HTML in 5 minutes
// ALL THE IMAGES I USED FOR GOOGLES HOMEPAGE //
Google Logo: https://www.google.com/images/brandin...
The 3 dot icon: https://cdn3.iconfinder.com/data/icon...
The Profile Pic I used: https://i.pinimg.com/1200x/b9/c4/7e/b...
Search Icon: https://cdn-icons-png.flaticon.com/51...
Mic Icon: https://www.iconpacks.net/icons/1/fre...
Camera Icon: https://cdn-icons-png.flaticon.com/51...
// SOCIALS //
Twitter: / thecodingsloth1
TikTok: / thecodingsloth
#html #webdevelopment #htmltutorial #learnhtml #programming #coding #webdesign #VSCode #Tutorial #CodingTutorial
