Note: This document is a work in progress. You can help improve it.
Web Development Fundamentals
HTML is the most basic structure of a webpage. All other languages, frameworks, etc. that are on the web form themselves around the foundation that is HTML.
It's primary purpose is to put text, pictures, and links onto a website. If you're only doing that, it will remain pretty simple. As you begin learning more of the tools it has to offer though, you will realize that it can do quite a bit more. With a Macbook, a little practice, and some patience, HTML can help us send information across the Internet to another website or computer, embed an entire other webpage into the one we're building, or even make text move horizontally across the screen at our desired pace. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/marquee
HTML is an integral part of any website. Despite it's importance, without the help of it's two best buds in the whole world it's still pretty simple.
CSS is what allows us to make a webpage look the way we want it to.
By linking your HTML page up with a set of CSS rules, you can make your website conform to a more visually appealing standard than black text on white background. You can create large sweeping rules, like making all of the text bright shiny blue and the background a daring shade of magenta, or you can be more surgical and tell every element on the page specifically where to be and how to look.
Often we will use a hybrid approach, telling this section to look like this and this other section over here to have brighter text and a shadowy backdrop.
Oh, the user!
Why not just one?
Well, as you begin to work on bigger, cooler apps, you'll come to realize that things can get messy fast. Without separating the responsibilities out into different and distinct places, you will end up with a massive behemoth of a (java)Script that no one, not even you, will ever want to work on. It's a bit like asking why we don't put all of our clothes into one big drawer instead of having separate ones for socks and shorts.
Do you really want to dig through all of it anytime you need anything? For the very same reasons, I'd rather go to the CSS file if I want to make a style change.