Download free assets:
HTML & CSS for Absolute Beginners
Welcome to this exciting journey into the world of web development! This comprehensive tutorial is designed especially for those who are new to the world of coding. Here, we’ll embark on a fun and interactive learning experience, diving into the basics of HTML and CSS. Whether you’re a hobbyist, aspiring developer, or just curious about how websites are built, this lesson is the perfect starting point.
What We’ll Cover
Understanding the Basics: We’ll kick off by understanding what coding is all about. We’ll answer questions like, “What is a code editor?” and “Why is it important in web development?”
Setting Up Your Workspace: Next, I’ll guide you through the process of downloading and setting up Visual Studio Code (VS Code). This popular, user-friendly code editor is a favorite among professionals and beginners alike.
HTML – The Skeleton of a Website: Here, we’ll dive into the world of HTML. You’ll learn about its role in website structure, its syntax, and how to write your first lines of code. We’ll cover everything from tags to elements, ensuring you have a strong foundation.
CSS – Bringing Style to HTML: After mastering HTML, we’ll explore CSS. This is where you’ll learn how to bring your website to life with colors, fonts, and layouts. We’ll discuss CSS syntax and how it interacts with HTML to create visually appealing websites.
Hands-On Project: The best way to learn is by doing. That’s why we’ll build a website together from scratch. This project will not only reinforce your learning but also give you a taste of real-world web development.
Modern Aesthetics and Design Principles: As we build our website, we’ll also delve into essential design principles. You’ll learn how to create a site that’s not only functional but also aesthetically pleasing and user-friendly.
Exclusive Free Resources Just for You: To make your learning experience even more exciting, I’ve created custom graphics using Adobe Illustrator and Adobe Photoshop. These are available for you to download and use in your projects for free! This is a great opportunity to learn how graphics and code come together to create stunning websites.
Final Project Showcase: By the end of this tutorial, you’ll have your very own website—a testament to your new skills and creativity. We’ll discuss how to showcase your project and use it as a stepping stone in your web development journey.
00:00 Intro
01:11 Download VS Code
04:49 html Introduction
11:12 Titles & Paragraphs
19:06 Errors & html Entities
21:33 Live Server
23:10 Create & Link css
26:59 Fonts, Divs, Specificity
43:22 Box Model
48:19 Text Elements
55:22 css Classes
1:13:34 Display Grid
1:16:39 Display Flex Properties
1:31:50 Object Fit & Position
1:39:40 Horizontal Scrolling
1:43:24 Position Relative/Absolute & Hover Info
2:17:33 Extra Homework &Outro
Facebook: https://www.facebook.com/codingwiththanos/
#2024 #html #css
