Understanding how yaml works using includes

I am getting deeper involved in doing more templating, automations, lovelace in yaml mode and each time I hit stumbling blocks as Home Assistant handles yaml code differently depending on where you are.
For example, you have the ui editor and the raw editor in lovelace and the code you enter is different depending on whether you enter it in the code editor or in the raw editor. The same is true with the automation editor or if you use a file editor. I’m sure there is a reason why, but for novice users learning home assistant, it makes it very difficult to try and figure out how the code should be formatted.
My biggest difficulty has to do with how the !include works.
The different ways to use it are ( as far as I have found) are defined in the doc file

https://www.home-assistant.io/docs/configuration/splitting_configuration/#debugging-multiple-configuration-files
  1. !include_dir_list
  2. !include_dir_named
  3. !include_dir_merge_list
  4. !include_dir_merge_named
    I want to split my configuration.yaml in a orderly fashion. I am trying to take my working configuration yaml and move portions to different files and different directories. Which of these options would let me use files creating from my existing configuration.yaml file and load the created files using the identical formatted code that I presently have?