Understanding HTML and CSS: The First 3.5 Hours

Full 14-hour course: www.udemy.com/course/understa...
HTML Specification: html.spec.whatwg.org
0:00 About This Video
1:22 Introduction and What You Will Learn
4:23 Tools and Setup
5:19 Section: Trees
5:33 Conceptual Aside: Data Structures
9:16 The Language of Trees
11:38 Not Really a Tree
13:08 Traversal and Search
14:54 Section: HTML
15:49 A Document
18:12 Conceptual Aside: User Agents
21:59 Markup: Describing Content
25:23 Language: Consistent Meaning
27:33 Conceptual Aside: Semantics and Authoring
29:24 Tags, Attributes, and Elements
31:34 Elements and Trees
34:05 Markup Is Everywhere
36:41 Conceptual Aside: Specifications
38:11 The HTML Specification
45:27 Conceptual Aside: Author vs Implementor
47:31 Content Models and Kinds of Content
50:15 Section: A Document
50:28 A Starting Point
51:17 Document Types
52:40 The Root
55:33 Metadata
59:26 Content
1:01:13 Section: Document Sections
1:01:25 The Outline
1:05:45 Self-Contained Compositions
1:11:46 Thematic Groupings
1:17:51 Tangential Content
1:21:58 Headings and Rank
1:27:17 Headers and Footers
1:30:50 Addresses
1:33:56 Section: Grouping Things
1:34:09 Paragraphs
1:36:27 Did You Catch The Invalid Markup?
1:37:15 Quotes
1:39:31 Unordered Lists
1:42:18 Ordered Lists
1:44:17 Association Lists
1:51:46 Multidimensional Content
2:01:59 Multidimensional Content and Doing It Wrong
2:07:10 Dominant Content
2:09:42 div and Doing It Wrong
2:18:24 Section: Text Itself
2:18:52 Emphasis
2:26:38 Importance
2:29:38 Side Comments
2:31:41 Have You Found The Invalid Markup?
2:32:44 Line Breaks
2:38:20 Author's Comments
2:40:28 span and Doing It Wrong
2:43:37 Section: The Browser and the DOM
2:44:10 Conceptual Aside: HTTP
2:52:30 Anchor Tags and Hypertext
2:57:46 Conceptual Aside: User Agents (again)
2:59:21 Conceptual Aside: The Browser
3:01:37 Blink: A Rendering Engine
3:04:05 Engine Aside: Parsing
3:06:15 Named Character References
3:10:33 Conceptual Aside: Objects
3:11:57 Conceptual Aside: Models
3:14:42 The Document Object Model
3:17:17 Building the DOM
3:25:16 Conceptual Aside: Developer Tools
3:27:09 The Inspector
3:35:42 Get The Full Course

[@demo199]

3 year's ago because of your javascript course i got my first job as a javascript developer and today laying on my bed due to sickness and saw this KZbin notification made me so happy. thank you tony for all the efforts.

[@xabro998]

Only if I knew few more Tony, my life would have been so much easier. I don't know how u do it Tony, but u are the best teacher in all genres that exist.

[@yinonelbaz5309]

conceptual aside: Anthony Alicia is the best teacher by far, that exists in the world of development and in general

[@slappy_chimp]

agreed I am following lots of dev channels, and have lots of courses too, but none of them stand close to this dude..

[@jj53368]

I smiled at 6:18 because it's been YEARS since I've heard "big word alert". The last time I heard it, I was still an aspiring engineer working in customer support at a startup. Now, I'm a mid-level engineer, looking to sharpen his frontend skills. This course comes at a perfect time for me as I'm trying to get to the next level: from "writing code that works at all costs" to writing functional, well thought-out code that aligns with best practices and that I actually understand fully (no more copy/pasta). Thanks Tony.

[@TonyAlicea]

An awesome story, Juan thanks so much! I’m honored to continue to be a part of your journey.

[@shu9460]

I bought the course as an experienced dev to get an UNDERSTANDING of why things work. Truly UNDERSTANDING why something works in web dev has been the biggest red-pill I've taken that's helped me level up as a developer faster than just doing code-alongs.

[@hali1989]

Bought your full courae without even looking. Your Js course is one of the best, and im sure that this one is with the same quality.

[@codenameunknown3791]

Tony, honestly, you are The best. Never stop making tutorials, please.

[@foobars3816]

I already know most of the things described in the intro... however when it's a Tony Alicea course I have a feeling by the end I'll realise I was blind and now I can see.

[@ricardo5460]

You are an amazing educator, Tony. I am so glad I finally came across a course where they actually EXPLAIN programming from the bottom up instead of just asking to memorize terms and concepts. Thanks!!

[@luismatos684]

You are a great educator. If i had more instructors who would care about concepts first, defining and putting words into their proper context and the importance of gradient learning, who knows where would I be today. Unfortunately today more words are taken out of context and gaps in concepts are destroying our ability to reason. We need teachers like you that would teach instructors how to teach. You are ahead of your time.

[@ItsShhh]

Tell you what... I will watch and study EVERYTHING you're saying in this tutorial. it's 1:30am and I heard your comment on "maybe you've already been using html..." and that is totally me. I've been using CSS/HTML for years and never really defined it. I've just reversed it and figured it out. But now that I am back in the job market, I am realizing that I don't know to to talk to it. I am going to give it a shot. I am just a high-tech marketer who (10 years ago) worked on publishing pages for a complex telecom wireless carrier. I never knew this publishing would eventually become an "author" and knowing HTML/CSS is essential when working with non-marketing developers (seriously boring developers with no personality, but who can troubleshoot the back end of a web site like no other). Thanks for making this available in your moderate easy-to-understand teaching style.

[@siyaram2855]

Please make a course on Database 🙏🙏🙏🙏

[@MrJonnis13]

Thank you Tony. We are still waiting for the DB course....

[@skube]

This is a completely underrated course by one of the best teachers out there. I'm shocked there aren't more views and 👍! Should definitely be watched by ALL web developers (novice and experienced alike).

[@TonyAlicea]

Thanks! A lot of web devs think they already know HTML and CSS well even though they really don’t!

[@exe.m1dn1ght]

God bless your kind heart Tony, you put knowledge in my mind !

[@jowls]

Omg, this is what I've waiting for, thanks Tony! Da best!

[@johncarlopinlac2411]

Thank you for this and I can truly say it's insanely good! I just realized that plenty of so called developer youtubers/influencers teach crap quality html and css code.

[@TonyAlicea]

Thanks John! Unfortunately yes I hear from a lot of students that the poor markup and CSS habits they have were taught to them. I hope this course helps folks see how much better things can be!

[@johncarlopinlac2411]

@@TonyAlicea Well... It does sure flood divs from other instructors' courses/tutorials.🤷‍♂️

[@Reacher6207]

Legend is back 🙌

[@Rajuthinnaluri]

You the best guru in the world.... 👌👌

[@siyaram2855]

Legend is Back.

[@hsngytf4992]

Finally, thanks man!

[@sanjibmondal9107]

Thank you GURU. Your javascript tutorial force me to love JS and I'm sure this tutorial will also force me to love html and css.

[@srirupchatterjee1399]

Can u pls help me with the exercise 🥲

[@amospetit2535]

honestly, you are The best

[@bosuaandcarot]

you are the best teacher in the world!

[@sumanthprabhu11]

THE Ninja IS BACK

[@foobars3816]

I wish you would do a video on your "Simple Is Not the Opposite of Complex" article. It's a lesson that would change the world, however so few people will read an article if you send it to them. A video on the other hand...

[@TonyAlicea]

Nice to hear someone remembers those blog posts!

[@foobars3816]

@@TonyAlicea every second I'm designing or making something. Unfortunately I'm not the brilliant teacher you are, so getting others to see this issue has been impossible for me.

[@user-mo3cw6go7c]

I found this article on medium and i gonna read it asap

[@benwyse]

Thank you Tony! I thought I knew HTML. I actually didn't know much until now. Wow!!!! I am jumping to the CSS part next.

[@TonyAlicea]

Great, welcome to the course!

[@Motivation_into_coding]

Brother man u saved me a lot about understanding HTML, thanks man for yr clear explanation.

[@TonyAlicea]

So glad it helped!

[@parthkumarchaudhary]

Finally. Thanks for the informative content. And Now what's the next?

[@djimi9803]

Finally 💥💯🔥

[@mahdisalmanizadegan5595]

@Tony Alicea i buyed this amazing course, you bring a lot of value and information to your audience, do you have any plan to create some backend course using NodeJS or modern technologies ?

[@zac1976]

Ty, Teacher😚

[@k4qdex]

holy shit it's out!

[@joemn9114]

Tony Please create a course for data structures and algorithms.

[@pawe896]

Super !

[@cagataysafak8619]

What you have done so far is totally awesome. If you make a course for React.JS in the future, then it would be even better. Pls consider.

[@TonyAlicea]

Thanks Cagatay, a lot of people have asked for a React course!

[@yuriymiroshnychenko5446]

Glad to see you back! Your JS course is still the best!

[@slappy_chimp]

Tony I just love your courses, I took the JS and the NodeJs course, those were eye openers. although I have been developing for the web for 3 years now i didn't hesitate to buy your HTML and CSS course, done the HTML part and boy I feel bad for how I have abused HTML XD well there be a react course.. idk how you start this thinking process of understanding, for your courses you have done all the digging, i am wondering on how may I follow this philosophy when learning something new :)

[@TonyAlicea]

Try to get under the hood of whatever you’re learning. If there’s a spec, read it. Find blog posts by the people who create it. Read the source code if available.

[@slappy_chimp]

@@TonyAlicea you encouraged me to start reading source code in your JD course it was less scary after that :D will do this for react and see thanks a million

[@htetlynnhtun101]

Big Words Alert!

[@orbry]

An excellent dive into fundamentals, keeping the quality bar high as always! Tony is there any alternative way to purchase full course? Unfortunately Udemy does not accept payments from Russia at the moment :(

[@TonyAlicea]

Unfortunately the course is exclusive to Udemy, as it is part of Udemy Business.

[@orbry]

@@TonyAlicea I see, well, then no choice but to wait till Udemy accepts payments again

[@khinjerman]

love the series "dont imitate , understand " of javascript/node.js/html&css , any plans for React ?

[@TonyAlicea]

Not yet, but lots of folks have asked!

[@khinjerman]

@@TonyAlicea we can't wait :D

[@thebattinson1278]

@@TonyAlicea Would be AWESOME !

[@youmnaification]

That's my moto. I literally printed it and posted it on my white board at work. Ironically few people didn't get it.

[@sulaimansaker1325]

🔥🔥🔥🔥🔥

[@wealtylife5518]

Thank you very much!

[@TonyAlicea]

You’re welcome!

[@nelvinroymagallanesalidon5010]

unfortunately, I can't afford the entire course. but, I enjoyed the lesson and learned from it. so, thank you for that sir.

[@TonyAlicea]

The 'runThis' function is defined. It runs whatever function you pass to it. In the next two lines the 'runThis' function is called, in each case a different function (using arrow function syntax) is passed to it. The results will be that the two functions passed to 'runThis' will each be executed.

[@myfreetimeaccount9450]

Please make a new Understanding Angular course, the other one is way outdated and your way of explaining things has always sticked with me. I'd buy it in a second.

[@yinonelbaz5309]

Can't figure out how there aren't over a million likes here

[@mercurian9782]

WoW

[@shawnelswick5715]

Hi Tony, I bought your Javascript course a long time ago when it was featured on Simple Programmer by Jon Sonmez. Is there a way I can get the updated course like what is on Udemy dated 10/2021? I couldnt find another way of contacting you, sorry about doing it here.....

[@TonyAlicea]

Hi Shawn. Do you have another account somewhere where I could DM you? Like twitter or linkedin?

[@shawnelswick5715]

@@TonyAlicea I am on Linkedin as well, same name, shows as developer at SAIC

[@user-mo3cw6go7c]

They have not yet created the emoji that will help me express what I am feeling right now So I will not even try and will be satisfied only with thanks!

[@Martin958]

All that is missing now is a course on MongoDB and perhaps Express to go with it.

[@user-mo3cw6go7c]

Its part of the curs on nodejs

[@madisonharvey762]

nice

[@mohamedhussien7323]

hello mr can you give me the udemy course because i am not understand the fcm i hope give me the course thank you

[@andrewdalton6973]

You should make a video on React JS

[@TonyAlicea]

Many have asked that! I’m focused on fundamentals courses right now.

[@andrewdalton6973]

@@TonyAliceaok, np

[@andrewdalton6973]

Your courses are good dude

[@yinonelbaz5309]

So far this is the icing on the cake when it comes to the main theme of the course - kzbin.info/www/bejne/hZvFfmprbNhmrLc

[@cityonthemoon36]

Can you make a React course, please I buy your courses without even reading the reviews

[@revisionnaire]

he has now. check other videos or his website

[@sh4kirrr448]

Could you please update your js course or maybe just release short vids on iterators, iterable, array like objects and things like that please?

[@TonyAlicea]

I currently have in production a new sequel course on ES6/ES.Next where we will cover those things. Keep an eye out for an early-release announcement in the next few months.

[@sh4kirrr448]

@@TonyAlicea WOW, you got me excited! Thanks =D

[@3RowbK8We89IQz6-YiVHag]

Welkom

[@dailycookie-cutter2500]

interesting

[@srirupchatterjee1399]

Can anyone help me with the coding exercise 1 of this course! 🥲 Trying my best yet I can't solve and there is no way to find how much is correct of the code,, confusing exercise 🥲 pls help 😭

[@nandithagowda7936]

Exercise 1: Thinking semantically??