Text Annotation API

[androb]

As a developer, do you have requirements to annotate text in Gutenberg? If so, here is the place to comment.

What do I mean by annotations? Colored underlines or background highlights for indicating SEO, grammar, spelling, accessibility, and other issues.

[omarreiss]

We absolutely need something like this with Yoast. We're currently in the process of creating mockups for the usecases we started thinking of for Gutenberg in relation to SEO. We'll try to have the first ones ready next week and share them here in as far as they relate to annotating text (cc: @hedgefield). We also plan to free up resources to help contribute this kind of functionality/API to Gutenberg.

One thing I am already quite sure we'll need is a way to highlight text in the editor while maintaining focus and keeping the cursor in position. I believe we currently already mark text in tinyMCE with Yoast SEO by wrapping text in custom elements. Those are very easy to style too. However we don't maintain focus or the cursor position yet since we don't control the editor. This is better controlled at the editor level so I think it would be ideal for the editor to provide for this kind of functionality / API. @atimmer should be able to elaborate more on our approach and the alternatives we've considered. He'll also come available to work on this or at least propose an architecture / technical solution for this.

[hedgefield]

I did some explorations of what annotation highlighting could look like (click for full size).

Each concept has a sentence-level and a block-level visualization, but they don't have to be considered together per se. For example, I think the sentence-level in 3 could work well with the block-level in 2. Or 2 + 4. And there might be even more good options beyond these five, but for this first exploration I stuck with familiar concepts.

[omarreiss]

I think Jetpack's after the deadline module would also benefit from an API like this. See https://jetpack.com/support/spelling-and-grammar/.

Not sure who to mention here, maybe @georgestephanis, @dereksmart?

[georgestephanis]

It's been discussed, but yeah, Derek's probably the touch point for this.

[mtias]

Closing in favor of #3026 which has a bit more detail.