Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I considered a skeuomorph using yellow paper with lines but it seemed tacky and didn't fit the overall design of the page. The textarea fills an entire "panel" on the page just like other panels of read-only text, so it can't be set off like it normally would be in a traditional HTML form.

share|improve this question
1  
How about hint text like FB's "What's on your mind?", but rendered in some great handwriting-type font? –  SNag Aug 27 '13 at 18:32
    
A placeholder like that would work nicely, in fact I'm already using one when the text area is empty. But often times the area will be pre-populated with text, so a placeholder isn't practical when that happens. –  hartz1989 Aug 27 '13 at 18:55
add comment

2 Answers

up vote 1 down vote accepted

You could put a distinct border on the field, or on the panel that contains the field (use both border width and colour) then place a key somewhere that shows both the editable and uneditable field stylings. Along with this you could tag it as editable, maybe in the label for the field.

Remember that styles associated with uneditable, such as greying things out, also imply that a feature might be editable under certain conditions, so you may have 'editable', 'uneditable' and 'never editable' as states.

Also, if you strictly follow a style guide for 'editable' across your entire app (active, inactive, focused etc.) you will give a user a consistent set of implicit guidelines for what is editable and what isn't. The login / register form for example can follow this style guide.

Both the above ideas will provide consistent visual clues.

A step further, especially in the case of having many editable and uneditable panels on the same page would be to number the fields that can be edited.

You should also consider tab order for the fields and auto-focusing on relevant fields

share|improve this answer
add comment

In addition to what @ColinSharp mentioned above, you could at an icon to the corner of the field, maybe a pencil, to help indicate that the area is editable.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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