What is the recommended way to organize source files in a static site generator for generating pages? (I'm using Eleventy, but this may be useful for other SSGs)
pages
├── page1
├── index.md
├── page2
├── index.md
or
pages
├── page1.md
├── page2.md
Both directory structures should (or can) generate the following structure in the final site:
pages
├── page1
├── index.html
├── page2
├── index.html
Either way works in Eleventy, so it’s entirely a question of which way you prefer, which works best for how you like to arrange files and directories, and so on (https://www.zachleat.com/web/introducing-eleventy/#directory-structure-flexibility).
In other SSGs — notably Gatsby, Gridsome, and Hugo — one factor to keep in mind is that images for which you want special processing are best located in the same directories as the Markdown or other content files which “call” them, as relative file paths are required by the appropriate plugins or pipes:
Gatsby: “If any of the [image] paths used do not resolve to a file[,] Gatsby will not create child nodes, instead leaving the [path] value as a string.” (https://www.orangejellyfish.com/blog/a-comprehensive-guide-to-images-in-gatsby/)
Gridsome — “Only local, relative image paths will be compressed by Gridsome.” (https://gridsome.org/docs/images/)
Hugo — “The image is a Page Resource, and the [image] processing methods listed below does not work [sic] on images inside your /static folder.” (https://gohugo.io/content-management/image-processing/)
This is not a consideration with Eleventy, however.