Create a new config variable, $wgLinkFragmentFlavor, which can be "legacy" or "html5". Make it control the encoding of all internal links to pages with fragments. If it's set to "legacy" have it encode the fragments using the current "dot-encoding" scheme. If it's set to "html5" have it use standard percent-encoding for the fragment. This config variable should only affect links/fragments, not section IDs (which will be handled by another config variable).
(Note that at some point later we may want to experiment with preserving more raw characters (per T152540#2995045) for the html5 option, but we don't know currently how good the browser support for that is.)