Currently, I am in the process of creating an HTML5 manual that will require numbering for various elements.
- The main headings should be numbered like "Section 4: Some Stuff"
- Subheadings will also need numbers such as "4.01: the first point you need to know about some stuff"
To add a further challenge, the manual will include tables and images that will also need to be numbered. For example,
"Fig 4.03 A cat. Most of the images on the internet are of cats."
In addition, there are numerous process lists within the manual that would benefit from numbering under the subheadings. For instance,
4.05 A simple process
4.05.01 Pull a leaf from the tree
4.05.02 Eat it
4.05.03 Now you are a caterpillar
4.05.04 Turn into a beautiful butterfly
I have been exploring different methods to achieve the desired numbering for headings, subheadings, figures, and lists but haven't found a satisfactory solution yet.
Potential solution 1: Utilize CSS counters
However, these may not transfer well to editing programs like Microsoft Word and might not function properly with screen-readers.
Potential solution 2: Implement ordered lists
But if all headings are part of an ordered list with the same 'heading' class, they may simply appear as plain lists without proper CSS styling.
If anyone has already tackled this issue or has a clever solution, I would greatly appreciate your input!
Extra credit goes to anyone who can suggest an efficient way to automatically update my figure cross-references!