The wordmarks can have different heights (18px and 22px are used currently). With the jawiki wordmark this issue is not as visible, but seems to still be there. It would also be good to check whether all the wordmarks have the same baseline – if not, then this will be problematic to fix.

I updated the description to describe the proposed solution

We need to consider other languages and custom wordmarks while discussing this. Currently arwiki, arzwiki, arwiki, bnwiki, arzwiki, cywiki, cawiki, jawiki, hewiki, mkwiki, srwiki, urwiki and some non-Wikipedia projects use custom wordmarks. Other Wikipedia projects use same wordmark that enwiki uses.

As it currently stands, wordmark ("WikipediA" in English) or trademark (W icon) are centered with tool name ("Translations", "Content Translation statistics", etc. in English). Because of that centering, and the fact that English wordmark doesn't have letters with descenders, it looks 2px off. Inspecting the element shows this centering:

In T184572#3888998, @Nikerabbit wrote:

It would also be good to check whether all the wordmarks have the same baseline – if not, then this will be problematic to fix.

I have explored how baseline alignment would affect the different projects and their wordmarks, compared to current state of centering the image and text. Project that don't define custom wordmark and use English version fallback would benefit from this. That includes enwiki, but I have also checked in German, Finnish and Farsi. All would benefit from baseline alignment.

Wikis that define custom wordmarks often use non-Latin letters that have descenders, which makes centering much more beneficial to those wikis. Although, some wikis that define custom wordmarks with letters without descenders, like atjwiki also benefit from baseline alignment.
Not sure if solving this per-project would be productive. Here is how centering vs baseline compares on some wikis with custom wordmark:

Wiki project	Centering (current state)	Baseline alignment (proposed state)
arwiki
atjwiki
bnwiki
cawiki
enwiki
hewiki
jawiki
srwiki
urwiki

Proposed solution, from the description of this ticket, would just not be generic enough to cover different fonts with different sizes and baselines.

When displaying trademark (W icon) with tool text (change made in T186871) using baseline instead of centering gives this:

Centered	Baseline

so that would need to be solved separately, although not a huge amount of work, it brings some level of increase in complexity.

In T184572#3988874, @Petar.petkovic wrote:

We need to consider other languages and custom wordmarks while discussing this.

Thanks for the analysis @Petar.petkovic. I agree we want to find a solution that works across languages, and it seems that it won't be an easy task.

For now I'd focus on solving the non-controversial part of the ticket: increase the separation between the wordmark and the page title to be 8px.

Regarding the vertical alignment, the reading team did some customisations on those wikis where the wormark had descenders. For example, the mobile version of Catalan Wikipedia has the following CSS rule to move the Wordmark one pixel down:

.branding-box span {
    margin-top: 1px;
}

If we can find an approach that can reuse such customisations without having to do our own I'd go that way. If it is not possible or it is too complex, I'd postpone the work on this ticket and involve the Reading team to find a more general solution.

Change 413192 had a related patch set uploaded (by Petar.petkovic; owner: Petar.petkovic):
[mediawiki/extensions/ContentTranslation@master] Increase trademark text margin

https://gerrit.wikimedia.org/r/413192

For now I'd focus on solving the non-controversial part of the ticket: increase the separation between the wordmark and the page title to be 8px.

I have submitted patch for "non-controversial" part.

Regarding the vertical alignment, the reading team did some customisations on those wikis where the wormark had descenders. For example, the mobile version of Catalan Wikipedia has the following CSS rule to move the Wordmark one pixel down:

.branding-box span {
    margin-top: 1px;
}

If we can find an approach that can reuse such customisations without having to do our own I'd go that way. If it is not possible or it is too complex, I'd postpone the work on this ticket and involve the Reading team to find a more general solution.

Not sure if Reading team was behind the customization, but it's coming from this file. That file, and wordmarks are applied only on mobile versions of the site. We don't have mobile-specific skin, but rather we use responsive approach for mobile screens.
I don't see such customizations on other wikis where the wordmark has descenders.

Even if we could reuse that piece of CSS, that would be per-project approach that has high maintenance cost, but could be feasible if Reading team does that maintenance anyway.

I'll try to come up with a way to achieve this without high maintenance costs, but not actively working on it. I'd postpone that part and maybe involve the Reading team.

Change 413192 merged by jenkins-bot:
[mediawiki/extensions/ContentTranslation@master] Increase trademark text margin

https://gerrit.wikimedia.org/r/413192

Checked in cx-testing - the change (for the margin is in place) and everything else seems unaffected.

@Petar.petkovic - thank you for the table with examples.

Moved the task to *Continued/Moved to future*.

SG9tZVBoYWJyaWNhdG9yCk5vIG1lc3NhZ2VzLiBObyBub3RpZmljYXRpb25zLgoKICAgIFNlYXJjaAoKQ3JlYXRlIFRhc2sKTWFuaXBoZXN0ClQxOTcyODEKRml4IGZhaWxpbmcgd2VicmVxdWVzdCBob3VycyAodXBsb2FkIGFuZCB0ZXh0IDIwMTgtMDYtMTQtMTEpCk9wZW4sIE5lZWRzIFRyaWFnZVB1YmxpYwoKICAgIEVkaXQgVGFzawogICAgRWRpdCBSZWxhdGVkIFRhc2tzLi4uCiAgICBFZGl0IFJlbGF0ZWQgT2JqZWN0cy4uLgogICAgUHJvdGVjdCBhcyBzZWN1cml0eSBpc3N1ZQoKICAgIE11dGUgTm90aWZpY2F0aW9ucwogICAgQXdhcmQgVG9rZW4KICAgIEZsYWcgRm9yIExhdGVyCgpFVzZSC3IERpc2NsYWltZXIgtyBDQy1CWS1TQSC3IEdQTApZb3VyIGJyb3dzZXIgdGltZXpvbmUgc2V0dGluZyBkaWZmZXJzIGZyb20gdGhlIHRpbWV6b25lIHNldHRpbmcgaW4geW91ciBwcm9maWxlLCBjbGljayB0byByZWNvbmNpbGUu

In some cases, baseline of wordmark may be upper that a baseline of header text.
Currently, for hebrew:

In my opinion, no a good universal solution for this problem. Initial idea (graphic wordmark with text in a single line) is wrong.

See also T207269