#6111 closed change (fixed)

Fix overflowing text on adblockplus.org/nl/features

Reported by: trev Assignee: ire
Priority: P3 Milestone:
Module: Websites Keywords: goodfirstbug, content
Cc: julian, saroyanm, ire, jeen, wspee Blocked By:
Blocking: Platform: Unknown / Cross platform
Ready: yes Confidential: no
Tester: Unknown Verified working: no
Review URL(s):

https://codereview.adblockplus.org/29657623/

Description (last modified by ire)

Environment

Any browser

How to reproduce

  1. Go to the Adblock Plus Features page under a language with long words, e.g. https://adblockplus.org/nl/features
  2. See the text the features boxes

Observed behaviour

See that the text overflow's it's box where the words are particularly long

Expected behaviour

For languages with longer words, add auto-hyphenation (hyphens: auto) to this and any other small containers (Boxes with width below 120px)

Attachments (1)

Screen Shot 2017-12-06 at 10.45.31 am.png (87.9 KB) - added by ire 11 months ago.
Auto-hyphenation in English

Download all attachments as: .zip

Change History (13)

comment:1 Changed 11 months ago by juliandoucette

  • Cc ire jeen wspee added
  • Description modified (diff)
  • Keywords goodfirstbug content added
  • Priority changed from Unknown to P2

Agreed. The example is clear. But it's unclear what else this should apply to e.g. all not~100% width components/widgets?

@Jeen, @wspee what do you think?

comment:2 Changed 11 months ago by trev

Is there any reason it shouldn't apply to all content? The main text would definitely look better with hyphenation as well. Is there a readability impact? Or are you concerned about hyphenation mistakes?

Changed 11 months ago by ire

Auto-hyphenation in English

comment:3 Changed 11 months ago by ire

I think the hyphenation looks a bit weird when it's in English, since the words aren't that long (See screenshot. So I don't think having it on *all* content works, but maybe we should consider adding it only for specific languages?

comment:4 Changed 10 months ago by lisabielik

I agree with @ire. It can be useful for certain languages (probably German, for one), but not all.

Also keep in mind that badly hyphenated wording is more annoying to read than non-hyphenated.

comment:5 Changed 10 months ago by juliandoucette

Additional feedback from Tamara:

Most of the languages that we support can be hyphenated, but I'd say it would make sense only for text like in the example, which has to be displayed inside a textbox or button and there are character restrictions due to the limited space.

comment:6 Changed 10 months ago by juliandoucette

Based on Lisa & Tamara's feedback I will:

  1. Convert this change request to a bug report
  2. Fix this bug in the place identified
  3. Fix this bug anywhere else I find easily
  4. Consider addressing this issue separately in website-defaults

comment:7 Changed 10 months ago by jeen

Yup agree with the above approach - and only applying it to items with small fixed minimum widths (below 120px for example).

comment:8 Changed 10 months ago by ire

  • Description modified (diff)
  • Owner set to ire
  • Ready set
  • Summary changed from Enable hyphenation on adblockplus.org to Fix overflowing text on adblockplus.org/nl/features

comment:9 Changed 10 months ago by ire

  • Review URL(s) modified (diff)
  • Status changed from new to reviewing

comment:10 Changed 10 months ago by juliandoucette

  • Priority changed from P2 to P3

Reprioritizing because this seems to affect very few languages/widgets on this website (possibly none after new abp.org updates).

(Sorry trev, I can't remove you as reporter. Please ignore.)

comment:11 Changed 10 months ago by abpbot

A commit referencing this issue has landed:
Issue 6111 - Fix overflowing text on adblockplus.org/nl/features

comment:12 Changed 10 months ago by ire

  • Resolution set to fixed
  • Status changed from reviewing to closed
Note: See TracTickets for help on using tickets.