Design issues – line break and overlapping

  • Unknown's avatar

    I’ve come across two issues because of the recent redesigns.

    The first one can be found in the black Adminbar when you hover over your Avatar. The popup menu shows some icons below the “Find Friends” link. (→ Screenshot)

    The second one is in the new stats screen. Because of the limited width the string “By posts and pages” breaks into a new line in German (I suppose this happens in a lot of languages). Looks really ugly.

    It’s another case of pixel-tight design where Automattic designer choose width, margins and paddings so that the original string barely fits on to the page and as soon as we translators start to localize the strings, the layout crumbles into pieces. (→ Screenshot)

    When will the design teams start taking into consideration that translated strings tend to be longer than english strings? Like the new buttons on top of the notifications screen (All, Unread, Comments, Follows, Likes). I’m betting we’ll run into problems there as soon as we start translating.

    Oh, and why the round buttons? I thought these would be so 2000? ;)

    Cheers
    Martin

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar

    Martin, I’m passing your comments on to the developers. Many, many thanks for your attention to detail and for taking the time to report them.

    Cheers

  • Unknown's avatar

    Martin, these issues have been reported and are in our trac system. The developers are working hard to get all the bugs and layout issues resolved as quickly as they can.

    Again, many thanks for taking the time to report them.

  • Unknown's avatar

    Thanks Richard for passing it on. :)

    I’m not sure if I should open up another new topic for this or if it is sufficient to mention it here, but can the developers maybe take a look at the admin bar in the forums?

    It seems the gravatar menu is wrongly positioned. (→ Screenshot)

  • Unknown's avatar

    I’ll pass that on, Martin. Thanks!

  • Unknown's avatar

    Hi Maureen & Richard,

    it seems the problems have been fixed.

    • The icons in the “Find Friends” entry are now correctly aligned to the right.
    • The “By posts and pages” problem has been solved with a drop down menu. Unfortunately the new strings “Comments by Authors” and “Comments By Posts & Pages” got very long again. I think it’s because the string repeats the word “Comments” although the drop down is already listed in the comments module.

      If I translate “Comments By Posts & Pages” to german it would be “Kommentare nach Beiträgen & Seiten” and it would get cut off again. How about using the strings “sorted by Authors” and “sorted by Posts & Pages” instead? Would still make sense and remove the redundant “Comments” from the drop down menu

    • The positioning in the admin bar of the forum has been fixed as well.
  • Unknown's avatar

    Ohh, and I haven’t heard about the round buttons in the new notifications screen. Is Automattic serious about bringing these round buttons back?

  • Unknown's avatar

    Unfortunately the new strings “Comments by Authors” and “Comments By Posts & Pages” got very long again. I think it’s because the string repeats the word “Comments” although the drop down is already listed in the comments module.

    If the literal translation is too long for the given space, you might try just using your best judgment to choose a translation that fits better.

    Let us know if that works out.

  • Unknown's avatar

    I’d have to translate the string very freely to avoid it being cut off. In my experience as translator and validator it’s not a good idea to translate to freely just to fit the layout. If the translation gets used in other places on WordPress.com it might not fit anymore.

    I’d still favor getting rid of the word “Comments” in the strings. Would you maybe discuss it with the team? After all it wasn’t necessary before the changes.

    How about my suggestion to use “sorted by Authors” and “sorted by Posts & Pages” instead? Even the old, plain “by Authors” and “by Posts & Pages” would work.

    In my opinion the word “Comments” is redundant and should be removed.

  • Unknown's avatar

    I’ve passed your concerns and ideas along and will let you know what I find out.

  • Unknown's avatar

    @iqatrophie: thank you for bringing translation/design issues to our attention!

    Jumping in to take a closer look as per @lizthefair’s request. The “Comments by Authors” feature you are referring to is quite new, still being iterated upon. I checked it just today and saw the two options as a dropdown: https://cloudup.com/cKGZBuoinJQ — I would think that this approach should work for all languages, how many characters do you need there for German?

  • Unknown's avatar

    Hi Jenia, :)

    let me recap. The “Comments by Authors” feature is new because I reported a line break problem at the start of the discussion. I also attached a screenshot to demonstrate the problem.

    The designers solved the problem very elegantly by using a drop down menu. Now there would be enough space to display the german translation of “By posts & pages” but what did they do? They added the word “Comments” to the string and as a result we’re facing the same problem we began with.

    All I’m saying is that the word “Comments” is redundant because the drop down menu is already listed inside the comments module. See the two left arrows on my new screenshot.

    I’d prefer the strings “sorted by Authors” and “sorted by Posts & Pages” or why not even using the old strings “by Authors” and “by Posts & Pages”? The translations for all of these strings would fit the stats screen. I’ve already checked.

  • Unknown's avatar

    Hey Martin. I’ve posted this for Jenia to get back to you. Sorry for the delay. :)

  • Unknown's avatar

    Hi again Martin! The underlying challenge is that German translations will as a rule be longer than the English source when conveying the same amount of information, and design can take that into account, but not completely eliminate that challenge. “Comments by Authors” and “Comments By Posts & Pages” are the subheadings preferred for English. It sounds like you can convey the same meaning by translating into German as “By Authors” and “By Posts & Pages”. I’d say go ahead with this decision, as the strings will be understood from the context as they are not used anywhere else.

  • Unknown's avatar

    Thank Jenia. :)

    I’d say go ahead with this decision, as the strings will be understood from the context as they are not used anywhere else.

    I’ll do that, then. :) Nevertheless I’m surprised that adding the word “Comments” is now the preferred subheading because as you can see from my first screenshot it wasn’t “preferred” in the first place.

  • The topic ‘Design issues – line break and overlapping’ is closed to new replies.