How am I supposed to use index.html?

Question

Is index.html meant to be just the first page among many separate HTML pages, or is it supposed to be the only page, and the other pages are just snippets put inside of it? And by supposed to, I mean, what is the best/most common practice?

I used to think the former, but I just tried using HTML5-Boilerplate and it's setup seemed like it was implying the latter. All this awful meta stuff and imports (is there a term for that?) is in the index.html, and I don't want to have to put that in every single page. Same goes with the navigation bar and the footer which is on every page. And the project structure doesn't have an html folder (obviously I could make my own, but I took it as implying I didn't need one). It sounds ideal if instead of loading a different html page I just leave a placeholder and insert another file, but I don't know how to do that other than an iframe, which would be ugly. How would this approach work, if it is the right way?

If you couldn't tell I'm very much a beginner. I feel like this must be a common question but I don't know what the term(s) for this is, so I've been having trouble searching. Thank you

Answer 1

Many web servers will have a 'default document' that is returned when you specify just a path and no file name. So browsing to http://example.com will return the default document from the document root directory of that domain.

Quite often the default document can be named index.html, index.htm or -if PHP is installed- index.php, but they can be other names as well, depending on the configuration.

Some sites are built up from many actual html files, while other, more dynamic sites usually look like they consist of many html pages, but actually they just have a single entry page (like index.php) that handles all requests and generates output based on the url.

HTML5 Boilerplate (assuming you mean this one) describes a structure for a site. This structure is mostly the build-up of HTML, CSS and JavaScript. The index.html included with it is only a skeleton HTML file. It describes what your output should look like. How that output is generated is up to you. You can create a big folder full of separate HTML files, or a dynamic site with a single entry point, like described above. The HTML5 document, the CSS and all the other front-end stuff are interpreted by the browser, and it doesn't care how that content was generated.

Answer 2

Is index.html meant to be just the first page among many separate HTML pages, or is it supposed to be the only page... I mean, what is the best/most common practice?

index.html is best left as the "home page" or "landing page". When opening your site's root directory in a browser, index.html will be opened by default. If you have no index.html page, you will get a directory listing of all of your files on that server (live or localhost), acting just like a file explorer on your local machine.

All this awful meta stuff and imports (is there a term for that?) is in the index.html, and I don't want to have to put that in every single page. Same goes with the navigation bar and the footer which is on every page.

This doesn't have much to do with the index.html page. If you do not want to have all of your nav, header, footer, scripts, ect. repeated on every page, you will have to use PHP (specifically: includes). Otherwise, if you are using only HTML, you will have to repeat the same information on every page.

The rest of your question goes a little off topic, since explaining index.html does not really go into iframes or any of what you might put into a page.