If you're new to creating, designing, and building websites, you're trying to understand what CSS is (i.e. Cascading Style Sheets) and why it's so important.

To begin, you'll need to think of the html of your website more as the framework, like the layout of a building. The html is the rooms, the hallway, the kitchen, the living room, etc. Every house has mostly the same types of rooms. Then you can add the CSS, which is like the color of the paint, the wallpaper, the furniture, and the other more visual parts of your webpages. When you create websites, it's very important to have these two things, your html information and your CSS information, separated into two different files.
At first it doesn't make sense to have a completely separate file for the html and the CSS. Because you'll always have to go back and forth between the CSS file and the html file. You'll have to upload the files to your website into two different places (if you're trying to stay organized). Why not just put the CSS rules into the html file, right?

I thought the same way until one day it hit me. I finally understood why it's good to have the html and CSS separated out. If you wanted to change how one aspect of your website looked but the CSS was inside the html file, instead of in a separate CSS file, then you'd have to go and change every single html file. That would be a mess.

You'd have to check every single page to make sure that the CSS looked right. Re-upload every page. Make sure you did the changes the same on every single page. Most websites aren't just five pages, either; there are hundreds or even thousands of pages for one website. Wow, that sounds like fun, right? No.
So the power of an external CSS file doesn't become evident until you want to change something on your website. For changing that one thing on your entire site, all you'd have to do is make the change to the CSS file, upload it, and you're done. You should check at least one page to make sure you changed it correctly, but that's not bad. After that, it would look the same on every other page because all the other pages look back at that one CSS file.

0 comments