One option is to use a bulleted list:
- assets/
- css/
- styles.css
- img/
- me.png
- js/
- scripts.js
- css/
- pages/
- about/
- index.html
- contact/
- index.html
- about/
- index.html
While it takes more space to display than a traditional output from a command like tree
, it has the benefit of not using a code block to present visual information.
This allows you screen readers to have some hope of parsing the information. It also makes it easier for you to add custom formatting. Also you can add some custom formatting easily enough.
For instance, I've called out a particular file, so everyone know which index.html the rest of my pretend comment is about.
Not that it's hard to create such a list by hand, but I have this little Python snippet floating around that I use for such lists for Stack Overflow and other Markdown uses:
import os
def show_dir(dn, level=0):
files = []
for cur in sorted(os.listdir(dn)):
if os.path.isdir(os.path.join(dn, cur)):
print(" " * (level * 4) + "* " + cur + "/")
show_dir(os.path.join(dn, cur), level + 1)
else:
files.append(" " * (level * 4) + "* " + cur)
for file in files:
print(file)
show_dir(".")