HTML & CSS for Beginners Part 7: File Structure

A quick look at how to organize the files of your website, and fixing any links that might break when you move things around.

This video is part of a large series introducing HTML & CSS to people who have never used it before. The goal of this series is to give you a good enough understanding of HTML and CSS to let you build your first website on your own!

----

[souj]

for all of my fellow odinites (The Odin Project) we are almost done with the HTML section and so close to our first project!!

[silentslayer]

I am about to start my very first project for the Odin project! Good luck everyone, I hope you stick with this.

[porobertdev]

Kevin, those series are awesome! Truly beginner-friendly.
Good luck to everyone who's here from The Odin Project :)

[josemanuelvialopez]

The odin project here - I was in javascript already but my progress suddenly dropped and was because they added this amazing information in the html and css subject.

[mariobarrosmbn]

Thanks to The Odin Project for bringing me up to Kevin's channel. Great content! Really anxious to start my 1st project! +1 sub

[YushinWE]

I come here from TOP and I love your great videos and I love your teaching!

[bejai]

I'm presently doing an HTML & CSS course. This information is helping with areas in the course I just couldn't understand. The course does not, for instance, teach me to create a root folder which is why I couldn't load my images. Being stuck on something that simple makes it very difficult to move on to the next subject with confidence.
I plan to watch all 23 parts of this series. I'm taking lots of notes and adding tons of comments to the pages to make sure I'm clear on every detail.
You are GREATLY appreciated and I plan to tell my friends to watch this series as well!!

[rw]

I'm on the Odin Project. This was a really helpful video for me thank you !

[BluDg]

just started the odin project here. love the ending soundtrack.

[villa]

I’ve recently watched a lot of videos that have taught me new things about HTML/CSS but I’m SO glad I found your channel today. Already you have gone in to depth about so many things that the other channels didn’t mention. So informative 👍🏽 thanks! Must watch all your videos now and pick up more tips that I’ve been missing.

[akilljoyproduction]

Just wanted to say thank you for the video. Was looking at website organization because I started using PHP for the repeated items and was unsure of creating sub folders for html but this solved it. Thank you!

[Silverflame]

"And my hamster doesn't live in this place anymore."
Fore some reason I love this sentence.

[EbukaFestus]

I love these explanations. Very well broken down. Great job sir, thanks.

[maurolimaok]

Not only lazy to type, but shorter names, shorter the possibility to mistaken this strokes.
I did like the idea

[maurolimaok]

The spaces on names also cause problems when we do things using terminal, 'cause terminal undertans spaces as a break to something new, a file, a command, etc.
Even if que do all the web stuff on VSCode or alike, someday we may need to use the terminal to SCALE a large number os directories, files, etc. so, if there were names with spaces, we're gonna be in serious troubles.

[julietamobi]

TOP.... Self learning going so well💃💃💃💃

[kevin.itruth]

Doing The Odin Project. They would like us to create a "pages/" directory to keep pages like "about.html" etc. seprate from "index.html" for better organization. To me it seems like an extra step, what is everyones thoughts on this? just curious.

[Amknowledge]

A Suggestion for you...
Hi kewin I had watched some of your videos, these are very helpful, i have a suggestion for you... Please make a video on css and html tree structure... Thanks

[mihirvphadnis]

Hey Kevin, thanks for awesome videos!
Just wanted to know will it be okay creating separate folders for HTML as well,
if I have dozens of html pages to manage 😕
in this case should I only leave my index.html in main folder and rest in subfolders?

[sebloo]

Hey, these videos are great! I am not sure why but after I made a separate file the only way I am able to get a photo show is by "copy as path". Also when I open up Atom it now shoes the picture in the folder saved as (ex hamster.jpg.jpg) when I remove the .jpg I added it shows up just hamster.jpg. I tried a few variations with img src but it seems only the copy as path works. Is there a solution for this or can I just use this moving forward? Thanks.