HTML & CSS for Absolute Beginners: What's next?
Key Takeaways
Builds a basic HTML website using HTML and CSS
Full Transcript
you've done it you finished this course so now what first off a really huge congratulations on finishing it and getting through all of the material here because we've covered a lot of material so the very first thing I want you to do is take some time to digest everything we've learned uh and not just like and if you felt overwhelmed because we were covering a lot that's fine we covered a lot there's tons of information in here and definitely there could be some cognitive overload depending on how fast you went through all of this so you did it though you got through to the end you have a functioning website that is something really amazing and something you should be really really really proud of I'd love it if you could tag me on blue sky or Mastadon or whatever social network you're on to let me know that you did it cuz it's just I want to celebrate along with you it's super cool that you got this far and then once you're ready and you've taken some time to digest it maybe you've gone back over a few things just to make sure you understand them that's awesome I always encourage that people do that and play around with it and experiment with what we have here at one point I definitely think it's time to start a new project but I want you to avoid tutorial hell and tutorial hell is when you start just following another course and then another tutorial and another thing that you find on YouTube and then a blog post it doesn't matter what they are but it's always tutorials that walk you through all the steps of what you're doing and you're able to follow those courses and understand everything that's happening in it you know what this code is doing you look at it you understand it and when they're the person is writing it you understand every step they're doing but then you go to start something on your own and you have no idea where to start or you go to make a two column layout like this on your own and you completely forget how to do it you come back to this and you look at it you go oh yeah that's obvious I I wish I don't know why I didn't remember that that's when you're stuck in tutorial hell and it's because there's a very big difference between being able to understand something and to be able to do that thing yourself and it's with everything that you see this but like physical things like I always related to skateboarding cuz you could watch some of skateboard you could understand everything they're doing watch tutorials all of that you you won't think that you could just step on a skateboard and start you know shredding up the skate park you're going to know that it's going to be really hard to do all of that because there's a lot of things just knowing it is different from doing it it seems different with code but it's the exact same type of learning process that goes with it you learn what something is you learn how it works and then you learn to be able to do it on your own so I think at this stage a really good thing to do once you've had a break you've had time to digest things a little bit maybe you've played with the code here just to make changes and tweaks and everything else is to create a new project but very similar to this one maybe a personal project on a hobby that you know or that something that you could have some content to fill in the page but just covering a lot of the same things that we've done here two to three pages at the most simple enough a couple of columns maybe you try and do a three column layout instead of a two column layout so some little changes within the layout a new color scheme that's much better than the one we created with this one uh some stylistic differences maybe look at like small little tweaks you could do and what's going to happen is you're going to be able to start building it out you're going to get stuck along the way so you're going to reference back to the project that you did as you built along with me or you'll go back through the course pages and find the different things that remind you how to do stuff don't copy and paste any code go oh yeah that's how we did it and then write it yourself it's going to reinforce what you've been learning and then you're also going to have things where you be like oh it'd be really cool if this had a round Corner instead I don't know how to do that you look up that thing and you find out how to do it it's really easy to do so you find out okay I'm going to add that in there and then what if we had a shadow here or this other thing here maybe you want an animation somewhere but you're doing it all based on like you're building you're rebuilding what you've already done in a new way you're making tweaks to it you're reinforcing what you've learned you're finding your knowledge gaps or you're getting stuck on stuff you've already done so you're going back and figuring that out and then you're sprinkling in a few new things along the way and those new things will just add to the repertoire and you're slowly going to level up as time goes on from there and if you do end up doing that and you build something that's a little bit cooler than this or just as cool as this or whatever whatever it is once again please reach out on social media and let me know because I love seeing the types of things people do as a next step after getting through this type of course and don't worry if it takes you a little while to do just take your own time everybody's at their own schedule their own pace can be a lot of getting stuck on really simple things that you did over and over and over again in here if that's happening do not feel demotivated it's very very normal to have to get stuck on a whole bunch of things you've already done how to Links work is it an href is it an SRC what's the difference between padding and margin I don't even remember which one it is and I don't know how to add space and I'm trying to add it and it's not working completely normal so we've covered a ton of material here not all of it's going to sink in I'm saying this over and over because I've seen too many people get demotivated when all of a sudden they can't rebuild this site first try no problems at all so take your time go start building some really cool layouts and yeah have a lot of fun cuz for me I love web development and I'm really happy that you chose this course I really hope you enjoyed it and you learned a lot from it and I'm really happy to have helped you in these early stages to what I'm sure is going to be you going out there and building some really really amazing things
Original Description
You made it to the end, congrats!!! 🥳
🎓 Enroll in this course for FREE - get additional lessons, written content, interactive exercises, and more: learn.kevinpowell.co
📂 Get the course files here: https://www.dropbox.com/scl/fo/kusdjekuytcaa3of0vtd4/AChRHcF13pNi93JWusfLW9A?rlkey=tbrbxnabsi52u6onal9rh7fwm&st=iyo2wujq&dl=0
Learn to build websites from scratch - even if you've never written a line of code before. This hands-on course teaches you the fundamentals of HTML and CSS, the building blocks of the web. You'll start with the basics and progress step-by-step to creating your own responsive websites. Perfect for complete beginners who want to start their web development journey.
#css
--
Come hang out with other dev's in my Discord Community
💬 https://discord.gg/nTYCvrK
Keep up to date with everything I'm up to
✉ https://www.kevinpowell.co/newsletter
Come hang out with me live every Monday on Twitch!
📺 https://www.twitch.tv/kevinpowellcss
---
Help support my channel
👨🎓 Get a course: https://www.kevinpowell.co/courses
👕 Buy a shirt: https://teespring.com/stores/making-the-internet-awesome
📽️ Join as a channel member: https://youtube.com/@KevinPowell/join
💖 Support me on Patreon: https://www.patreon.com/kevinpowell or through YT memberships: Join this channel to get access to perks:
https://www.youtube.com/channel/UCJZv4d5rbIKd4QHMPkcABCw/join
---
My editor: VS Code - https://code.visualstudio.com/
---
I'm on some other places on the internet too!
If you'd like a behind the scenes and previews of what's coming up on my YouTube channel, make sure to follow me on Instagram and Twitter.
Bluesky: https://bsky.app/profile/kevinpowell.co
Codepen: https://codepen.io/kevinpowell/
Github: https://github.com/kevin-powell
---
And whatever you do, don't forget to keep on making your corner of the internet just a little bit more awesome!
Watch on YouTube ↗
(saves to browser)
Sign in to unlock AI tutor explanation · ⚡30
Playlist
Uploads from Kevin Powell · Kevin Powell · 0 of 60
← Previous
Next →
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
How to create an awesome navigation bar with HTML & CSS
Kevin Powell
Improve your CSS by Keepin' it DRY
Kevin Powell
HTML & CSS for Beginners Part 6: Images
Kevin Powell
HTML & CSS for Beginners Part 7: File Structure
Kevin Powell
HTML & CSS for Beginners Part 4: Bold and Italic text and HTML comments
Kevin Powell
HTML & CSS for Beginners Part 5: Links
Kevin Powell
HTML & CSS for Beginners Part 3: Paragraphs and Headings
Kevin Powell
HTML and CSS for Beginners Part 1: Introduction to HTML
Kevin Powell
HTML and CSS for Beginners Part 2: Building your first web page!
Kevin Powell
HTML & CSS for Beginner Part 8: Introduction to CSS
Kevin Powell
HTML & CSS for Beginners Part 9: External CSS
Kevin Powell
HTML & CSS for Beginners Part 10: Divs & Spans
Kevin Powell
HTML & CSS for Beginners Part 11: Classes & IDs
Kevin Powell
HTML & CSS for Beginners Part 12: The CSS Box Model - Margin, Borders & Padding explained
Kevin Powell
HTML & CSS for Beginners Part 13: Background Images
Kevin Powell
HTML & CSS for Beginners Part 14: Style Text with CSS
Kevin Powell
HTML & CSS for Beginners Part 15: How to style links
Kevin Powell
HTML & CSS for Beginners Part 16: CSS selectors and Specificity
Kevin Powell
HTML & CSS for Beginners Part 17: How to Create and Style HTML Lists
Kevin Powell
HTML & CSS for Beginners Part 18: How Floats and Clears work
Kevin Powell
HTML & CSS for Beginners Part 19: Colors with CSS - hex, rgba, and hsla
Kevin Powell
HTML & CSS for Beginners Part 20: How to center a div
Kevin Powell
HTML & CSS for Beginners Part 21: How to create a basic website layout - the HTML
Kevin Powell
HTML & CSS for Beginners Part 22: How to create a basic layout - the CSS
Kevin Powell
How to Create a Responsive Website from Scratch - Part 1: The HTML #Responsive #HTML5
Kevin Powell
How to Create a Responsive Website from Scratch - Part 2: The Header and Hero area #Responsive #CSS3
Kevin Powell
How to Create a Responsive Website from Scratch - Part 3: The About Section #Responsive #CSS
Kevin Powell
How to Create a Responsive Website from Scratch - Part 4: Building a Responsive Portfolio Section
Kevin Powell
How to Create a Responsive Website from Scratch - Part 5: Call To Action and Footer #CSS #Responsive
Kevin Powell
Tutorial: Learn how to use CSS Media Queries in less than 5 minutes
Kevin Powell
End of the year upate and what's coming to my channel to start the new year
Kevin Powell
Create a CSS only Mega Dropdown Menu
Kevin Powell
CSS Tutorial: Outline and Outline Offset
Kevin Powell
CSS Blending Modes
Kevin Powell
Parallax effect | 2 different ways to add it with jQuery
Kevin Powell
CSS Units: vh, vw, vmin, vmax #css #responsive #design
Kevin Powell
How to Create a Website - Complete workflow | Part 01: Intro + Setting things up
Kevin Powell
100 Subscribers speed coding bonus video
Kevin Powell
How to Create a Website - Complete workflow | Part 02: The Markup #HTML
Kevin Powell
How to Create a Website - Complete workflow | Part 03: Sass Variables and a Mixin #Sass
Kevin Powell
How to Create a Website - Complete workflow | Part 04: Setting up the hero and header
Kevin Powell
How to Create a Website - Complete workflow | Part 05: Typography & Buttons
Kevin Powell
How to Create a Website - Complete workflow | Part 06.1: Building the navigation with Flexbox
Kevin Powell
How to Create a Website - Complete workflow | Part 06.2: Making the nav work with jQuery
Kevin Powell
Redesigning & Coding My Website #CreateICG
Kevin Powell
How to Create a Website - Complete workflow | Part 07: Starting the flexbox grid
Kevin Powell
How to Create a Website - Complete workflow | Part 08: Promo & Problem shooting!
Kevin Powell
How to Create a Website - Complete workflow | Part 09: The CTA and Footer
Kevin Powell
How to Create a Website - Complete workflow | Part 10: Making it responsive
Kevin Powell
How to Create a Website - Complete workflow | Part 11: Making it responsive con't
Kevin Powell
How to Create a Website - Complete workflow | Part 12: Putting the site online
Kevin Powell
Create a Custom Grid System with CSS Calc() and Sass
Kevin Powell
CSS em and rem explained #CSS #responsive
Kevin Powell
Should you use Bootstrap?
Kevin Powell
How to add Smooth Scrolling to your one page website with jQuery
Kevin Powell
Let's learn Bootstrap 4
Kevin Powell
How I approach designing a website - my thought process
Kevin Powell
Build a website with Bootstrap 4 - Part 1: The setup
Kevin Powell
Build a website with Bootstrap 4 - Introduction
Kevin Powell
Build a website with Bootstrap 4 - Part 2: Customizing Variables
Kevin Powell
Related Reads
📰
📰
📰
📰
React Introduction
Dev.to · Karthick (k)
Why SnapDOM Beats html2canvas for DOM-to-Image Capture
Dev.to · Juan Martin
I built 42 landing page templates as single HTML files (no npm, no build step)
Dev.to · Segcam spa
Part 7B — Section 2 — React Event Handling Explained: Forms, Event Object & User Input.
Medium · JavaScript
🎓
Tutor Explanation
DeepCamp AI