Use this directory structure for simple single-page websites.
```
.
+-- assets/
+-- styles/
+-- styles.css
+-- scripts/
+-- main.js
+-- index.html
```
For a multi-page app, add a `pages` directory.
```
.
+-- assets/
+-- styles/
+-- styles.css
+-- scripts/
+-- main.js
+-- pages/
+-- about.html
+-- index.html
```
Note that `index.html` remains in the root directory. The browser will look for `index.html` in the root so it knows what to load first.
Some developers use slightly different names for the directories, for example `images` instead of `assets`, `css` instead of `styles`, and `js` instead of `scripts`.
Use `slug-case` for naming directories and files, all lowercase (it's just easier to type and easier on the eyes). Never include spaces in file names. Underscores can be mis-interpreted by some browsers, so use hyphens instead.
> [!tip]- Additional Resources
> [MDN Web Docs Guides > Dealing with files](https://developer.mozilla.org/en-US/docs/Learn/Getting_started_with_the_web/Dealing_with_files)