Answer 1

https://code.sololearn.com/W3HjloEYjDrF/?ref=app

Answer 2

You may find answer in https://codepen.io/AliKlein/pen/epMaLM, wherin interalia, how to do with html, also has been elucidated.

Answer 3

Yes, It can be animated
eg,
Let, You made a dragon using path.
in animatin : it will show how you drew it.
here you go for awesomeness:
https://css-tricks.com/svg-path-syntax-illustrated-guide/
https://css-tricks.com/svg-line-animation-works/

Answer 4

285 is path length, i got it by a stupid but effective method : trial and error

Answer 5

EX:-
https://code.sololearn.com/W0txWg4obC59/?ref=app
this code help to animate svg

Answer 6

strokedashoffset

Answer 7

stroke-dasharray is, instead of whole path being solid, it becomes dashed according to your array.
stroke-dashoffset is to adjust the beginning of the dashes.
This is copied from Mozilla Doc:
https://code.sololearn.com/WtrhY7A9p9LJ/?ref=app
https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-dashoffset