-4

The site we are working in is done in metro design style. Some of the content is generated by user. We have quite big font size and very little space for Titles, Descriptions, Headings which will be created by user. If there will be only "w" in the title, only 17 signs fit in, if other letters are used (not so wide) more signs will be available.

The question is: how to limit length of titles, descriptions and headings?

Improve this question
4
  • What do you mean by 'how' in this situation? You mean actually restricting them from doing so?
    – JonW ♦
    Commented Jul 3, 2013 at 7:52
  • I mean what kind of limitation to implement? Maximum sign quantity? Maximum width?
    – Oleg
    Commented Jul 3, 2013 at 8:01
  • What actually happens if there are more characters than there is space for? Does it wrap? Do the extra characters just not display? Is there going to be issues if you do choose to wrap the text? As K. suggests, this is all stuff that should have been taken into account when the site was planned and designed. 17 characters is very small, your title is short by UX.SE standards, but it is still 24 characters long. I think you should go back to the drawing board and plan in decent length titles rather than just hacking what has been built to provide workarounds for not displaying them.
    – JonW ♦
    Commented Jul 3, 2013 at 8:40
  • 4
    This question appears to be off-topic because it is about implementation rather than UX
    – Benny Skogberg
    Commented Jul 3, 2013 at 20:05

3 Answers 3

Reset to default
1
  • You could fade the title at the right border of the tile. So it would be obvious for user that there is a long text. It's an easiest way.
    enter image description here
  • You could also use javascript to calculate maximum visible part of the title.
  • You could also transform your weakness to strength. Make it your point, limit to 25 symbols (like the limits of Twitter)!
Improve this answer
0

You should had this in mind when you started the design.

Now the only things you can do is forcing the user to use short descriptions and titles or using automatically generated ellipses. Both suboptimal solutions.

Improve this answer
2
  • I did. The question is how to limit the length? 15 signs? 20 signs? 25 signs? The amount of signs that fit in depends on which signs are used, because signs have different width
    – Oleg
    Commented Jul 3, 2013 at 8:00
  • 1
    Then it's more an implementation question than an UX question. Because your UX decision of forcing the user to use less chars has already been made.
    – K..
    Commented Jul 3, 2013 at 8:18
0

I think you should do it not by limit the number of the characters, but instead of that you should cut the headline with CSS text-overflow: ellipsis.

Additionally you can provide the user the full information with a tooltip (mouseover) with the entire headline.

Improve this answer

Not the answer you're looking for? Browse other questions tagged or ask your own question.