Feature Request: use WCAG compatible tags

[Harm-Nullix]

Description

One of our application is currently being assest to be WCAG 2.2 AA complient.
One of the main issues is that a lot of text is being set as <em> and <strong>, because users just use that to do whatever.

But for screenreaders, most of the times, em and strong gets speaking out EMPEZIEDS adn STRONG.
Normally, you would use <em> to surround one word, and <i> to surround a whole line of text.

How cool would it be to support that?
The combination of using <em> and <i> or at least pro-activly sharing the differences and how to implement it.

Use Case

At least add context in the docs for this feature, because I think it is not so hard to do and should be pointed out more to developers / users.

So when I type:

The fox jumps over the hedge.

It would be correct.

When I type

Footnote: a fox jumps over the hedge

Would also be correct.

In the end, IMO, it would be considered a good pratice to make <b> and <i> tags the standard.

I would love some feedfback on this idea

Type

New feature

[Harm-Nullix]

Anyone interessed in a quick fix for this would be:

import OldBold from '@tiptap/extension-bold'
const Bold = OldBold.extend({
  renderHTML({ HTMLAttributes }) {
    return ['b', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes), 0]  },
})
export {Bold}

import OldItalic from '@tiptap/extension-italic'
const Italic = OldItalic.extend({
  renderHTML({ HTMLAttributes }) {
    return ['i', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes), 0]
  },
})

Something like it to just get em and strong tags out of the way.

[Harm-Nullix]

I also came up with this idea, to not parse the content inside the mark, but afterwards on updating to the content db like:

const processContent = (htmlString) => {
  const parser = new DOMParser()
  const doc = parser.parseFromString(htmlString, 'text/html')
  
  // find all italic tags
  doc.querySelectorAll('i').forEach(el => {
    // text content has no spaces so replace with EM tag
    if (!el.textContent.trim().includes(' ')) {
      const em = document.createElement('em')
      em.innerHTML = el.innerHTML
      Array.from(el.attributes).forEach(attr => em.setAttribute(attr.name, attr.value))
      el.parentNode.replaceChild(em, el)
    }
  })
  
  return doc.body.innerHTML
}

[Harm-Nullix]

Extra Use Case

Using <em> and <strong>-Tags are great from a seo-perspective and for browsers, but when it comes to emails, tags like <em> and <strong> are not supported by a vast majority of clients. Therefore it would be great, if there would be an option to change it, when needed. Also in specific seo-cases it could also be useful to use <b> and <i>-Tags instead of the <em> and <strong>-Tags.

Originally posted by @YellowPhoenix18 in #7303