How do I create a subdirectory in html?

Question

For example, my website is mywebsite.com. On that site I have a page called "countries.html" with a list of countries on it. When a user clicks on the country (say Japan) it brings them to a page, "Japan.html".

I want that Japan page to be under the countries page: mywebsite.com/countries/Japan.html. How do I create that subdirectory in HTML?

Answer 1

You don't.

Assuming you are using static files, you create the directory on the file system of your webserver.

Then you use it in the path for the href attribute of the link.

<a href="countries/Japan.html">

Answer 2

Old question and already answered, I know, but I think there is a better way to do this (if going by the asker's current setup and intended result).

Create a folder named countries in your root directory and put all the country files there. You then move your countries.html file to the countries folder and change the name from countries.html to index.html.

So the new structure would look like this:

├── index.html
└── countries
    ├── index.html
    └── Japan.html

And you would link to the countries list page (your (formerly) countries.html file):

<a href="/countries/">Link to the countries folder index file</a>

^{No need to include the index.html in the href URL. When you link to a directory like this, it (by default) automatically looks for an index file and, if it exists, serves it.}

And then in the countries directory, your links to specific countries would look like this:

<a href="Japan.html">Link to Japan relative to current folder (NOT RECOMMENDED)</a>

<a href="/countries/Japan.html>Link to Japan relative to the document root (RECOMMENDED)</a>

Don't have any sources, but it just feels cleaner and makes more sense to have the countries list page appear as a directory rather than a file.

Which site structure looks better?

1. Countries list countries.html as a separate file
   • Page with the countries list - http://mywebsite.com/countries.html
   • Page about Japan - http://mywebsite.com/countries/Japan.html
2. Countries list as index.html file in the countries directory
   • Page with the countries list - http://mywebsite.com/countries/
   • Page about Japan - http://mywebsite.com/countries/Japan.html

Answer 3

For a basic website, with static HTML, your pages follow the file structure of your website.

Take the following file structure for example:

index.html
about.html
countries/
    Japan.html
    Norway.html

If you want to create a link to Japan.html from index.html, the link would have to be to mywebsite.com/countries/Japan.html.

Answer 4

The software you use to create your website should show you a list of files, and in that area there's usually the option to create a subdirectory. Do that, put your country files in the subdirectory, create the links as suggested by others, and you're done.

The file structure is separate from HTML and creating pages.