18

In most applications that I'm familiar with, a text cursor in insertion mode is universally represented as a vertical blinking bar:

vertical bar blinking cursor

As you can see, for some italic letters this creates visual artifacts: cursor overlaps part of the letter. This becomes particularly jarring when using a narrow and tall fonts such as Agency or Impact:

enter image description here

The problem is not only with the cursor, but also with the letter's background. For example selecting the letter "l" will make a large part of that letter hang outside the selection box, which makes it really unclear as to what is actually selected.

An obvious (and logical) solution would be to change the cursor from vertical bar to slanted bar, so that the cursor would have the same general slope as the surrounding letters. It could look something like this (only antialiased of course):

enter image description here

Similarly, for the selection (and general background rendering) we would replace the vertical rectangle with the parallelogram that follows the slope of the italic font.

Minor technical difficulties aside (how to determine the slope of the italic?) — what is the reason why no text editor uses a slanted cursor / slanted background within the italic text? Does it or does it not provide a better UX? If I were to implement this feature in my own text editor would the users find it useful or confusing?

EDIT: MS Word uses slanted cursor within italic text, however they fail to properly match the slope of the font under the cursor, and the cursor goes back to upright when switching to rtl script. Also, the letter's background is always upright. It looks like this:

enter image description here

(in case you were wondering: initial Hel is highlighted here)

2 Answers 2

15

Having your cursor slanted would be a UX improvement over a permanently vertical cursor. Many word processors already do this. Here are some examples from MS Word:

enter image description here
enter image description here

It gives additional feedback to a user that the text they enter will be italic, and it is visually less confusing when selecting text. At the same time, I can't think of any reason that it would cause any problems for users.

Technically, you have to realise that not all italic fonts have the same slant, so you will have to deal with that. But otherwise it is a good idea.

4
  • 2
    I thought you'd be right that it would be a nightmare trying to figure out the angle, but turns out there are metrics for precisely this purpose built into the TrueType spec; caretSlopeRise, caretSlopeRun and caretOffset, and they "are used to specify the proper angle for the caret when displayed with this font. A rise of 1 and run of 0 will specify a vertical caret. A rise of 0 and run of 1 will specify a horizontal caret. Something in-between will be desirable for fonts whose glyphs are obliqued or italic."
    – Kit Grose
    Apr 9, 2013 at 6:55
  • @KitGrose I never said it was very difficult, just that it was a consideration.
    – JohnGB
    Apr 9, 2013 at 8:17
  • One interesting factor to consider too would be how to visually handle a text selection that spans across both upright and oblique text.
    – Kit Grose
    Apr 11, 2013 at 23:47
  • Highlighting spans would be pretty simple. The selection opening angle would follow the slope of the first character in the selection. And the closing angle would follow the slope of the last character within the selection. Carets should follow the slope of the typing font (the font of the letter that would appear if I typed a letter right now.) May 28, 2013 at 19:31
1

What I think is weird in your example is that the l is crossed with the caret. The caret location should have been tweaked in the font so that is clear whether the caret is before or after the glyph.

One should always be careful in deviating from the OS' or browser default behavior, especially for such a common control as a text input. I think your proposal, although perhaps unpractical as you already mentioned, makes sense for UX because it might communicate more clearly about caret position and selection. Seeing however that a lot of editors don't do this, I'm curious if this is for technical reasons (having to support any thinkable font) or that user testing didn't reveal significant advantages.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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