Making WordPress.org

Opened 2 years ago

Closed 2 years ago

#6572 closed defect (bug) (fixed)

Exchange the diff colors in the suggestions from Translation Memory

Reported by: amieiro's profile Amieiro Owned by: amieiro's profile Amieiro
Milestone: Priority: normal
Component: Translate Site & Plugins Keywords:
Cc:

Description

When a user is translating a string and gets feedback from the Translation Memory, the suggestions from translation memory have exchanged the added and delete substrings.
If you review the HTML code in the screenshot, the <del> and <ins> have been exchanged.

Attachments (4)

diff-01.jpg (174.4 KB) - added by Amieiro 2 years ago.
HTML code where you can see that the <del> and <ins> tags have been exchanged.
diff-02.jpg (482.3 KB) - added by Amieiro 2 years ago.
Diff with the patch applied.
line-through.jpg (455.3 KB) - added by Amieiro 2 years ago.
strikethrough
translate-del-ins.jpg (201.3 KB) - added by Amieiro 2 years ago.
<del> and <ins> tags

Download all attachments as: .zip

Change History (18)

@Amieiro
2 years ago

HTML code where you can see that the <del> and <ins> tags have been exchanged.

#1 @vladytimy
2 years ago

I wonder if this was done on purpose because it does make sense if you think it like this: This translation memory suggestion's original doesn't have distraction (red/<del>) but has disrtaction (green/<ins>) compared to the current original.

I agree it's a bit reversed logic but once you get used to it it makes sense.

The question here is what do you compare

  • current original vs this previous original
  • this previous original vs current original

I think this needs the community input to see how the majority feels about this.

Last edited 2 years ago by vladytimy (previous) (diff)

#2 @vladytimy
2 years ago

I see this was changed in changeset 12229. Let's see if there's any feedback in the coming period from translators.

#3 @Amieiro
2 years ago

Hi @vladytimy

I understand your point of view. For me, it is much clearer to have in green what has been added in the current original from what we have in the translation memory. And, of course, in red what has been removed. I like to consider:

  • Old: the string we have in the translation memory.
  • New: the current original string.

So what I have deployed is the diff between one string we have in the translation memory, as old string, and the string we have as current original string, as new string.

I am not going to close this ticket until we talk the 2 different approaches with the community in the next Polyglots meeting, so, as usual, I am open to revert this commit.

@Amieiro
2 years ago

Diff with the patch applied.

#4 @pedromendonca
2 years ago

Wow! This has been messing with my brain since ever, I thought it was by design as @vladytimy says, but it really makes much more sense as it is now.
Thank you @Amieiro!

#5 @Nao
2 years ago

The updated version (patch) makes a lot more sense to me too!

This ticket was mentioned in Slack in #polyglots by amieiro. View the logs.


2 years ago

#7 @tobifjellner
2 years ago

Yeah. Much better now, after this update. I always had to think twice before.
(Only related question would be to get feedback from someone with red-green color blindness if these two colors differ enough between themselves to be understood, after all that is the most common type of color blindness.)

#8 @LidiaLAB
2 years ago

It makes sense to me too.
But I don't know if red and green mean the same all over the world, probably yes.

But thinking about what Tobi said, maybe we could also add the strikethrough for the removed text, it will be a little harder to read, but the meaning will be clear at a glance and regardless of the colors chosen.

But I'm not a UXer :)

@Amieiro
2 years ago

strikethrough

#9 @Amieiro
2 years ago

I think adding a strike-through to the removed text is a good option, for people without any visual problem and for people with color blindness, as you can see in the previous image. What do you think?

#10 follow-up: @LidiaLAB
2 years ago

Thanks for showing it visually @Amieiro!
I still think it works.

Is it planned to use semantic tags or ARIA attributes suitable for screen readers?
I'm reading it is not so easy to find a solution for this, but I'm new in learning about A11y stuff.

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/del
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/s

#11 @vladytimy
2 years ago

The strike-through makes it even more accessible! Looks great! Thanks for experimenting with this.

@Amieiro
2 years ago

<del> and <ins> tags

#12 in reply to: ↑ 10 @Amieiro
2 years ago

Replying to LidiaLAB:

Thanks for showing it visually @Amieiro!
I still think it works.

Is it planned to use semantic tags or ARIA attributes suitable for screen readers?
I'm reading it is not so easy to find a solution for this, but I'm new in learning about A11y stuff.

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/del
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/s

@LidiaLAB yes, we currently are using the <del> and <ins> tags. You can see it here.

#13 @Amieiro
2 years ago

I have analized the color blindness and the contrast in a P2: Color blindness in the diffs from the translation memory

#14 @Amieiro
2 years ago

  • Resolution set to fixed
  • Status changed from assigned to closed

Updated in this commit.

Note: See TracTickets for help on using tickets.